UWP GridView equivalent of WPF DataGrid - xaml

How can we use the UWP's GridView to look like the following WPF DataGrid?
Remark: The data binding is not important. You can just assume a Pseudo-code (psedo class with attributes MyTableId, DateModified, Author).
WPF DataGrid XAML:
<Window x:Class="MyWPFProj.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
...........
Title="MainWindow" Height="450" Width="800">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="103*"/>
<ColumnDefinition Width="697*"/>
</Grid.ColumnDefinitions>
<DataGrid x:Name="dgMathDocs" IsReadOnly="True" AutoGenerateColumns="False" SelectionMode="Single" Margin="0,43,0,0" Grid.ColumnSpan="2">
<DataGrid.Columns>
<DataGridTemplateColumn Header="Edit">
<DataGridTemplateColumn.CellTemplate>
<DataTemplate>
<Button x:Name="btnEdit" Content="Edit" Click="btnEdit_Click"></Button>
</DataTemplate>
</DataGridTemplateColumn.CellTemplate>
</DataGridTemplateColumn>
<DataGridTemplateColumn Header="Delete">
<DataGridTemplateColumn.CellTemplate>
<DataTemplate>
<Button x:Name="btnDelete" Content="Delete" Click="btnDelete_Click"></Button>
</DataTemplate>
</DataGridTemplateColumn.CellTemplate>
</DataGridTemplateColumn>
<DataGridTextColumn Header="ID" Visibility="Collapsed" Binding="{Binding MyTableId}" />
<DataGridTemplateColumn Header="Date Modified">
<DataGridTemplateColumn.CellEditingTemplate>
<DataTemplate>
<DatePicker SelectedDate="{Binding DateModified}" BorderThickness="0" />
</DataTemplate>
</DataGridTemplateColumn.CellEditingTemplate>
</DataGridTemplateColumn>
<DataGridTextColumn Header="Author" Binding="{Binding Author}"/>
</DataGridHyperlinkColumn>
</DataGrid.Columns>
</DataGrid>
</Grid>
</Window>
WPF DataGrid Display of the above XAML:

You could try to use DataGrid from Windows Community Toolkit.
More information you can find from Sample App on GitHub

Related

MahApps Metro NumericUpDown problems

After using MahApp Metro formy project in WPF I encountered a problem I can't solve. the framework works fine except when I am using the NumericUpDown control.
I can see this control onto my UserControl while I'am working on it. But at the compilation the code then becomes :
The tag 'NumericUpDown' does not exist in XML namespace "http://metro.mahapps.com/winfx/xaml/controls". Line 75 Position 26.
With my XAML code it could perhaps help :
<UserControl x:Class="FullTest.Tabs.DataGridStrategie" 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:xctk="http://schemas.xceed.com/wpf/xaml/toolkit"
xmlns:convertors="clr-namespace:FullTest.ModelView.Convertors"
xmlns:controls="http://metro.mahapps.com/winfx/xaml/controls"
xmlns:sys="clr-namespace:System;assembly=mscorlib"
xmlns:utils="clr-namespace:FullTest.UtilityClasses"
mc:Ignorable="d"
d:DesignHeight="300" d:DesignWidth="300">
<UserControl.Resources>
<ResourceDictionary>
<BooleanToVisibilityConverter x:Key="BoolToVis"/>
<ObjectDataProvider MethodName="GetType"
ObjectType="{x:Type sys:Type}" x:Key="colorsTypeOdp">
<ObjectDataProvider.MethodParameters>
<sys:String>System.Windows.Media.Colors, PresentationCore, Version=3.0.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35</sys:String>
</ObjectDataProvider.MethodParameters>
</ObjectDataProvider>
<ObjectDataProvider ObjectInstance="{StaticResource colorsTypeOdp}" MethodName="GetProperties" x:Key="colorPropertiesOdp">
</ObjectDataProvider>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Controls.xaml" />
<ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Fonts.xaml" />
<ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Colors.xaml" />
<ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Accents/emerald.xaml" />
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</UserControl.Resources>
<DataGrid ItemsSource="{Binding Path=Str...}"
Grid.Row="0"
AutoGenerateColumns="False" Margin="0,0,-172,0" x:Name="MainGrid">
<DataGrid.Columns>
<DataGridTemplateColumn Header="Colors ..." Width="Auto">
<DataGridTemplateColumn.CellTemplate>
<DataTemplate>
<ComboBox Name="superCombo" ItemsSource="{Binding Source={StaticResource colorPropertiesOdp}}" SelectedItem="{Binding BrushColor, UpdateSourceTrigger=PropertyChanged, Mode=TwoWay}">
<ComboBox.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<TextBlock Width="20" Height="20" Margin="5" Background="{Binding Name}"/>
<TextBlock Text="{Binding Name}"/>
</StackPanel>
</DataTemplate>
</ComboBox.ItemTemplate>
</ComboBox>
</DataTemplate>
</DataGridTemplateColumn.CellTemplate>
</DataGridTemplateColumn>
<DataGridTemplateColumn Header="Name of ..." x:Name="Str.." Width="150">
<DataGridTemplateColumn.CellTemplate>
<DataTemplate>
<TextBox Name="itemNameTextBox" Text="{Binding Name, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"/>
</DataTemplate>
</DataGridTemplateColumn.CellTemplate>
</DataGridTemplateColumn>
<DataGridTemplateColumn Header="Typ o....">
<DataGridTemplateColumn.CellTemplate>
<DataTemplate>
<ComboBox Name="TypeStrat" ItemsSource="{Binding Path=Typ....}" SelectedIndex="{Binding Index, UpdateSourceTrigger=PropertyChanged, Mode= TwoWay}"/>
</DataTemplate>
</DataGridTemplateColumn.CellTemplate>
</DataGridTemplateColumn>
<!--Here Appears the problem due to the controller-->
<DataGridTemplateColumn Header="">
<DataGridTemplateColumn.CellTemplate>
<DataTemplate>
<controls:NumericUpDown Grid.Row="0"
Grid.Column="1"
Height="23"
Margin="5,5,5,5"
Interval="1"
StringFormat="{}{0:###0}"/>
</DataTemplate>
</DataGridTemplateColumn.CellTemplate>
</DataGridTemplateColumn>
</DataGrid.Columns>
</DataGrid>
I could provide more information if it can be useful.

Listiview Item not highlighting when hovering over - UWP (Windows 10)

I have a UserControl used as an item template in a ListView and when I hover a specific item it doesn't highlight it yet I have other ListViews in my project where the specific item is highlighted over.
I've removed the code from my UserControl and copy/pasted it directly in my DataTemplate to check if it was related to the fact that I was using a UserControl but no difference.
This ListView is contained in a SemanticZoom, so again I removed the SemanticZoom to check if the behaviour would change, but to no avail! Still doesn't get highlighted.
All my ListViews have their SelectionMode set to Single and I've got a style defined at the app level which is applied to all my ListViews
This is the code in my UserControl:
<UserControl
x:Class="MyApp.UserControls.ZoomedIn"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:MyApp.UserControls"
xmlns:converters="using:MyApp.Converters"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
d:DesignHeight="300"
d:DesignWidth="470">
<UserControl.Resources>
<converters:WrapOnConverter x:Key="WrapOnConverter"/>
</UserControl.Resources>
<Grid x:Name="Details"
Background="White"
Grid.Column="0"
Grid.Row="0"
Margin="12,5,12,5">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<Image x:Name="Image"
Source="{Binding Image}"
Width="100"
Height="100"
Stretch="UniformToFill"
Grid.Row="0"
Grid.Column="0"
Grid.RowSpan="2"
HorizontalAlignment="Left"
VerticalAlignment="Top" />
<Image x:Name="Image2"
Source="{Binding Image2}"
Width="30"
Height="30"
Margin="67,67,0,0"
Stretch="UniformToFill"
Grid.Row="0"
Grid.Column="0"
Grid.RowSpan="2"
HorizontalAlignment="Left"
VerticalAlignment="Top" />
<Image x:Name="Image3"
Source="{Binding Image3}"
Width="30"
Height="30"
Margin="32,67,0,0"
Stretch="UniformToFill"
Grid.Row="0"
Grid.Column="0"
Grid.RowSpan="2"
HorizontalAlignment="Left"
VerticalAlignment="Top" />
<StackPanel Margin="5,0,5,0"
Grid.Row="0"
Grid.Column="1"
VerticalAlignment="Top">
<TextBlock x:Name="Title"
Text="{Binding Title}"
Foreground="{ThemeResource
SystemControlForegroundAccentBrush}"
FontWeight="SemiBold"
VerticalAlignment="Top"
TextWrapping="{Binding
Converter={StaticResource WrapOnConverter}}" />
<TextBlock x:Name="Time"
Text="{Binding Time}"
Foreground="DarkCyan"
VerticalAlignment="Top"
HorizontalAlignment="Left"
Margin="0,5,0,5" />
<TextBlock x:Name="Description"
Text="{Binding Description}"
Foreground="Black"
TextWrapping="Wrap"
VerticalAlignment="Top"
HorizontalAlignment="Left"
MaxLines="2"/>
</StackPanel>
</Grid>
</UserControl>
And my ListView is defined as follows:
<ListView ItemsSource="{Binding Source={StaticResource cvsDetails}}"
SelectionMode="Single"
SelectedIndex="{Binding SelectedDetailIndex}"
SelectedItem="{Binding SelectedDetail, Mode=TwoWay}"
ItemContainerStyle="{StaticResource ListViewItemStyle}">
<ListView.ItemTemplate>
<DataTemplate>
<usercontrols:ZoomedIn DataContext="{Binding}" />
</DataTemplate>
</ListView.ItemTemplate>
<ListView.GroupStyle>
<GroupStyle>
<GroupStyle.HeaderTemplate>
<DataTemplate>
<TextBlock FontSize="20"
Text="{Binding CategoryName}"
Foreground="{ThemeResource
SystemControlForegroundAccentBrush}"
FontWeight="SemiBold" />
</DataTemplate>
</GroupStyle.HeaderTemplate>
</GroupStyle>
</ListView.GroupStyle>
<Interactivity:Interaction.Behaviors>
<Core:EventTriggerBehavior EventName="Tapped">
<Core:InvokeCommandAction
Command="{Binding ItemClickCommand}"
CommandParameter="{Binding SelectedDetail}" />
</Core:EventTriggerBehavior>
</Interactivity:Interaction.Behaviors>
</ListView>
Does anyone have any ideas why one ListView would be behaving differently to the others?
Thanks.
The item is not highlighted because you have the Background="White" set, and this color will always be above the highlight color. The UserControl background needs to be set to Transparent.
To make it work the way you want, you need to change the ItemContainerStyle of your ListView. If you have different elements in your ListView you can use ItemContainerStyleSelector.
You can read more about ListViewItem here.
You need the change the Background property of list view items, for example:
<ListView>
<ListView.ItemContainerStyle>
<Style TargetType="ListViewItem">
<Setter Property="Background" Value="White"/>
</Style>
</ListView.ItemContainerStyle>
</ListView>

Two XAML GridViews in a StackPanel

For my Windows 8.1 XAML app, I am trying to create a XAML layout that resembles the following description:
One StackPanel that contains two GridViews (let's say GV1, GV2)
Each GridView contains images that are displayed through data binding
GV1 and GV2 should be horizontally stacked when screen is in landscape mode. Their width should be equal. The scrolling of images should be vertical.
GV1 and GV2 should be vertically stacked when screen is in portrait mode. There height should be equal. The scrolling of images should be horizontal.
I have tried several approaches using various combinations of GridViews, StackPanels, ScrollViewer etc. but nothing seems to work.
My latest attempt at creating a basic horizontal layout is here:
<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<StackPanel x:Name="theStackPanel" Orientation="Horizontal">
<GridView x:Name="firstGridView"
ItemsSource="{Binding Path=FirstInputFileList}"
Margin="10,10,10,10"
SelectionMode="None">
<GridView.ItemTemplate>
<DataTemplate>
<StackPanel HorizontalAlignment="Center">
<Image Source="{Binding Path=SrcImage}" HorizontalAlignment="Center" Width="300" Height="225"/>
</StackPanel>
</DataTemplate>
</GridView.ItemTemplate>
</GridView>
<GridView x:Name="secondGridView"
ItemsSource="{Binding Path=SecondInputFileList}"
Margin="10,10,10,10"
SelectionMode="None">
<GridView.ItemTemplate>
<DataTemplate>
<StackPanel HorizontalAlignment="Center">
<Image Source="{Binding Path=SrcImage}" HorizontalAlignment="Center" Width="120" Height="90"/>
</StackPanel>
</DataTemplate>
</GridView.ItemTemplate>
</GridView>
</StackPanel>
</Grid>
Any pointers or some kind of pseudo XAML code would be really helpful.
I'd try this:
<Page
x:Class="App79.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:App79"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d">
<Grid
Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<!-- Two layouts to put in the page. Handle SizeChanged events to show the one that should be visible.
You could use VisualStateManager to switch between these if you want to keep designer support. -->
<ContentPresenter
x:Name="PortraitLayout"
Visibility="Collapsed">
<ContentPresenter.ContentTemplate>
<!-- Collapsed ContentPresenter in Windows 8.1 is roughly equivalent to x:Defer in Windows 10 -->
<DataTemplate>
<Grid>
<!-- Note that using a Grid here works better than a StackPanel since it will let you split the space into two rows/columns of same size -->
<Grid.RowDefinitions>
<RowDefinition />
<RowDefinition />
</Grid.RowDefinitions>
<GridView
x:Name="firstGridView"
ItemsSource="{Binding Path=FirstInputFileList}"
Margin="10,10,10,10"
SelectionMode="None">
<GridView.ItemTemplate>
<DataTemplate>
<Image
Source="{Binding Path=SrcImage}"
HorizontalAlignment="Center"
Width="300"
Height="225" />
</DataTemplate>
</GridView.ItemTemplate>
</GridView>
<GridView
Grid.Row="1"
x:Name="secondGridView"
ItemsSource="{Binding Path=SecondInputFileList}"
Margin="10,10,10,10"
SelectionMode="None">
<GridView.ItemTemplate>
<DataTemplate>
<Image
Source="{Binding Path=SrcImage}"
HorizontalAlignment="Center"
Width="120"
Height="90" />
</DataTemplate>
</GridView.ItemTemplate>
</GridView>
</Grid>
</DataTemplate>
</ContentPresenter.ContentTemplate>
</ContentPresenter>
<ContentPresenter
x:Name="LandscapeLayout"
Visibility="Collapsed">
<ContentPresenter.ContentTemplate>
<!-- Collapsed ContentPresenter in Windows 8.1 is roughly equivalent to x:Defer in Windows 10 -->
<DataTemplate>
<Grid>
<!-- For landscape we-re using columns -->
<Grid.ColumnDefinitions>
<ColumnDefinition />
<ColumnDefinition />
</Grid.ColumnDefinitions>
<!-- Note that for vertical scrolling we're using ListViews with custom ItemsPanels.
In Windows 10 this might be simpler with just reconfigured GridViews. -->
<ListView
x:Name="firstGridView"
ItemsSource="{Binding Path=FirstInputFileList}"
Margin="10,10,10,10"
SelectionMode="None">
<ListView.ItemsPanel>
<ItemsPanelTemplate>
<ItemsWrapGrid
Orientation="Horizontal" />
</ItemsPanelTemplate>
</ListView.ItemsPanel>
<ListView.ItemTemplate>
<DataTemplate>
<Image
Source="{Binding Path=SrcImage}"
HorizontalAlignment="Center"
Width="300"
Height="225" />
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
<ListView
Grid.Column="1"
x:Name="secondGridView"
ItemsSource="{Binding Path=SecondInputFileList}"
Margin="10,10,10,10"
SelectionMode="None">
<ListView.ItemsPanel>
<ItemsPanelTemplate>
<ItemsWrapGrid
Orientation="Horizontal" />
</ItemsPanelTemplate>
</ListView.ItemsPanel>
<ListView.ItemTemplate>
<DataTemplate>
<Image
Source="{Binding Path=SrcImage}"
HorizontalAlignment="Center"
Width="120"
Height="90" />
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
</Grid>
</DataTemplate>
</ContentPresenter.ContentTemplate>
</ContentPresenter>
</Grid>
</Page>

QT spacer equivalent in WPF

I have a StackPanel with some vertically alligned controls (stackpanel on the right in this picture:
The last control should always be placed at the bottom of the window inside of the border control (The OK button on the picture). In QT I'd insert a spacer control to push the button down. How do I do that in WPF? Thank you. Here is the xaml:
<Window x:Class="Test.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Height="350" Width="525">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="354*" />
<ColumnDefinition Width="Auto" />
</Grid.ColumnDefinitions>
<Border Margin="5" Background="Gray" CornerRadius="6" BorderBrush="Gray">
<Viewport3D Grid.Column="0" Name="viewport" ClipToBounds="True">
</Viewport3D>
</Border>
<Border Grid.Column="1" CornerRadius="6" BorderBrush="Gray" Background="LightGray" BorderThickness="1" Margin="5" HorizontalAlignment="Left" Name="border1" VerticalAlignment="Stretch" >
<StackPanel>
<StackPanel Orientation="Horizontal">
<Label Content="Dimension" Name="label1" VerticalAlignment="Center" />
<ComboBox Text="3D" HorizontalAlignment="Right" Name="dimensioncb" VerticalAlignment="Center" IsReadOnly="True" IsEditable="True">
<ComboBoxItem>2D</ComboBoxItem>
<ComboBoxItem>3D</ComboBoxItem>
</ComboBox>
</StackPanel>
<Separator/>
<DockPanel>
<Label Content="Iteration" Name="label2" VerticalAlignment="Center" />
<ComboBox Text="3" HorizontalAlignment="Right" Name="iterationcb" VerticalAlignment="Center" IsReadOnly="True" IsEditable="True">
<ComboBoxItem>1</ComboBoxItem>
<ComboBoxItem>2</ComboBoxItem>
<ComboBoxItem>3</ComboBoxItem>
<ComboBoxItem>4</ComboBoxItem>
<ComboBoxItem>5</ComboBoxItem>
<ComboBoxItem>6</ComboBoxItem>
<ComboBoxItem>7</ComboBoxItem>
<ComboBoxItem>8</ComboBoxItem>
</ComboBox>
</DockPanel>
<Button Content="OK" VerticalAlignment="Bottom"/>
</StackPanel>
</Border>
</Grid>
</Window>
There are a bunch of ways that you can accomplish this in WPF. Shown below is one:
<Border Grid.Column="1" CornerRadius="6" BorderBrush="Gray" Background="LightGray" BorderThickness="1" Margin="5" HorizontalAlignment="Left" Name="border1" VerticalAlignment="Stretch" >
<!--Add a grid control to separate your stackpanel and button-->
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="*"/>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>
<StackPanel Grid.Row="0">
<StackPanel Orientation="Horizontal">
<Label Content="Dimension" Name="label1" VerticalAlignment="Center" />
<ComboBox Text="3D" HorizontalAlignment="Right" Name="dimensioncb" VerticalAlignment="Center" IsReadOnly="True" IsEditable="True">
<ComboBoxItem>2D</ComboBoxItem>
<ComboBoxItem>3D</ComboBoxItem>
</ComboBox>
</StackPanel>
<Separator/>
<DockPanel>
<Label Content="Iteration" Name="label2" VerticalAlignment="Center" />
<ComboBox Text="3" HorizontalAlignment="Right" Name="iterationcb" VerticalAlignment="Center" IsReadOnly="True" IsEditable="True">
<ComboBoxItem>1</ComboBoxItem>
<ComboBoxItem>2</ComboBoxItem>
<ComboBoxItem>3</ComboBoxItem>
<ComboBoxItem>4</ComboBoxItem>
<ComboBoxItem>5</ComboBoxItem>
<ComboBoxItem>6</ComboBoxItem>
<ComboBoxItem>7</ComboBoxItem>
<ComboBoxItem>8</ComboBoxItem>
</ComboBox>
</DockPanel>
</StackPanel>
<Button Grid.Row="1" Content="OK" VerticalAlignment="Bottom"/>
</Grid>
</Border>
The above XAML, used to replace the right-hand Border in your XAML will produce the following result, and will keep the button on the bottom when re-sizing the window.

how to (define and call events for a child datagrid) within the data grid

i need to define events for the datagrid with in another datagrid(master child grid)
now i need to define events for child grid and call those events when i click the child data grid
i have define events for child data grid in xaml page. but these events or not getting fired. how should i go ahead ?
RowDetailsVisibilityChanged="dgrdRowDetail_RowDetailsVisibilityChanged"
is my Xaml code
<sdk:DataGrid MinHeight="100" x:Name="dgCounty" AutoGenerateColumns="False" VerticalAlignment="Top" Grid.Row="1" IsReadOnly="True" Margin="5,5,5,0" RowDetailsVisibilityChanged="dgCounty_RowDetailsVisibilityChanged" SelectionMode="Extended" RowDetailsVisibilityMode="VisibleWhenSelected">
<sdk:DataGrid.Columns>
<sdk:DataGridTemplateColumn>
<sdk:DataGridTemplateColumn.CellTemplate>
<DataTemplate>
<Button x:Name="myButton" Width="24" Height="24" Click="Details_Click">
<Image x:Name="img" Source="Images/detail.JPG" Stretch="None"/>
</Button>
</DataTemplate>
</sdk:DataGridTemplateColumn.CellTemplate>
</sdk:DataGridTemplateColumn>
<sdk:DataGridTemplateColumn Header="ID">
<sdk:DataGridTemplateColumn.CellTemplate>
<DataTemplate >
<sdk:Label Content="{Binding EmployeeID}" />
</DataTemplate>
</sdk:DataGridTemplateColumn.CellTemplate>
</sdk:DataGridTemplateColumn>
<sdk:DataGridTemplateColumn Header="Name">
<sdk:DataGridTemplateColumn.CellTemplate>
<DataTemplate >
<sdk:Label Content="{Binding EmployeeFName}" />
</DataTemplate>
</sdk:DataGridTemplateColumn.CellTemplate>
</sdk:DataGridTemplateColumn>
<sdk:DataGridTemplateColumn Header="MailID">
<sdk:DataGridTemplateColumn.CellTemplate>
<DataTemplate >
<sdk:Label Content="{Binding EmployeeMailID}" />
</DataTemplate>
</sdk:DataGridTemplateColumn.CellTemplate>
</sdk:DataGridTemplateColumn>
</sdk:DataGrid.Columns>
<sdk:DataGrid.RowDetailsTemplate>
<DataTemplate>
<sdk:DataGrid x:Name="dgrdRowDetail" Width="400" HeadersVisibility ="None" AutoGenerateColumns="False" HorizontalAlignment="Center" IsReadOnly="True" RowDetailsVisibilityChanged="dgrdRowDetail_RowDetailsVisibilityChanged" SelectionMode="Extended" RowDetailsVisibilityMode="VisibleWhenSelected">
<sdk:DataGrid.Columns>
<sdk:DataGridTextColumn Binding="{Binding CompanyName}"/>
<sdk:DataGridTextColumn Binding="{Binding CompanyID}"/>
<sdk:DataGridTemplateColumn Header="Score">
<sdk:DataGridTemplateColumn.CellTemplate>
<DataTemplate >
<StackPanel Loaded ="StackPanel_Loaded" Orientation="Horizontal" Background="Transparent">
<TextBlock Text="{Binding Score}" TextWrapping="NoWrap" HorizontalAlignment="Center" Foreground="Blue"></TextBlock>
<Image x:Name="imgScore" Source ="{Binding Score}" Width="20" Height="20" Stretch ="Fill"/>
</StackPanel>
</DataTemplate>
</sdk:DataGridTemplateColumn.CellTemplate>
</sdk:DataGridTemplateColumn>
</sdk:DataGrid.Columns>
</sdk:DataGrid>
</DataTemplate>
</sdk:DataGrid.RowDetailsTemplate>
</sdk:DataGrid>
private void dgrdRowDetail_RowDetailsVisibilityChanged(object sender, DataGridRowDetailsEventArgs e)
{
}
does any one knows how to define and call the events of child datagrid. any help would be great looking frwd for an solution.
thanks in advance
prince
Soution:
define globally
DataGrid dgrdRowDetail;
in event parent event we can fine the child data grid and then define the event for the child data grid to.
private void dgCounty_RowDetailsVisibilityChanged(object sender, DataGridRowDetailsEventArgs e)
{
dgrdRowDetail = (DataGrid)e.DetailsElement.FindName("dgrdRowDetail");
dgrdRowDetail.RowDetailsVisibilityChanged+=new EventHandler<DataGridRowDetailsEventArgs>(dgrdRowDetail_RowDetailsVisibilityChanged);
}
once you get your dgrdRowDetail which is the child control then yoy can perform all the actions against it like binding,events all those stuff.