I'm learning WPF/MVVM and got stuck on following...
The code below is working
<ListBox x:Name="listbox" DockPanel.Dock="Top" ItemsSource="{Binding Items}" DisplayMemberPath="Name" >
<ListBox.ContextMenu>
<ContextMenu DataContext="{Binding Path=PlacementTarget, RelativeSource={RelativeSource Self}}">
<MenuItem Header="Show Selected"
Command="{Binding Path=DataContext.ShowSelectedCommand}"
CommandParameter="{Binding Path=SelectedItems}"/>
</ContextMenu>
</ListBox.ContextMenu>
</ListBox>
but when I've replaced listbox on treeview, such as
<TreeView x:Name="tview" DockPanel.Dock="Top" DisplayMemberPath="Name" Tag="{Binding DataContext, RelativeSource={RelativeSource Self}}" ItemsSource="{Binding Items}" >
<TreeView.ContextMenu>
<ContextMenu DataContext="{Binding PlacementTarget.Tag, RelativeSource={RelativeSource Self}}" StaysOpen="true">
<MenuItem Header="Show Selected" Command="{Binding DataContext.ShowSelectedCommand}"
CommandParameter="{Binding Path=SelectedItems}">
</MenuItem>
</ContextMenu>
</TreeView.ContextMenu>
</TreeView>
The ShowSelectedCommand doesn't invoked. Could you please explain what's wrong there and how can I make it work. Thanks a lot.
Related
i have an observable collection as ItemSource for my menuitems.
i want a simple button (see commented part) at end of menu item list that can add new item to this collection.
it seem simple But it throw a System.Windows.Markup.XamlParseException in my code telling the collection is already in use.
what is the correct way to achieve this?
<Menu Background="Transparent">
<MenuItem Header="WorkSpace" Background="Transparent" ItemsSource="{Binding NosWorkSpaces}">
<ItemsControl.ItemTemplate>
<DataTemplate >
<StackPanel Orientation="Horizontal">
<Label Content="{Binding Original.Title}"></Label>
<Button Content="Select" Tag="WorkSpace_Load" Command="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType=mah:MetroWindow}, Path=DataContext.SelectWorkspaceCommand}" CommandParameter="{Binding }" />
<Button Content="Load" Tag="WorkSpace_Load" Command="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType=mah:MetroWindow}, Path=DataContext.LoadBinaryWorkspace}" CommandParameter="{Binding }" />
<Button Content="Save" Tag="WorkSpace_Save" Command="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType=mah:MetroWindow}, Path=DataContext.SaveWorkspaceCommand}" CommandParameter="{Binding }" />
</StackPanel>
</DataTemplate>
</ItemsControl.ItemTemplate>
<!-- <Button Content="New " /> this wont work -->
</MenuItem>
</Menu>
Well i found a solution mixing some answer, even i find it not so easy for a simple menu.
<Menu Height="24" VerticalAlignment="Top">
<Menu.Resources>
<CollectionViewSource Source="{Binding NosWorkSpaces}" x:Key="YourMenuItems"/>
</Menu.Resources>
<MenuItem Header="WorkSpaces" >
<MenuItem.ItemsSource>
<CompositeCollection>
<CollectionContainer Collection="{Binding Source={StaticResource YourMenuItems}}" />
<Separator></Separator>
<MenuItem Header="Add Worspace" />
</CompositeCollection>
</MenuItem.ItemsSource>
<MenuItem.ItemTemplate>
<DataTemplate >
<StackPanel Orientation="Horizontal">
<Label Content="{Binding Original.Title}"></Label>
<Button Content="Select" Tag="WorkSpace_Load" Command="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType=mah:MetroWindow}, Path=DataContext.SelectWorkspaceCommand}" CommandParameter="{Binding }" />
<Button Content="Load" Tag="WorkSpace_Load" Command="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType=mah:MetroWindow}, Path=DataContext.LoadBinaryWorkspace}" CommandParameter="{Binding }" />
<Button Content="Save" Tag="WorkSpace_Save" Command="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType=mah:MetroWindow}, Path=DataContext.SaveWorkspaceCommand}" CommandParameter="{Binding }" />
</StackPanel>
</DataTemplate>
</MenuItem.ItemTemplate>
</MenuItem>
</Menu>
giving a mixed menu with itemSource and datatemplate.
I'm having trouble getting the selection in a contextMenu to bind to my command EditCommand. The buttons in my tree-view bind to it fine, but in the menu it fails. I have read this is most likely due to the contextMenu being in a different UI tree, but solutions using findAncestor and tags have not worked for me. Is there anyway to do bind and still be able to pass the treeViewItem to the method?
My XAML:
<TreeView Background="Transparent"
Margin="10"
Grid.Column="0" Grid.Row="1"
ItemsSource="{Binding Path=TreeViewItems}">
<TreeView.ItemTemplate >
<HierarchicalDataTemplate DataType="{x:Type model:TreeViewSelection}" ItemsSource="{Binding Configs}" >
<DockPanel HorizontalAlignment="Stretch" Background="Transparent"><!--Transparency allows context click on whole row-->
<DockPanel.ContextMenu>
<ContextMenu DataContext="{Binding PlacementTarget.DataContext, RelativeSource={RelativeSource Self}}">
<MenuItem
Header="Edit"
Command="{Binding ElementName=userControl, Path=DataContext.EditCommand}"<!--Doesn't work-->
CommandParameter="{Binding}">
<MenuItem.Icon>
<Image Source="../Images/edit.png" />
</MenuItem.Icon>
</MenuItem>
</ContextMenu>
</DockPanel.ContextMenu>
<TextBlock DockPanel.Dock="Left" Text="{Binding Title}" />
<StackPanel DockPanel.Dock="Right"
Orientation="Horizontal"
HorizontalAlignment="Right">
<Button Height="23" Width="23"
Command="{Binding ElementName=userControl, Path=DataContext.EditCommand}"<!--Works-->
CommandParameter="{Binding}"
Style="{DynamicResource ImageNoTextButton}"
inf:AttachedProperties.Image="../Images/edit.png"
inf:AttachedProperties.ImageMouseOver="../Images/editMouseOver.png" />
</StackPanel>
</DockPanel>
</HierarchicalDataTemplate>
</TreeView.ItemTemplate>
</TreeView>
Try this:
<DockPanel HorizontalAlignment="Stretch" Background="Transparent"
Tag="{Binding RelativeSource={RelativeSource AncestorType=UserControl}}">
<DockPanel.ContextMenu>
<ContextMenu>
<MenuItem
Header="Edit"
Command="{Binding Path=PlacementTarget.Tag.DataContext.EditCommand, RelativeSource={RelativeSource AncestorType=ContextMenu}}"
CommandParameter="{Binding}">
<MenuItem.Icon>
<Image Source="../Images/edit.png" />
</MenuItem.Icon>
</MenuItem>
</ContextMenu>
</DockPanel.ContextMenu>
...
</DockPanel>
My Application consists of a MainWindow with a ContentControl and I change the ViewModel depending on the selected menu.
One of the UserControls I display as content contains the following WrapPanel:
<UserControl ...>
<Grid>
<WrapPanel>
<ItemsControl ItemsSource="{Binding Connections}">
<ItemsControl.ItemTemplate>
<DataTemplate>
<Button Command="{Binding DataContext.ConnectionSelectCommand, RelativeSource={RelativeSource AncestorType=ItemsControl}}"
CommandParameter="{Binding}"
FocusManager.FocusedElement="{Binding ElementName=InstanceName}"
Style="{DynamicResource DashboardButton}">
<TextBlock TextWrapping="Wrap" HorizontalAlignment="Center" Text="{Binding Name}" />
<Button.ContextMenu>
<ContextMenu>
<MenuItem Header="Delete"
Command="{Binding ConnectionRemoveCommand}"
CommandParameter="{Binding}" />
</ContextMenu>
</Button.ContextMenu>
</Button>
</DataTemplate>
</ItemsControl.ItemTemplate>
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<WrapPanel Orientation="Horizontal" />
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
</ItemsControl>
</WrapPanel>
</Grid>
</UserControl>
The Command on the ContextMenu doesn't work because it tries to call ConnectionRemoveCommand on the Connection object instead of the ConnectionViewModel which is the DataContext of the UserControl.
How do I bind the Command to the ConnectionViewModel with the CommandParameter being the Connection object?
If you bind the Tag property of the Button to the DataContext of the ItemsControl, you could then bind to it using the PlacementTarget of the ContextMenu:
<Button Command="{Binding DataContext.ConnectionSelectCommand, RelativeSource={RelativeSource AncestorType=ItemsControl}}"
CommandParameter="{Binding}"
FocusManager.FocusedElement="{Binding ElementName=InstanceName}"
Style="{DynamicResource DashboardButton}"
Tag="{Binding DataContext, RelativeSource={RelativeSource AncestorType=ItemsControl}}">
<TextBlock TextWrapping="Wrap" HorizontalAlignment="Center" Text="{Binding Name}" />
<Button.ContextMenu>
<ContextMenu>
<MenuItem Header="Delete"
Command="{Binding PlacementTarget.Tag.ConnectionRemoveCommand, RelativeSource={RelativeSource AncestorType=ContextMenu}}"
CommandParameter="{Binding}" />
</ContextMenu>
</Button.ContextMenu>
</Button>
I am having an Wpf application it has a Combobox.
which contains a checkbox and Textblock when i click on the checkbox
it shows the selected country string in the combobox but if i click on text it shows me a error string as shown in image.
I want to show the country name even if the user clicks on the textblock.
My xaml looks like this
<ComboBox Text="{Binding CurrentCountries}" ToolTip="{Binding CurrentCountries}" Grid.Column="0" Grid.Row="0" HorizontalAlignment="Left" Name="cmbCountry" IsEditable="True" IsReadOnly="True" TextSearch.TextPath="{Binding CountryName}" HorizontalContentAlignment="Left" Margin="80,14,0,0" VerticalAlignment="Top" Width="100 " ItemsSource="{Binding Country, Mode=TwoWay}" SelectedItem="{Binding SelectedCountry,Mode= TwoWay}" Height="22" TabIndex="1">
<ComboBox.ItemTemplate>
<DataTemplate>
<CheckBox Name="Country" HorizontalAlignment="Left" Grid.Column="0" Content="{Binding CountryName}" IsChecked="{Binding IsChecked}">
<i:Interaction.Triggers>
<i:EventTrigger EventName="Checked">
<Commands:EventToCommand Command="{Binding DataContext.CountryCheckedCmd,RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type telerik:RadWindow}}}" CommandParameter="{Binding ElementName=Country}" ></Commands:EventToCommand>
</i:EventTrigger>
<i:EventTrigger EventName="Unchecked">
<Commands:EventToCommand Command="{Binding DataContext.CountryUnCheckedCmd,RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type telerik:RadWindow}}}" CommandParameter="{Binding ElementName=Country}" ></Commands:EventToCommand>
</i:EventTrigger>
</i:Interaction.Triggers>
</CheckBox>
</DataTemplate>
</ComboBox.ItemTemplate>
</ComboBox>
thank you!
If you want to multiselection ComboBox you should use CheckComboBox from WPF Extended Toolkit.
It's very easy to using, example:
<xctk:CheckComboBox x:Name="_combo"
HorizontalAlignment="Center"
VerticalAlignment="Center"
DisplayMemberPath="Color"
ValueMemberPath="Level"
SelectedValue="{Binding SelectedValue}"
SelectedItems="{Binding SelectedItems}" />
I'm working with MenuItem in XAML, using InputGestureText I have added Keyboard shortcuts to menu items. What I'm confused about is how to display keyboard shortcut in the actual menu next to each item that has keyboard shortcut.
I don't want to add text to Header but rather display value of InputGestureText therefore it can be changed without having to modify header.
I'm using WPF Localization Extension
Code for Menu
<Menu Grid.Row="0" Height="30" >
<MenuItem Header="{lex:Loc Project75:lang:mnuFileMenu}">
<MenuItem Header="{lex:Loc Project75:lang:mnuFileMenuNew}">
<MenuItem Header="{lex:Loc Project75:lang:mnuFileMenuNew}" Command="{Binding Path=NewCommand}" InputGestureText="Ctrl+N"/>
<MenuItem Header="{lex:Loc Project75:lang:mnuFileMenuNewEmailTemplate}" Command="{Binding Path=NewEmailTemplateCommand}" />
<MenuItem Header="{lex:Loc Project75:lang:mnuFileMenuNewContact}" Command="{Binding Path=NewContactCommand}" />
</MenuItem>
<MenuItem Header="{lex:Loc Project75:lang:mnuFileMenuImport}" Command="{Binding Path=ImportCommand}" InputGestureText="Ctrl+I"/>
<MenuItem Header="{lex:Loc Project75:lang:mnuFileMenuExport}" Command="{Binding Path=ExportCommand}" InputGestureText="Ctrl+E"/>
<Separator/>
<MenuItem Header="{lex:Loc Project75:lang:mnuFileMenuSave}" Command="{Binding Path=SaveDocumentCommand}" InputGestureText="Ctrl+S"/>
<MenuItem Header="{lex:Loc Project75:lang:mnuFileMenuSaveAll}" Command="{Binding Path=SaveAllDocumentsCommand}" InputGestureText="Ctrl+Shift+S" ToolTip="Closes all open Windows"/>
<Separator/>
<MenuItem Header="{lex:Loc Project75:lang:mnuFileMenuClose}" Command="{Binding Path=CloseDocumentCommand}" InputGestureText="Ctrl+F4"/>
<MenuItem Header="{lex:Loc Project75:lang:mnuFileMenuCloseAll}" Command="{Binding Path=CloseAllDocumentsCommand}" InputGestureText="Ctrl+Shift+F4"/>
<Separator/>
<MenuItem Header="{lex:Loc Project75:lang:mnuFileMenuExit}" Command="{Binding Path=ExitCommand}" InputGestureText="Alt+F4"/>
</MenuItem>
<MenuItem Header="{lex:Loc Project75:lang:mnuHelpMenu}">
<MenuItem Header="{lex:Loc Project75:lang:mnuHelpMenuAbout}" Command="{Binding Path=AboutCommand}"/>
</MenuItem>
</Menu>
Try this out:
<Window.Resources>
<ControlTemplate TargetType="MenuItem" x:Key="controlTemplate">
<StackPanel Orientation="Horizontal">
<TextBlock Text="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=Header}"></TextBlock>
<TextBlock Text="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=InputGestureText}" Margin="5,0,0,0"></TextBlock>
</StackPanel>
</ControlTemplate>
</Window.Resources>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"></RowDefinition>
<RowDefinition></RowDefinition>
</Grid.RowDefinitions>
<Menu>
<MenuItem Header="Foo">
<MenuItem Header="Bar" Command="Copy" Template="{StaticResource controlTemplate}"></MenuItem>
</MenuItem>
</Menu>
</Grid>
I'm using the copy command as example but you can use any other command. Header can be localized as you are doing.