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.
Related
I create my ui dynamically by using TemplateSelector with prism.
my problem is that i want all the element to be like this:
element 1 element 2 element 3 ......
element 10 element 11 element 12 .....
but i get this result:
element 1
element 2
element 3
.
.
.
I am using WrapPanel, this is my code:
<WrapPanel>
<ItemsControl ItemsSource="{Binding Controls}"
ItemTemplateSelector="{StaticResource IbuttonTemplateSelector}">
</ItemsControl>
</WrapPanel>
This is the full xaml code
<Window x:Class="WpfApp2.Views.MainView"
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:prism="http://prismlibrary.com/"
prism:ViewModelLocator.AutoWireViewModel="True"
xmlns:helpers="clr-namespace:WpfApp2.Helpers"
xmlns:local="clr-namespace:WpfApp2.Views"
mc:Ignorable="d"
Title="MainView" Height="450" Width="800">
<Window.Resources>
<!--Button tamplate-->
<DataTemplate x:Key="ButtonTemplate">
<Button x:Name="OrderButton"
FontSize="10"
Height="20" Width="80"
Content="{Binding Value}"
Margin="0">
</Button>
</DataTemplate>
<!--RadioButton tamplate-->
<DataTemplate x:Key="RadioTemplate">
<RadioButton GroupName="gal" Foreground="Black" Content="{Binding Value}" Margin="0">
</RadioButton>
</DataTemplate>
<helpers:IbuttonTemplateSelector x:Key="IbuttonTemplateSelector"
ButtonTemplate="{StaticResource ButtonTemplate}"
RadioTemplate="{StaticResource RadioTemplate}"/>
</Window.Resources>
<!--OUR LIST OF SETTINGS TO DISPLAY-->
<WrapPanel>
<ItemsControl ItemsSource="{Binding Controls}"
ItemTemplateSelector="{StaticResource IbuttonTemplateSelector}">
</ItemsControl>
</WrapPanel>
</Window>
You have to override the panel of the ItemsControl, which hosts the items. It is a StackPanel by default:
<ItemsControl>
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<WrapPanel />
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
</ItemsControl>
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.
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'm new with WPF and want to set the listview's height to the bottom of my frame. The listview's width ist already set with a fix value. The following code represents my DockPanel:
<DockPanel
Name="dp"
Width="200"
HorizontalAlignment="Left">
<TextBox DockPanel.Dock="Top" Margin="0,5,0,5"/>
<ListView Width="{Binding Path=ActualWidth, ElementName=dp}" Background="Yellow" DockPanel.Dock="Left">
<ListViewItem Content="foobar"/>
<ListViewItem Content="foobar2"/>
</ListView>
</DockPanel>
The first screenshot will show the current szenario:
http://i.imgur.com/XMbMh4t.png
and the heigth shell strech to the height as it is shown in the next picture:
http://i.imgur.com/Tf7O4pK.png
Thanks a lot!
Best regards
Instead of this:
<Window>
<DockPanel>
<Menu DockPanel.Dock="Top">
</Menu>
<DatePicker DockPanel.Dock="Top" />
<TabControl>
<TabItem>
<StackPanel>
</StackPanel>
</TabItem>
<TabItem>
<StackPanel>
<Grid>
</Grid>
<DockPanel>
<TextBox DockPanel.Dock="Top" />
<ListView>
</ListView>
</DockPanel>
</StackPanel>
</TabItem>
<TabItem>
</TabItem>
</TabControl>
</DockPanel>
</Window>
Try this:
<Window>
<DockPanel>
<Menu DockPanel.Dock="Top">
</Menu>
<DatePicker DockPanel.Dock="Top" />
<TabControl>
<TabItem>
<StackPanel>
</StackPanel>
</TabItem>
<TabItem>
<DockPanel> <!-- instead of StackPanel -->
<Grid DockPanel.Dock="Top">
</Grid>
<!-- can now get rid of this <DockPanel> -->
<TextBox DockPanel.Dock="Top" />
<ListView>
</ListView>
</DockPanel>
</TabItem>
<TabItem>
</TabItem>
</TabControl>
</DockPanel>
</Window>
You need to use VerticalAlignment="Stretch" on the ListView element. The same is true for HorizontalAlignment if you need to do the same horizontally.
<DockPanel
Name="dp"
Width="200"
HorizontalAlignment="Left">
<TextBox DockPanel.Dock="Top" Margin="0,5,0,5"/>
<ListView Width="{Binding Path=ActualWidth, ElementName=dp}" VerticalAlignment="Stretch" Background="Yellow" DockPanel.Dock="Left">
<ListViewItem Content="foobar"/>
<ListViewItem Content="foobar2"/>
</ListView>
</DockPanel>
See http://msdn.microsoft.com/en-us/library/ms751709(v=vs.110).aspx for more information.
I have tested your code using VerticalAlignment="Stretch", and I am getting your desired result:
<Window x:Class="WpfApplication1.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:WpfApplication1"
mc:Ignorable="d"
Title="MainWindow" Height="350" Width="525">
<Grid>
<DockPanel
Name="dp"
Width="200"
HorizontalAlignment="Left">
<TextBox DockPanel.Dock="Top" Margin="0,5,0,5"/>
<ListView Width="{Binding Path=ActualWidth, ElementName=dp}" VerticalAlignment="Stretch" Background="Yellow" DockPanel.Dock="Left">
<ListViewItem Content="foobar"/>
<ListViewItem Content="foobar2"/>
</ListView>
</DockPanel>
</Grid>
</Window>
If you cannot get the VerticalAlignment to work properly, we can bind the ActualHeight of an element to its ancestor element. So, add this to your ListView:
Height="{ Binding Path=ActualHeight, RelativeSource={ RelativeSource Mode=FindAncestor, AncestorType={ x:Type Window } } }"
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;