I have a WPF MVVM project that includes a View which contains several controls.
There is a DockPanel which contains all the controls in the View with DataContext to a MainViewModel Class, and inside of it there is a Grid with DataContext to other object ViewModel which it's property contained in the MainViewModel Class.
Now, in that Grid I have a 2 buttons surrounds with WrapPanel, and the buttons have a Commands to a property which wrote in the MainViewModel Class, and when I pressed on it nothing happens (Because the Grid's DataContext is to other object).
I need the Commands to be stay in the MainViewModel Class, How can I do that?
XAML: (just the relevant parts)
<DockPanel x:Name="MonitorParent" DataContext="{Binding MonitorMainViewModel}" LastChildFill="False" Width="1144" HorizontalAlignment="Left">
.......
<StackPanel>
<ContentControl Visibility="{Binding Path=NoMonitorsMessageVisibility, Converter={StaticResource visibilityConverter}}">
<StackPanel Width="804" Height="574">
<Grid DataContext="{Binding CurrentMonitor}" Margin="10 0" Height="auto">
<Grid.RowDefinitions>
<RowDefinition Height="Auto" MinHeight="23" />
<RowDefinition Height="Auto" MinHeight="23" />
<RowDefinition Height="Auto" MinHeight="23" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="140" />
</Grid.ColumnDefinitions>
<Label Grid.Column="0" Grid.Row="15" Content="Serial Number" x:Name="SerialNumber" />
<WrapPanel DataContext="{Binding MonitorMainViewModel}" HorizontalAlignment="Center" Margin="0,10,0,10" Grid.ColumnSpan="2" Grid.Row="6" >
<Button Content="Add" Width="60" Margin="0,0,40,0" Command="{Binding AddConfidenceCommand}" />
<Button Content="Delete" Width="60" Margin="30,0,0,0" Command="{Binding DeleteConfidenceCommand}"/>
</WrapPanel>
........
</DockPanel
You could use the name of the DockPanel for binding like this:
<DockPanel x:Name="MonitorParent" DataContext="{Binding MonitorMainViewModel}" LastChildFill="False" Width="1144" HorizontalAlignment="Left">
.......
<StackPanel>
<ContentControl Visibility="{Binding Path=NoMonitorsMessageVisibility, Converter={StaticResource visibilityConverter}}">
<StackPanel Width="804" Height="574">
<Grid DataContext="{Binding CurrentMonitor}" Margin="10 0" Height="auto">
<Grid.RowDefinitions>
<RowDefinition Height="Auto" MinHeight="23" />
<RowDefinition Height="Auto" MinHeight="23" />
<RowDefinition Height="Auto" MinHeight="23" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="140" />
</Grid.ColumnDefinitions>
<Label Grid.Column="0" Grid.Row="15" Content="Serial Number" x:Name="SerialNumber" />
<WrapPanel DataContext="{Binding MonitorMainViewModel}" HorizontalAlignment="Center" Margin="0,10,0,10" Grid.ColumnSpan="2" Grid.Row="6" >
<Button Content="Add" Width="60" Margin="0,0,40,0" Command="{Binding ElementName=MonitorParent, Path=DataContext.AddConfidenceCommand}" />
<Button Content="Delete" Width="60" Margin="30,0,0,0" Command="{Binding ElementName=MonitorParent, Path=DataContext.DeleteConfidenceCommand}"/>
</WrapPanel>
........
Try this:
<Button Content="Add" Width="60" Margin="0,0,40,0"
Command="{Binding DataContext.AddConfidenceCommand, ElementName=MonitorParent}" />
Or:
<Button Content="Add" Width="60" Margin="0,0,40,0"
Command="{Binding DataContext.AddConfidenceCommand, RelativeSource={RelativeSource AncestorType=DockPanel}}" />
Related
I'm implementing a NavigationView like described is this topic.
Between the nav items (NavigationViewItem) I need to add a simple button, that will just execute an action, it will not navigate anywhere.
Every control I add to nav receives the property to stay selected when clicked, but I need a control that doesn't deselect the current nav, just execute an action.
Does anyone know how to do this or can suggest a solution? Grateful.
but I need a control that doesn't deselect the current nav, just execute an action.
Sure, you could edit the default NavigationView style and insert button into PaneContentGrid, and you could get default NavigationView style from generic.xaml file, then find PaneContentGrid add button like the following (InsertButton).
<SplitView.Pane>
<Grid x:Name="PaneContentGrid" Visibility="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.LeftPaneVisibility}">
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="0" />
<!-- above button margin + back button space -->
<RowDefinition x:Name="PaneContentGridToggleButtonRow" Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="8" />
<!-- above list margin -->
<RowDefinition Height="*" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="8" />
</Grid.RowDefinitions>
<Grid x:Name="ContentPaneTopPadding" Height="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.TopPadding}" />
<Grid Grid.Row="2" Height="{StaticResource PaneToggleButtonHeight}">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="{ThemeResource PaneToggleButtonWidth}" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<ContentControl
x:Name="PaneHeaderContentBorder"
Grid.Column="1"
HorizontalContentAlignment="Stretch"
VerticalContentAlignment="Stretch"
IsTabStop="False" />
</Grid>
<Grid
x:Name="AutoSuggestArea"
Grid.Row="3"
Height="{ThemeResource NavigationViewTopPaneHeight}"
VerticalAlignment="Center">
<ContentControl
x:Name="PaneAutoSuggestBoxPresenter"
Margin="{ThemeResource NavigationViewAutoSuggestBoxMargin}"
HorizontalContentAlignment="Stretch"
VerticalContentAlignment="Center"
IsTabStop="False" />
<Button
x:Name="PaneAutoSuggestButton"
Width="{TemplateBinding CompactPaneLength}"
Style="{ThemeResource NavigationViewPaneSearchButtonStyle}"
Visibility="Collapsed" />
</Grid>
<ContentControl
x:Name="PaneCustomContentBorder"
Grid.Row="4"
HorizontalContentAlignment="Stretch"
VerticalContentAlignment="Stretch"
IsTabStop="False" />
<!-- Left nav list -->
<NavigationViewList
x:Name="MenuItemsHost"
Grid.Row="6"
Margin="0,0,0,20"
HorizontalAlignment="Stretch"
IsItemClickEnabled="True"
ItemContainerStyle="{TemplateBinding MenuItemContainerStyle}"
ItemContainerStyleSelector="{TemplateBinding MenuItemContainerStyleSelector}"
ItemTemplate="{TemplateBinding MenuItemTemplate}"
ItemTemplateSelector="{TemplateBinding MenuItemTemplateSelector}"
SelectedItem="{TemplateBinding SelectedItem}"
SelectionMode="Single"
SingleSelectionFollowsFocus="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.SingleSelectionFollowsFocus}" />
<ContentControl
x:Name="FooterContentBorder"
Grid.Row="7"
HorizontalContentAlignment="Stretch"
VerticalContentAlignment="Stretch"
IsTabStop="False" />
<Button Grid.Row="7" Content="Command" x:Name="InsertButton"/>
<NavigationViewItem
x:Name="SettingsNavPaneItem"
Grid.Row="8"
Icon="Setting" />
</Grid>
</SplitView.Pane>
If you don't want to edit style, you could also insert button into NavigationView PaneFooter like following
<NavigationView x:Name="nvSample">
<NavigationView.MenuItems>
<NavigationViewItem
Content="Menu Item1"
Icon="Play"
Tag="SamplePage1" />
<NavigationViewItem
Content="Menu Item2"
Icon="Save"
Tag="SamplePage2" />
<NavigationViewItem
Content="Menu Item3"
Icon="Refresh"
Tag="SamplePage3" />
<NavigationViewItem
Content="Menu Item4"
Icon="Download"
Tag="SamplePage4" />
</NavigationView.MenuItems>
<Frame x:Name="contentFrame" />
<NavigationView.PaneFooter>
<Button Content="Click"/>
</NavigationView.PaneFooter>
</NavigationView>
I am trying to use grid system as suggestion by another user to another question of mine I have tried to implement the grid system but with little success it is placing the buttons and the grid where i want them but the textbox for name and with should be at the bottom of the listview
These three controls should appear at the bottom of the list view
<TextBox Name="txtDsiplayName" Text="{Binding Path=CustomColumnsDisplayName, Mode=TwoWay}" Height="23"
Width="452" Margin="0,149.86,0,188.5" Grid.ColumnSpan="2" />
<Label Content="Width:" Height="400" VerticalAlignment="Bottom" Grid.ColumnSpan="2" HorizontalAlignment="Left" Width="452" />
<TextBox Name="txtWdith" Width ="30" Height="23" Margin="211,149.86,6,188.5" Grid.Row="1" />
What am I doing wrong?
But as you see the text box is not showing correctly and the list view should be aligned to the top of the move up button winforms I forgive thee and still love ya.
<Grid Margin="0,20,0,0" VerticalAlignment="Top" Height="400">
<Grid.RowDefinitions>
<RowDefinition Height="28" />
<RowDefinition Height="*"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="100"/>
<ColumnDefinition Width="100"/>
</Grid.ColumnDefinitions>
<Label Grid.Row="0" Content="Custom Fields" Margin="12,0,0,0" Grid.ColumnSpan="2"></Label>
<StackPanel Grid.Row="1" Grid.Column="0" VerticalAlignment="Top" Grid.ColumnSpan="2">
<Expander Margin="0,0,0,0"
IsExpanded="true"
Header="Custom Columns">
<Grid Margin="12,0,10,0">
<Grid.RowDefinitions>
<RowDefinition Height="38.64" />
<RowDefinition Height="361.36"/>
<RowDefinition Height="*"/>
<RowDefinition Height="400"/>
<RowDefinition Height="400"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="247" />
<ColumnDefinition Width="205"/>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="Auto" />
</Grid.ColumnDefinitions>
<ListView Name="listView1"
MinHeight="80"
SelectionMode="Single" Margin="0,11.36,0,108.4" SelectionChanged="listView1_SelectionChanged" Grid.Row="1" Grid.ColumnSpan="2">
<ListView.View>
<GridView>
<GridViewColumn Header="Order" Width="100"
DisplayMemberBinding="{Binding Path=CustomColumnsOrder}"></GridViewColumn>
<GridViewColumn Header="Display Name" Width="290"
DisplayMemberBinding="{Binding Path=CustomColumnsDisplayName}"></GridViewColumn>
<GridViewColumn Header="Width" Width="50"
DisplayMemberBinding="{Binding Path=CustomColumnsWidth}"></GridViewColumn>
</GridView>
</ListView.View>
</ListView>
<Label Content="Name:" Grid.ColumnSpan="2" />
<TextBox Name="txtDsiplayName" Text="{Binding Path=CustomColumnsDisplayName, Mode=TwoWay}" Height="23"
Width="452" Margin="0,149.86,0,188.5" Grid.ColumnSpan="2" />
<Label Content="Width:" Height="400" VerticalAlignment="Bottom" Grid.ColumnSpan="2" HorizontalAlignment="Left" Width="452" />
<TextBox Name="txtWdith" Width ="30" Height="23" Margin="211,149.86,6,188.5" Grid.Row="1" />
<StackPanel Grid.Column="3" Grid.Row="2" Margin="0,0,74,0" Grid.RowSpan="2"/>
<StackPanel Grid.Column="2" Margin="0" Grid.RowSpan="2" Grid.ColumnSpan="2">
<Button Name="moveUpButton" Click="MoveUp" DockPanel.Dock="Right" Content="Move Up"
Height="22" Width="74" />
<Button Name="moveDownButton" Click="MoveDown" DockPanel.Dock="Right" Content="Move Down"
Height="22" Width="74" />
<Button Name="deleteButton" IsEnabled="{Binding ElementName=columnsList, Path=SelectedItems.Count}" Click="RemoveColumn" DockPanel.Dock="Right" Content="Delete"
Height="22" Width="74" />
<Button Name="addButton" Click="AddColumn" Content="Add Item"
Height="22" Width="74" />
</StackPanel>
</Grid>
</Expander>
</StackPanel>
</Grid>
It looks like the grid row height and the text box margin are conflicting with each other, if you remove the margin line from the text box you should see it moves to the top.
I would suggest removing the margins and just try to make use of heights to position the controls.
Something like this maybe? (You will need to add back in your heights/widths etc, but it gives you a rough idea)
<Grid VerticalAlignment="Top">
<Grid.RowDefinitions>
<RowDefinition />
<RowDefinition />
</Grid.RowDefinitions>
<Label Content="Custom Fields" />
<StackPanel Grid.Row="1" VerticalAlignment="Top">
<Expander Header="Custom Columns" IsExpanded="true">
<Grid>
<Grid.RowDefinitions>
<RowDefinition />
<RowDefinition />
<RowDefinition />
<RowDefinition />
<RowDefinition />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition />
<ColumnDefinition />
<ColumnDefinition />
<ColumnDefinition />
</Grid.ColumnDefinitions>
<ListView Name="listView1" Grid.Row="0" Grid.Column="0" Grid.ColumnSpan="3" SelectionMode="Single">
<ListView.View>
<GridView>
<GridViewColumn DisplayMemberBinding="{Binding Path=CustomColumnsOrder}" Header="Order" />
<GridViewColumn DisplayMemberBinding="{Binding Path=CustomColumnsDisplayName}" Header="Display Name" />
<GridViewColumn DisplayMemberBinding="{Binding Path=CustomColumnsWidth}" Header="Width" />
</GridView>
</ListView.View>
</ListView>
<StackPanel Grid.Row="1" Grid.RowSpan="2" Grid.Column="3">
<Button Name="moveUpButton" Content="Move Up" DockPanel.Dock="Right" />
<Button Name="moveDownButton" Content="Move Down" DockPanel.Dock="Right" />
<Button Name="deleteButton" Content="Delete" DockPanel.Dock="Right" IsEnabled="{Binding ElementName=columnsList, Path=SelectedItems.Count}" />
<Button Name="addButton" Content="Add Item" />
</StackPanel>
<Label Grid.Row="3"
Grid.Column="0"
Grid.ColumnSpan="2"
HorizontalAlignment="Left"
VerticalAlignment="Bottom"
Content="Name:" />
<TextBox Name="txtDsiplayName" Grid.Row="3" Grid.Column="1" Grid.ColumnSpan="2" Text="{Binding Path=CustomColumnsDisplayName, Mode=TwoWay}" />
<Label Grid.Row="4"
Grid.Column="0"
Grid.ColumnSpan="2"
HorizontalAlignment="Left"
VerticalAlignment="Bottom"
Content="Width:" />
<TextBox Name="txtWdith" Grid.Row="4" Grid.Column="1" Grid.ColumnSpan="2" />
</Grid>
</Expander>
</StackPanel>
</Grid>
I have a .NET 4.0 WPF application using the MVVM pattern and I've been unable to achieve the desired outcome on one of the screens (UserControl as View). I have stripped down most of the page to show the core of the problem. The page consists of a grid with three rows and one column. The first row contains header text and the last row contains a Save button. The middle row contains a grid with one row and column and displays an ObservableCollection in an ItemsControl with a data template of a custom user control. There are ten items in the collection and I want them to display in two columns and five rows so I have a WrapPanel as an ItemsPanelTemplate.
I want the ItemsControl to scroll within the available space but it is expanding to the size of content and most of it is being cropped off the bottom of the page.
I am listing the XAML for user control the ObservableCollection uses as a data template and the XAML for the main page below that. Any help is greatly appreciated.
<UserControl x:Class="OIL.UserControls.ShopNotes.ShopNoteComponent"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
mc:Ignorable="d"
d:DesignHeight="120" d:DesignWidth="150">
<Grid>
<Grid.RowDefinitions>
<RowDefinition />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition />
</Grid.ColumnDefinitions>
<Border Grid.Row="0" Grid.Column="0" Width="140" Margin="5,5,5,5" HorizontalAlignment="Center" VerticalAlignment="Top" BorderBrush="Black" BorderThickness="1" CornerRadius="5">
<StackPanel Width="120" Margin="0,5,0,5" HorizontalAlignment="Center" VerticalAlignment="Top" Orientation="Vertical">
<Image Height="25" Width="30" HorizontalAlignment="Left" Source="/OIL;component/Images/BlueCam.png">
<Image.ToolTip>
<Image Source="{Binding Path=ToolTipImagePath}" />
</Image.ToolTip>
</Image>
<Label Style="{DynamicResource LargeText}" Content="{Binding Path=ComponentTitle}" />
<CheckBox Width="80" Margin="0,5,0,5" HorizontalAlignment="Left" Style="{DynamicResource NormalText}" Content=" Mandatory?"
IsChecked="{Binding Path=ComponentMandatory, Mode=TwoWay}"
IsEnabled="{Binding Path=ComponentSelected}" />
<CheckBox Width="15" Margin="0,5,0,5" HorizontalAlignment="Center"
IsChecked="{Binding Path=ComponentSelected, Mode=TwoWay}" />
</StackPanel>
</Border>
</Grid>
And here is the main XAML page:
<UserControl x:Class="OIL.View.ConfiguratorViews.Configurator_ShopNotes_Tab"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:igWPF="http://infragistics.com/Editors"
xmlns:uc="clr-namespace:OIL.UserControls.ShopNotes"
mc:Ignorable="d"
d:DesignHeight="570" d:DesignWidth="866">
<UserControl.Resources>
<BooleanToVisibilityConverter x:Key="BooleanToVisibilityConverter" />
<DataTemplate x:Key="ShopNotesComponentsTemplate">
<uc:ShopNoteComponent />
</DataTemplate>
</UserControl.Resources>
<Border Margin="10" CornerRadius="13" BorderThickness="3" BorderBrush="#FF666666">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="40" />
<RowDefinition Height="*" />
<RowDefinition Height="50" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<StackPanel Grid.Row="0" Grid.Column="0" Orientation="Horizontal">
<Button Height="30" Width="75" Margin="10,5,0,5" HorizontalAlignment="Center" VerticalAlignment="Center" Background="{x:Null}"
Command="{Binding Path=AddNewTemplateCommand}"
Content="Add" />
<Button Height="30" Width="75" Margin="10,5,0,5" HorizontalAlignment="Center" VerticalAlignment="Center" Background="{x:Null}"
Command="{Binding Path=EditTemplateCommand}"
Content="Edit" />
<Grid Margin="10,5,0,5">
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<StackPanel Grid.Row="0" Grid.Column="0" Orientation="Horizontal" Visibility="{Binding Path=IsNewTemplate, Converter={StaticResource BooleanToVisibilityConverter}}">
<TextBox Height="30" Width="250" HorizontalAlignment="Left" VerticalAlignment="Center" Style="{DynamicResource NormalText}" Text="{Binding Path=TemplateDescription}" />
</StackPanel>
<StackPanel Grid.Row="0" Grid.Column="0" Orientation="Horizontal" Visibility="{Binding Path=IsEditedTemplate, Converter={StaticResource BooleanToVisibilityConverter}}">
<igWPF:XamComboEditor Name="cmbShopNotesTemplate" Height="30" HorizontalAlignment="Left" VerticalAlignment="Center"
ItemsSource="{Binding Path=ShopNoteTemplates, Mode=TwoWay}"
DisplayMemberPath="CONFIGURATION_DESC"
SelectedItem="{Binding Path=SelectedShopNoteTemplate, ValidatesOnDataErrors=True}"
Value="Select Shop Notes Template"
NullText="Select Shop Notes Template"
IsEditable="True">
</igWPF:XamComboEditor>
</StackPanel>
</Grid>
</StackPanel>
<Grid Grid.Row="1" Grid.Column="0">
<Grid.RowDefinitions>
<RowDefinition Height="40" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Label Grid.Row="0" Grid.Column="0" Height="30" Margin="0,5,0,5" HorizontalAlignment="Center" VerticalAlignment="Center" Style="{DynamicResource NormalText}" Content="* Hover over camera icon to view Shop Note component" />
<ItemsControl Grid.Row="1" Grid.Column="0" HorizontalAlignment="Left"
ItemsSource="{Binding Path=ShopNoteComponents, UpdateSourceTrigger=PropertyChanged, Mode=TwoWay}"
ItemTemplate="{StaticResource ShopNotesComponentsTemplate}">
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<WrapPanel Width="300" />
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
</ItemsControl>
</Grid>
<Button Grid.Row="2" Grid.Column="0" Height="30" Width="150" Margin="10,10,0,10" HorizontalAlignment="Left" VerticalAlignment="Center"
Background="{x:Null}"
Command="{Binding Path=SaveTemplateCommand}"
Content="Save" />
</Grid>
</Border>
EDIT: Changed question title as I have removed the ScrollViewer between starting the question and actually posting it. Also, noticed the Save button was in the inner grid rather than outer grid so I have corrected that (no change in rendering).
An ItemsControl does not have its own ScrollViewer like a ListBox. You can either replace you ItemsControl with a ListBox, or simply wrap it in a ScrollViwer, being careful to move the Grid.Row and Grid.Column settings like this:
<ScrollViewer Grid.Row="1" Grid.Column="0">
<ItemsControl HorizontalAlignment="Left" ItemsSource="{Binding Path=Items,
UpdateSourceTrigger=PropertyChanged, Mode=TwoWay}"
ItemTemplate="{StaticResource ShopNotesComponentsTemplate}">
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<WrapPanel Width="300" />
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
</ItemsControl>
</ScrollViewer>
Hi I see there have been many questions about ListBox and filling the entire space for the DataTemplate but I still cannot get anything to work. What I have is a ListBox and the DataTemplate has a UserControl. How do I get my UserControl to stretch the data to fill the space?
MainWindow XAML snippet:
<ListBox x:Name="ConfiguredItemsList">
<ListBox.ItemTemplate>
<DataTemplate>
<local:ConfiguredItem DataContext="{Binding}" HorizontalContentAlignment="Stretch" />
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
UserControl XAML snippet:
<UserControl.Resources>
<local:ImagePathConverter x:Key="ImagePathConverter"/>
</UserControl.Resources>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="75" />
</Grid.ColumnDefinitions>
<Grid Grid.Column="0">
<Grid.RowDefinitions>
<RowDefinition Height="*" />
<RowDefinition Height="*" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="100" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<TextBlock Grid.Row="0" Grid.Column="0" x:Name="NameLabel" Text="Name:" />
<TextBlock Grid.Row="0" Grid.Column="1" x:Name="tbName" Text="{Binding Path=Name}" />
<TextBlock Grid.Row="1" Grid.Column="0" x:Name="DescriptionLabel" Text="Description: " />
<TextBlock Grid.Row="1" Grid.Column="1" x:Name="Description" Text="{Binding Path=Description}" />
<TextBlock Grid.Row="2" Grid.Column="0" x:Name="TimeLabel" Text="Time:" />
<TextBlock Grid.Row="2" Grid.Column="1" x:Name="Time" Text="{Binding Path=ChangeTime, StringFormat={}{0:h:mm tt}}" />
</Grid>
<Border Grid.Column="1" BorderThickness="1" BorderBrush="Black">
<Image Source="{Binding Path=WallpaperInfo, Converter={StaticResource ImagePathConverter}}" />
</Border>
</Grid>
Have you tried to set HorizontalContentAlignment to stretch on list box level?
<ListBox x:Name="ConfiguredItemsList" HorizontalContentAlignment="Stretch">
<ListBox.ItemTemplate>
<DataTemplate>
<local:ConfiguredItem DataContext="{Binding}"/>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
Note: I have set HorizontalContentAlignment property of ListBox instead of Item.
I am playing around with WPF for the first time and i am tring to show / hide group objects on a test toolbar based on a toggle button.
The toolbar is created via a template in a resource dictionary and i cannot figure out how to get this working as it seems alot more of an issue compared to winforms.
Out of all the examples i have found they all seem to function if the item is not templated is there any way i can acheive this.
my code so far is below and the point of failure is on the login togglebutton as i have x:name reference and apparently i cannot do this as its part of a resource dictionary, so i am pretty stumped...
<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:s="clr-namespace:wpfApplication1">
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="pack://application:,,,/wpfApplication1;component/Resources/Styles/Shared.xaml"/>
<ResourceDictionary Source="pack://application:,,,/wpfApplication1;component/Resources/Styles/ToolBar.xaml"/>
</ResourceDictionary.MergedDictionaries>
<ToolBar x:Key="MyToolbar" Height="120">
<ToolBar.Resources>
<BooleanToVisibilityConverter x:Key="boolToVis"/>
</ToolBar.Resources>
<GroupBox x:Name="tBtn" Header="Login" Style="{StaticResource ToolbarGroup}" Margin="5,3,3,3">
<StackPanel Grid.Row="1" Orientation="Horizontal">
<!--Login-->
<ToggleButton Margin="3" Width="55" Style="{StaticResource ToolBarButtonBaseStyle}"
HorizontalContentAlignment="Center""
CommandTarget="{Binding ElementName=MyTestApp}">
<ToggleButton.Content>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="4*"/>
<RowDefinition Height="1*"/>
</Grid.RowDefinitions>
<Image Source="pack://application:,,,/wpfApplication1;component/Resources/Images/Login.png" Width="45"/>
<TextBlock Grid.Row="1" Text="New" VerticalAlignment="Bottom" HorizontalAlignment="Center"/>
</Grid>
</ToggleButton.Content>
</ToggleButton>
</StackPanel>
</GroupBox>
<GroupBox Visibility="{Binding Path=IsChecked, ElementName=tBtn, Converter={StaticResource boolToVis}}" Header="File" Style="{StaticResource ToolbarGroup}" Margin="5,3,3,3">
<StackPanel Grid.Row="1" Orientation="Horizontal">
<!--File-->
<Button Margin="3" Width="55" Style="{StaticResource ToolBarButtonBaseStyle}"
HorizontalContentAlignment="Center"
Command="{x:Static ApplicationCommands.New}"
CommandTarget="{Binding ElementName=MyTestApp}">
<Button.Content>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="4*"/>
<RowDefinition Height="1*"/>
</Grid.RowDefinitions>
<Image Source="pack://application:,,,/wpfApplication1;component/Resources/Images/GenericDocument.png" Width="45"/>
<TextBlock Grid.Row="1" Text="New" VerticalAlignment="Bottom" HorizontalAlignment="Center"/>
</Grid>
</Button.Content>
</Button>
<StackPanel Orientation="Vertical" Margin="0,2,0,2">
<Button Margin="1" Padding="2" HorizontalContentAlignment="Left"
Style="{StaticResource ToolBarButtonBaseStyle}"
Command="{x:Static ApplicationCommands.Open}"
CommandTarget="{Binding ElementName=MyTestApp}">
<Button.Content>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition/>
<ColumnDefinition/>
</Grid.ColumnDefinitions>
<Image Source="pack://application:,,,/wpfApplication1;component/Resources/Images/OpenFolder.png" Width="16"/>
<TextBlock Margin="3,0,3,0" Text="Open" VerticalAlignment="Center" Grid.Column="1"/>
</Grid>
</Button.Content>
</Button>
<Button Margin="1" Padding="2" HorizontalContentAlignment="Left"
Style="{StaticResource ToolBarButtonBaseStyle}"
Command="{x:Static ApplicationCommands.Save}"
CommandTarget="{Binding ElementName=MyTestApp}">
<Button.Content>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition/>
<ColumnDefinition />
</Grid.ColumnDefinitions>
<Image Source="pack://application:,,,/wpfApplication1;component/Resources/Images/Save.png" Width="16"/>
<TextBlock Margin="3,0,3,0" Text="Save" VerticalAlignment="Center" Grid.Column="1"/>
</Grid>
</Button.Content>
</Button>
<Button Margin="1" Padding="2" HorizontalContentAlignment="Left"
Style="{StaticResource ToolBarButtonBaseStyle}"
Command="{x:Static ApplicationCommands.Print}"
CommandTarget="{Binding ElementName=MyTestApp}">
<Button.Content>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition/>
<ColumnDefinition />
</Grid.ColumnDefinitions>
<Image Source="pack://application:,,,/wpfApplication1;component/Resources/Images/Print.png" Width="16"/>
<TextBlock Margin="3,0,3,0" Text="Print" VerticalAlignment="Center" Grid.Column="1"/>
</Grid>
</Button.Content>
</Button>
</StackPanel>
</StackPanel>
</GroupBox>
</ToolBar>
</ResourceDictionary>
Many thanks in advance for any assistance
now your GroupBox is called "tBtn" but that should be your ToggleButton. (as you are refering to its property IsChecked)
Try to name your ToggleButton tBtn and retry