I am trying to create a Dynamic menu in WPF.
The below code is working fine, but the problem is it is not showing Icon image in the left side but with the header section.
Here is my XAML code
<Window x:Class="DynamicMenu.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:vm="clr-namespace:DynamicMenu.MenuItemViewModels"
xmlns:local="clr-namespace:DynamicMenu"
mc:Ignorable="d"
Title="MainWindow" Height="350" Width="525">
<Grid>
<StackPanel>
<Menu>
<MenuItem ItemsSource="{Binding Path=ChildMenuItems}" Header="Menu" >
<MenuItem.Resources>
<HierarchicalDataTemplate DataType="{x:Type vm:MenuItemViewModel}" ItemsSource="{Binding ChildMenuItems}">
<MenuItem Header="{Binding Path=Header}" >
<MenuItem.Icon>
<Image Source="{Binding IconFileName}" Height="16" />
</MenuItem.Icon>
</MenuItem>
</HierarchicalDataTemplate>
</MenuItem.Resources>
</MenuItem>
</Menu>
</StackPanel>
</Grid>
</Window>
Now, it looks like as below. But I want to show the icon on the left side.
Related
I'm new at WPF. I know from Forms that i can add usercontrols to a panel. How can I do this in WPF? I tried a Grid, DockPanel and StackPanel but I don't know how can I stretch my usercontrol? In this Grid oder what else will only be this usercontrol.
I need to switch the content of the grid or else because I want to display different usercontrols.
Main XAML
<Window x:Class="TaxHelper.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:entites="clr-namespace:TaxHelper.Entity"
xmlns:local="clr-namespace:TaxHelper"
xmlns:properties="clr-namespace:TaxHelper.Properties"
mc:Ignorable="d"
Title="TaxHelper" Height="558" Width="803">
<Window.Resources>
<local:InvoiceStatusIconConverter x:Key="IconConverter"/>
</Window.Resources>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="251*"/>
<ColumnDefinition Width="292*"/>
</Grid.ColumnDefinitions>
<DockPanel LastChildFill="True">
<Menu DockPanel.Dock="Top" Height="20" Margin="0,0,10,0">
<MenuItem Header="Datebank" Height="20">
<MenuItem Header="Importieren" Name="miImport" Click="miImport_Click"/>
</MenuItem>
<MenuItem Header="Daten" Height="20">
<MenuItem Header="Laden" Name="miLoadData" Click="miLoadData_Click"/>
</MenuItem>
<MenuItem Header="Tests" Height="20">
<MenuItem Header="Add Usercontrol" Name="miTestbutton" Click="miTestbutton_Click"/>
</MenuItem>
</Menu>
<StackPanel></StackPanel>
</DockPanel>
<TreeView x:Name="tvNavigation" Margin="10,26,10,10" HorizontalContentAlignment="Stretch" TreeViewItem.Expanded="tvNavigation_Expanded">
<TreeView.Resources>
<HierarchicalDataTemplate DataType="{x:Type entites:Owner}" ItemsSource="{Binding Items}">
<TextBlock Text="{Binding Name}"/>
</HierarchicalDataTemplate>
<HierarchicalDataTemplate DataType="{x:Type entites:EconomyUnit}" ItemsSource="{Binding Items}">
<TextBlock Text="{Binding Name}"/>
</HierarchicalDataTemplate>
<HierarchicalDataTemplate DataType="{x:Type entites:Report}" ItemsSource="{Binding Items}">
<TextBlock Text="{Binding Name}"/>
</HierarchicalDataTemplate>
<HierarchicalDataTemplate DataType="{x:Type entites:ReportItem}" ItemsSource="{Binding Items}">
<TextBlock Text="{Binding Name}"/>
</HierarchicalDataTemplate>
<HierarchicalDataTemplate DataType="{x:Type entites:Invoice}" ItemsSource="{Binding Items}">
<StackPanel Orientation="Horizontal">
<Image Source="{Binding Status, Converter={StaticResource IconConverter}}" MaxHeight="16px" MaxWidth="16px" HorizontalAlignment="Left"></Image>
<TextBlock Text="{Binding Company}"/>
</StackPanel>
</HierarchicalDataTemplate>
</TreeView.Resources>
</TreeView>
<!--<StackPanel x:Name="dpContent" Orientation="Vertical" HorizontalAlignment="Stretch" Height="507" Margin="10,10,10,0" VerticalAlignment="Top" Width="408" Grid.Column="1"/>-->
<Grid Height="Auto" Name="dpContent" Width="Auto" Grid.Column="1" Margin="24,26,29,10">
</Grid>
</Grid>
</Window>
Usercontrol:
<UserControl x:Class="TaxHelper.Invoice"
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:local="clr-namespace:TaxHelper"
xmlns:mpp="clr-namespace:MoonPdfLib;assembly=MoonPdfLib"
mc:Ignorable="d" Height="152.438" Width="132.531">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="81*"/>
<RowDefinition Height="14*"/>
</Grid.RowDefinitions>
<mpp:MoonPdfPanel Background="LightGray" ViewType="SinglePage" PageRowDisplay="ContinuousPageRows" PageMargin="0,2,4,2" AllowDrop="True" x:Name="mpp" x:FieldModifier="private"/>
<StackPanel Margin="0,1,0,0" Grid.Row="1">
<Button Content="Exit" Click="Button_Click" Height="12" FontSize="5" />
</StackPanel>
</Grid>
</UserControl>
Add Usercontrol:
private void miTestbutton_Click(object sender, RoutedEventArgs e)
{
Invoice invoice = new Invoice();
invoice.HorizontalAlignment = HorizontalAlignment.Stretch;
invoice.VerticalAlignment = VerticalAlignment.Stretch;
dpContent.Children.Add(invoice);
}
The declaration of the UserContol is setting hard coded values for Width and Height, which means that the control cannot resize itself.
If you replace those two attributes with d:DesignWidth and d:DesignHeight then those values become "design-time only" values, so those values will be used when you view the control in the Visual Studio designer, but not by the application at run-time...
<UserControl x:Class="TaxHelper.Invoice"
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:local="clr-namespace:TaxHelper"
xmlns:mpp="clr-namespace:MoonPdfLib;assembly=MoonPdfLib"
mc:Ignorable="d" d:DesignHeight="152.438" d:DesignWidth="132.531">
I know it's simple but I spent a lot of time to display my the list horizontally. I even put the make StackPanel orientation "Horizontal" but all in vain. Can anyone help with this? I would really appreciate that.
<Window x:Class="RssFeed_Wpf.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:RssFeed_Wpf"
mc:Ignorable="d"
Title="MainWindow" Height="350" Width="525">
<Window.Resources>
<XmlDataProvider x:Key="DataRss" XPath="//item" Source="http://www.abc.net.au/news/feed/52278/rss.xmlhttp://www.abc.net.au/news/feed/45910/rss.xml">
</XmlDataProvider>
</Window.Resources>
<ListBox ItemsSource="{Binding Source = {StaticResource DataRss}}" Background="Black" HorizontalContentAlignment="Left" BorderBrush="Transparent">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<TextBlock Text="{Binding XPath=title}" FontWeight="Bold" Name="txtScrolling" FontFamily="calibri" Foreground="#f4b042" Height="20pt">
</TextBlock>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</Window>
You can see here, The list is shown vertically but I want this horizontally:
Because your StackPanel is in the DataTemplate there is a StackPanel created for every item in the ListBox. To change the container for the ListBox you need to sets it ItemsPanel
<ListBox >
<ListBox.ItemsPanel>
<ItemsPanelTemplate>
<StackPanel Orientation="Horizontal"/>
</ItemsPanelTemplate>
</ListBox.ItemsPanel>
</ListBox>
I have a MasterView that have a TabControl binding with a ListView. I split the List into a secondary View becouse i want to separare the two views. The ListView have to do some operation that have nothing in common with the MasterView.
Here the code of the MasterView.xaml
<Window
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:cal="http://www.caliburnproject.org"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:view="clr-namespace:App"
mc:Ignorable="d" x:Class="App.MasterView"
Title="Setup Cylinder"
WindowStartupLocation="CenterScreen"
Height="732" Width="986" >
<Grid Margin="0,0,0,0" Background="#FF837F80" >
<TabControl SelectedIndex="{Binding CycleIndex}" Grid.Column="0" ItemsSource="{Binding Items}" Margin="0,5,0,10">
<TabControl.ItemTemplate>
<DataTemplate>
<TextBlock Text="{Binding Name}"/>
</DataTemplate>
</TabControl.ItemTemplate>
<TabControl.ContentTemplate>
<DataTemplate>
<ContentControl cal:View.Model="{Binding}" VerticalContentAlignment="Stretch" HorizontalContentAlignment="Stretch" IsTabStop="False" />
</DataTemplate>
</TabControl.ContentTemplate>
</TabControl>
</Grid>
Inside a MasterViewModel.cs there's a function called void public MenuItem_Open(). I want add a menu inside the ListView, that call the MenuItem_Open() of the MasterViewModel.cs.
Here is the code of the ListView.xaml
<UserControl x:Class="App.ListView"
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:cal="http://www.caliburnproject.org"
xmlns:sys="clr-namespace:System;assembly=mscorlib"
xmlns:local="clr-namespace:App"
mc:Ignorable="d" d:DesignHeight="300" d:DesignWidth="517.5">
<Grid Margin="0,0,0,0" x:Name="LayoutRoot">
<ScrollViewer Margin="0,0,0,10" VerticalScrollBarVisibility="Visible" HorizontalScrollBarVisibility="Visible">
<ListBox SelectedIndex="{Binding SelectedStepIndex}" x:Name="Steps" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" HorizontalContentAlignment="Left" VerticalContentAlignment="Center" AlternationCount="2">
<ListBox.ContextMenu>
<ContextMenu >
<MenuItem Header="New" cal:Message.Attach="[Event Click] = [Action MenuItem_New()]"/>
<MenuItem Header="Copy" />
<MenuItem Header="Paste" />
</ContextMenu>
</ListBox.ContextMenu>
</ListBox>
</ScrollViewer>
</Grid>
The problem is always get the error "No Target found for MenuItem_New()".
I think the problem is related to the Visual Tree Broken, and i try more solution, but everytime i failed and i get the same error.
Any hint to solve this problem?
EDIT 1: Binding Error
<UserControl x:Class="App.ListView"
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:cal="http://www.caliburnproject.org"
xmlns:sys="clr-namespace:System;assembly=mscorlib"
xmlns:local="clr-namespace:App"
mc:Ignorable="d" d:DesignHeight="300" d:DesignWidth="517.5">
<Grid Margin="0,0,0,0" x:Name="LayoutRoot">
<ScrollViewer Margin="0,0,0,10" VerticalScrollBarVisibility="Visible" HorizontalScrollBarVisibility="Visible">
<ListBox SelectedIndex="{Binding SelectedStepIndex}" x:Name="Steps" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" HorizontalContentAlignment="Left" VerticalContentAlignment="Center" AlternationCount="2">
<ListBox.ContextMenu>
<ContextMenu >
<MenuItem Header="New" cal:Message.Attach="[Event Click] = [Action MenuItem_New()]"/>
<MenuItem Header="Copy" />
<MenuItem Header="Paste" />
<Button Command="{Binding ElementName=LayoutRoot, Path=DataContext.MenuItem_New}"/>
</ContextMenu>
</ListBox.ContextMenu>
</ListBox>
</ScrollViewer>
</Grid>
The problem is (probably), that the Data Context of MenuItems is not the MasterViewModel, but it is DataContext of ListBox.
If I am accessing properties/methods of viewModel from nested items, I just use this : <Button Command="{Binding ElementName=LayoutRoot, Path=DataContext.ShowSessionDetail}" CommandParameter="{Binding SessionId}">
The LayoutRoot is name of element, which is located in root, hence its Data Context is the Data Context of ViewModel (you have also Grid with same name). Then in Path you say, you want to access Data Context of that element and then you can access methods/properties of it. This should work for you too.
Just doing a little test here. Only the first of these two text boxes displays the value "123". Why doesn't the second?
<Window x:Class="Test.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:diag="clr-namespace:System.Diagnostics;assembly=WindowsBase"
Title="MainWindow" Height="350" Width="525">
<StackPanel Width="123" x:Name="Panel1">
<TextBox Text="{Binding ElementName=Panel1, Path=Width, diag:PresentationTraceSources.TraceLevel=High}"></TextBox>
<TextBox Text="{Binding Source={RelativeSource AncestorType={x:Type StackPanel}}, Path=Width, diag:PresentationTraceSources.TraceLevel=High}"></TextBox>
</StackPanel>
Instead of Source take RelativeSource, like so:
<TextBox Text="{Binding RelativeSource={RelativeSource AncestorType={x:Type StackPanel}}, Path=Width, diag:PresentationTraceSources.TraceLevel=High}"></TextBox>
I've created following DataGrid design:
<Window
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:leartWPF" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:Ignorable="d"
x:Class="leartWPF.Window1"
x:Name="Window"
Title="Window1"
Width="640" Height="480">
<Window.Resources>
<local:GroupDataSource x:Key="GroupDataSourceDataSource" d:IsDataSource="True"/>
<DataTemplate x:Key="GroupCellTemplete" >
<Grid>
<TextBlock HorizontalAlignment="Center" VerticalAlignment="Center" Text="{Binding }" />
</Grid>
</DataTemplate>
</Window.Resources>
<Grid x:Name="LayoutRoot" Margin="0" DataContext="{Binding Source={StaticResource GroupDataSourceDataSource}}">
<DataGrid Margin="0" HeadersVisibility="None" ItemsSource="{Binding Groups, Mode=OneWay}" AutoGenerateColumns="False">
<DataGrid.Columns>
<DataGridTemplateColumn Header="Groups" IsReadOnly="True" CellTemplate="{DynamicResource GroupCellTemplete}"/>
</DataGrid.Columns>
</DataGrid>
</Grid>
</Window>
which in ExpressionBlend looks like this:
however, when I run the application, It looks like this:
What did I do wrong?
Try this:
dataGrid.RowHeight = double.NaN;