I have created a gridview by using list view.
There is 2 level of nodes and I would like to indent the child node.
Therefore, I have set the margin in the <ItemPresenter>.
The result looks pretty good but the second and the third column also been indent and not align according to its header column.
Any idea to indent only the first column but not the rest column?
xaml
<ListView Name="listViewResult" Margin="10,231,0,-299" BorderBrush="#FF000000" BorderThickness="1" >
<ListView.View>
<GridView>
<GridViewColumn Header="Name" Width="280" DisplayMemberBinding="{Binding GrandChildNodeData}" />
<GridViewColumn Header="Date/ Time" Width="160" DisplayMemberBinding="{Binding Time}" />
<GridViewColumn Header="State" Width="160" DisplayMemberBinding="{Binding State}" />
</GridView>
</ListView.View>
<ListView.GroupStyle>
<GroupStyle>
<GroupStyle.ContainerStyle>
<Style TargetType="{x:Type GroupItem}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate>
<Expander IsExpanded="True">
<Expander.Header>
<StackPanel Orientation="Horizontal">
<TextBlock Text="{Binding Name}" FontWeight="Bold" VerticalAlignment="Bottom" />
<TextBlock Text="{Binding ItemCount}" Foreground="Silver" FontStyle="Italic" Margin="10,0,0,0" VerticalAlignment="Bottom" />
<TextBlock Text=" item(s)" Foreground="Silver" FontStyle="Italic" VerticalAlignment="Bottom" />
</StackPanel>
</Expander.Header>
<ItemsPresenter Margin="20,0,0,0" />
</Expander>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</GroupStyle.ContainerStyle>
</GroupStyle>
</ListView.GroupStyle>
</ListView>
result
This question has been answered by Magnus in this forum
"You are setting the Margin of the entire GroupItem. You should define a CellTemplate for the first column and set the Margins in there:"
<ListView.View>
<GridView>
<GridViewColumn Header="Name" Width="120">
<GridViewColumn.CellTemplate>
<DataTemplate>
<TextBlock Text="{Binding Name}" Margin="20 0 0 0"/>
</DataTemplate>
</GridViewColumn.CellTemplate>
</GridViewColumn>
<GridViewColumn Header="Date/ Time" Width="160" DisplayMemberBinding="{Binding Time}" />
<GridViewColumn Header="State" Width="160" DisplayMemberBinding="{Binding State}" />
</GridView>
</ListView.View>
<ListView.GroupStyle>
<GroupStyle>
<GroupStyle.ContainerStyle>
<Style TargetType="{x:Type GroupItem}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate>
<Expander IsExpanded="True">
<Expander.Header>
<StackPanel Orientation="Horizontal">
<TextBlock Text="{Binding Name}" FontWeight="Bold" VerticalAlignment="Bottom" />
<TextBlock Text="{Binding ItemCount}" Foreground="Silver" FontStyle="Italic" Margin="10,0,0,0" VerticalAlignment="Bottom" />
<TextBlock Text=" item(s)" Foreground="Silver" FontStyle="Italic" VerticalAlignment="Bottom" />
</StackPanel>
</Expander.Header>
<ItemsPresenter />
</Expander>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</GroupStyle.ContainerStyle>
</GroupStyle>
</ListView.GroupStyle>
Related
I have a ScrollViewer with an Expander in it with a ListView in the Expander, however I can only scroll while hovering over the Expander and not when hovering in the ListView.
My current code looks like the following:
<TabItem Header="Pins Info" Height="{Binding ElementName=r1, Path=ActualHeight}">
<Border Visibility="Visible" BorderThickness="1.5" BorderBrush="Gray" CornerRadius="8" Margin="-1.5,-1.5,5,-1.5">
<StackPanel Margin="3">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="*" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<Label Grid.Column="0" Height="35" Content="Pins Information" VerticalContentAlignment="Center" Margin="25,0,0,0" FontSize="16" Style="{DynamicResource MaterialDesignLabel}"/>
<Separator Grid.Column="0" Grid.Row="1" Height="1" Margin="10,0,5,0"/>
</Grid>
<ScrollViewer Height="502">
<StackPanel>
<Expander IsExpanded="True">
<ListView Grid.Column="0" ItemsSource="{Binding DetectedDevices[0].Board_DigitalOutputsHS13}">
<ListView.View>
<GridView ScrollViewer.CanContentScroll="True">
<GridView.ColumnHeaderContainerStyle>
<Style TargetType="{x:Type GridViewColumnHeader}">
<Setter Property="Visibility" Value="Collapsed" />
</Style>
</GridView.ColumnHeaderContainerStyle>
<GridViewColumn Width="400" Header="Name" DisplayMemberBinding="{Binding Name}"/>
<GridViewColumn Width="270" Header="OutputStatus" DisplayMemberBinding="{Binding OutputStatus}"/>
<GridViewColumn Width="270" Header="Current Feeback" DisplayMemberBinding="{Binding CurrentFB}"/>
<GridViewColumn Header="Open Load Status" DisplayMemberBinding="{Binding OLStatus}"/>
</GridView>
</ListView.View>
</ListView>
</Expander>
<Expander Header="High Side 2A" IsExpanded="True">
<ListView ItemsSource="{Binding DetectedDevices[0].Board_DigitalOutputsHS2}" Margin="10,0,5,0">
<ListView.View>
<GridView>
<GridView.ColumnHeaderContainerStyle>
<Style TargetType="{x:Type GridViewColumnHeader}">
<Setter Property="Visibility" Value="Collapsed" />
</Style>
</GridView.ColumnHeaderContainerStyle>
<GridViewColumn Width="400" Header="Name" DisplayMemberBinding="{Binding Name}"/>
<GridViewColumn Width="270" Header="OutputStatus" DisplayMemberBinding="{Binding OutputStatus}"/>
<GridViewColumn Width="270" Header="Current Feeback" DisplayMemberBinding="{Binding CurrentFB}"/>
<GridViewColumn Header="Open Load Status" DisplayMemberBinding="{Binding OLStatus}"/>
</GridView>
</ListView.View>
</ListView>
</Expander>
<Expander Header="Low Side 2A" IsExpanded="True">
<ListView Grid.Column="0" ItemsSource="{Binding DetectedDevices[0].Board_DigitalOutputsLS2}" Margin="10,0,5,0">
<ListView.View>
<GridView>
<GridView.ColumnHeaderContainerStyle>
<Style TargetType="{x:Type GridViewColumnHeader}">
<Setter Property="Visibility" Value="Collapsed" />
</Style>
</GridView.ColumnHeaderContainerStyle>
<GridViewColumn Width="400" Header="Name" DisplayMemberBinding="{Binding Name}"/>
<GridViewColumn Width="270" Header="OutputStatus" DisplayMemberBinding="{Binding OutputStatus}"/>
<GridViewColumn Width="270" Header="Current Feeback" DisplayMemberBinding="{Binding CurrentFB}"/>
<GridViewColumn Header="Open Load Status" DisplayMemberBinding="{Binding OLStatus}"/>
</GridView>
</ListView.View>
</ListView>
</Expander>
<Expander Header="Low Side 2A" IsExpanded="True">
<ListView Grid.Column="0" ItemsSource="{Binding DetectedDevices[0].Board_DigitalOutputsLS2}" Margin="10,0,5,0">
<ListView.View>
<GridView>
<GridView.ColumnHeaderContainerStyle>
<Style TargetType="{x:Type GridViewColumnHeader}">
<Setter Property="Visibility" Value="Collapsed" />
</Style>
</GridView.ColumnHeaderContainerStyle>
<GridViewColumn Width="400" Header="Name" DisplayMemberBinding="{Binding Name}"/>
<GridViewColumn Width="270" Header="OutputStatus" DisplayMemberBinding="{Binding OutputStatus}"/>
<GridViewColumn Width="270" Header="Current Feeback" DisplayMemberBinding="{Binding CurrentFB}"/>
<GridViewColumn Header="Open Load Status" DisplayMemberBinding="{Binding OLStatus}"/>
</GridView>
</ListView.View>
</ListView>
</Expander>
</StackPanel>
</ScrollViewer>
</StackPanel>
</Border>
</TabItem>
I have tried deleting almost every grid or stackpanel I seem to find "extra", but to no avail. I have tried setting multiple properties like "CanContentScroll" but also no use.
Screenshots included from left (where I hover I can scroll) and right (where I can't scroll)
Where I can scroll Where I can't scroll
I set the background of my TextBlocks to different colors over the alternating colors. As you can see there is some gaps that are not colored in red:
Is there a way for me to remove those margins/spacing or stretch my TextBlock to completely fill those areas so the entire column region is colored?
Or is there a way to set the entire ListViewItem BG color?
Here is my XAML code:
<Window x:Class="ProfitTracker.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:ProfitTracker"
mc:Ignorable="d"
DataContext="{Binding RelativeSource={RelativeSource Self}}"
Title="MainWindow" Height="450" Width="1200">
<Window.Resources>
<Style TargetType="{x:Type ListViewItem}">
<Style.Triggers>
<Trigger Property="ItemsControl.AlternationIndex" Value="0">
<Setter Property="Background" Value="#1e1e1e"></Setter>
<Setter Property="Foreground" Value="#ffffff"></Setter>
<Setter Property="HorizontalContentAlignment" Value="Stretch" />
<Setter Property="Margin" Value="0"/>
<Setter Property="BorderThickness" Value="0"/>
</Trigger>
<Trigger Property="ItemsControl.AlternationIndex" Value="1">
<Setter Property="Background" Value="#3c3c3c"></Setter>
<Setter Property="Foreground" Value="#ffffff"></Setter>
<Setter Property="HorizontalContentAlignment" Value="Stretch" />
<Setter Property="Margin" Value="0"/>
<Setter Property="BorderThickness" Value="0"/>
</Trigger>
</Style.Triggers>
</Style>
</Window.Resources>
<Viewbox Stretch="Uniform">
<ListView Grid.Row="4" Grid.Column="0" Margin="0,0,0,0" ItemsSource="{Binding Coins}" Name="Tasks" Height="250" AlternationCount="2">
<ListView.View>
<GridView>
<GridView.Columns>
<GridViewColumn Header="" Width="25" DisplayMemberBinding="{Binding Path=Value.X}">
</GridViewColumn>
<GridViewColumn Header="" Width="25" DisplayMemberBinding="{Binding Path=Value.X}"></GridViewColumn>
<GridViewColumn Header="Symbol" Width="70">
<GridViewColumn.CellTemplate>
<DataTemplate>
<TextBlock Text="{Binding Path=Value.Symbol}" TextAlignment="Center" />
</DataTemplate>
</GridViewColumn.CellTemplate>
</GridViewColumn>
<GridViewColumn Header="Lowest" Width="70">
<GridViewColumn.CellTemplate>
<DataTemplate>
<TextBlock Text="{Binding Path=Value.LowestDailyPriceDisplay}" Foreground="#ff0000" TextAlignment="Center" />
</DataTemplate>
</GridViewColumn.CellTemplate>
</GridViewColumn>
<GridViewColumn Header="Price" Width="70">
<GridViewColumn.CellTemplate>
<DataTemplate>
<TextBlock Text="{Binding Path=Value.PriceDecimalDisplay}" TextAlignment="Center" />
</DataTemplate>
</GridViewColumn.CellTemplate>
</GridViewColumn>
<GridViewColumn Header="Highest" Width="70">
<GridViewColumn.CellTemplate>
<DataTemplate>
<TextBlock Text="{Binding Path=Value.HighestDailyPriceDisplay}" Foreground="#00ff00" TextAlignment="Center" />
</DataTemplate>
</GridViewColumn.CellTemplate>
</GridViewColumn>
<GridViewColumn Header="Unit Price" Width="70">
<GridViewColumn.CellTemplate>
<DataTemplate>
<TextBlock Text="{Binding Path=Value.Balance.UnitPriceDisplay}" TextAlignment="Center" />
</DataTemplate>
</GridViewColumn.CellTemplate>
</GridViewColumn>
<GridViewColumn Header="Amount" Width="70">
<GridViewColumn.CellTemplate>
<DataTemplate>
<TextBlock Text="{Binding Path=Value.Balance.AvailableAmountDisplay}" TextAlignment="Center" />
</DataTemplate>
</GridViewColumn.CellTemplate>
</GridViewColumn>
<GridViewColumn Header="Capital" Width="70">
<GridViewColumn.CellTemplate>
<DataTemplate>
<TextBlock Text="{Binding Path=Value.Balance.TotalValueDisplay}" TextAlignment="Center" />
</DataTemplate>
</GridViewColumn.CellTemplate>
</GridViewColumn>
<GridViewColumn Header="Profit" Width="70">
<GridViewColumn.CellTemplate>
<DataTemplate>
<TextBlock Text="{Binding Path=Value.Balance.ProfitDisplay}" Background="{Binding Path=Value.Balance.ProfitPercentageColor}" Foreground="{Binding Path=Value.Balance.ProfitColor}" TextAlignment="Center" />
</DataTemplate>
</GridViewColumn.CellTemplate>
</GridViewColumn>
<GridViewColumn Header="PNL %" Width="70">
<GridViewColumn.CellTemplate>
<DataTemplate>
<TextBlock Text="{Binding Path=Value.Balance.ProfitPercentageDisplay}" TextAlignment="Center" />
</DataTemplate>
</GridViewColumn.CellTemplate>
</GridViewColumn>
<GridViewColumn Header="Day %" Width="70">
<GridViewColumn.CellTemplate>
<DataTemplate>
<TextBlock Text="{Binding Path=Value.PriceChangeInPercentDailyDisplay}" TextAlignment="Center" />
</DataTemplate>
</GridViewColumn.CellTemplate>
</GridViewColumn>
<GridViewColumn Header="Hour %" Width="70">
<GridViewColumn.CellTemplate>
<DataTemplate>
<TextBlock Text="{Binding Path=Value.PriceChangeInPercentHourlyDisplay}" TextAlignment="Center" />
</DataTemplate>
</GridViewColumn.CellTemplate>
</GridViewColumn>
<GridViewColumn Header="Min %" Width="70">
<GridViewColumn.CellTemplate>
<DataTemplate>
<TextBlock Text="{Binding Path=Value.PriceChangeInPercentMinutelyDisplay}" TextAlignment="Center" />
</DataTemplate>
</GridViewColumn.CellTemplate>
</GridViewColumn>
<GridViewColumn Header="Vol BTC/h" Width="70">
<GridViewColumn.CellTemplate>
<DataTemplate>
<TextBlock Text="{Binding Path=Value.LastHourVolumeInBtcDisplay}" TextAlignment="Center" />
</DataTemplate>
</GridViewColumn.CellTemplate>
</GridViewColumn>
<GridViewColumn Header="Net BTC/m" Width="70">
<GridViewColumn.CellTemplate>
<DataTemplate>
<TextBlock Text="{Binding Path=Value.LastMinuteVolumeInBtcDisplay}" TextAlignment="Center" />
</DataTemplate>
</GridViewColumn.CellTemplate>
</GridViewColumn>
</GridView.Columns>
</GridView>
</ListView.View>
</ListView>
</Viewbox>
</Window>
I tried DataTriggers but I am unable to set the ListViewItem background color based on its column header, for example "Profit":
<DataTrigger Binding="{Binding RelativeSource={RelativeSource Self}, Path=Name}" Value="Profit">
<Setter Property="Background" Value="Red" />
</DataTrigger>
Is there a way to access the column header from a listviewitem reference?
The problem in your case is, that control template for the ListViewItem has a Border with Padding=2. The only possibility to get rid of it I see to replace the control template with own. So you can add following to your ListView :
<ListView.ItemContainerStyle>
<Style TargetType="ListViewItem" BasedOn="{StaticResource {x:Type ListViewItem}}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="ListViewItem">
<Border x:Name="Border" Padding="0" SnapsToDevicePixels="true" Background="{TemplateBinding Background}">
<GridViewRowPresenter VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</ListView.ItemContainerStyle>
For more details see also ListView Styles and Templates
If you need you can also customize the VisualStateManager.
Good day.
Please I need to create a datagrid that looks like this screenshot
I found some code that gives direction on how to do similar, but I'm a bit lost in the implementation.
Here is the code which I'm trying to edit
<DataGrid ItemsSource="{Binding }" Name="dataGrid1" AutoGenerateColumns="False"
ColumnHeaderHeight="50" >
<DataGrid.Resources>
<Style x:Key="DataGridColumnHeader" TargetType="{x:Type DataGridColumnHeader}">
<Setter Property="VerticalContentAlignment" Value="Center" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type DataGridColumnHeader}">
<Grid>
<ContentPresenter SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"
VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" />
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</DataGrid.Resources>
<DataGrid.Columns>
<DataGridTextColumn Header="Main1" Width="60"
HeaderStyle="{StaticResource DataGridColumnHeader}">
<DataGridTextColumn.HeaderTemplate>
<DataTemplate>
<StackPanel Orientation="Vertical">
<TextBlock Width="60"/>
<DataGridColumnHeader Content="Nested1" Width="60"/>
</StackPanel>
</DataTemplate>
</DataGridTextColumn.HeaderTemplate>
</DataGridTextColumn>
<DataGridTextColumn Header="Nested2" Width="60"
HeaderStyle="{StaticResource DataGridColumnHeader}">
<DataGridTextColumn.HeaderTemplate>
<DataTemplate>
<StackPanel Orientation="Vertical">
<TextBlock FontWeight="Bold" Text="Main1"/>
<DataGridColumnHeader Content="Nested2" Width="60" />
</StackPanel>
</DataTemplate>
</DataGridTextColumn.HeaderTemplate>
</DataGridTextColumn>
<DataGridTextColumn Width="60"
HeaderStyle="{StaticResource DataGridColumnHeader}">
<DataGridTextColumn.HeaderTemplate>
<DataTemplate>
<StackPanel Orientation="Vertical">
<TextBlock />
<DataGridColumnHeader Content="Nested3" Width="60"/>
</StackPanel>
</DataTemplate>
</DataGridTextColumn.HeaderTemplate>
</DataGridTextColumn>
</DataGrid.Columns>
</DataGrid>
I edited the code to this
<DataGrid Grid.Column="2"
Grid.Row="1" Grid.RowSpan="2"
Height="100"
x:Name="assetListGrid"
HorizontalAlignment="Stretch"
VerticalAlignment="Top"
Margin="10 10 20 20"
Background="{StaticResource ForegroundLightBrush}"
LoadingRow="AddIndexNumberWhenLoadingRow"
BorderThickness="1"
VerticalScrollBarVisibility="Auto"
AutoGenerateColumns="False"
ItemsSource="{Binding AssetList, Mode=TwoWay}"
>
<DataGrid.Resources>
<Style x:Key="DataGridColumnHeader" TargetType="{x:Type DataGridColumnHeader}">
<Setter Property="VerticalContentAlignment" Value="Center" />
<Setter Property="Background" Value="{StaticResource WordBlueBrush}" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type DataGridColumnHeader}">
<Grid Background="{StaticResource WordBlueBrush}">
<ContentPresenter SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"
VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" />
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</DataGrid.Resources>
<DataGrid.Columns>
<DataGridTextColumn Header="Asset"
HeaderStyle="{StaticResource DataGridColumnHeader}">
<DataGridTextColumn.HeaderTemplate>
<DataTemplate>
<StackPanel Orientation="Vertical">
<TextBlock FontSize="{StaticResource FontSizeLarge}"
FontFamily="{StaticResource LatoBold}"
/>
<DataGridColumnHeader Content="Asset Number"/>
</StackPanel>
</DataTemplate>
</DataGridTextColumn.HeaderTemplate>
</DataGridTextColumn>
<DataGridTextColumn Header="Name"
HeaderStyle="{StaticResource DataGridColumnHeader}">
<DataGridTextColumn.HeaderTemplate>
<DataTemplate>
<StackPanel Orientation="Vertical">
<TextBlock FontSize="{StaticResource FontSizeLarge}"
FontFamily="{StaticResource LatoBold}" Text="Asset"/>
<DataGridColumnHeader Content="Name" />
</StackPanel>
</DataTemplate>
</DataGridTextColumn.HeaderTemplate>
</DataGridTextColumn>
<DataGridTextColumn
HeaderStyle="{StaticResource DataGridColumnHeader}">
<DataGridTextColumn.HeaderTemplate>
<DataTemplate>
<StackPanel Orientation="Vertical">
<TextBlock />
<DataGridColumnHeader Content="Role" />
</StackPanel>
</DataTemplate>
</DataGridTextColumn.HeaderTemplate>
</DataGridTextColumn>
<DataGridTextColumn
HeaderStyle="{StaticResource DataGridColumnHeader}">
<DataGridTextColumn.HeaderTemplate>
<DataTemplate>
<StackPanel Orientation="Vertical">
<TextBlock />
<DataGridColumnHeader Content="Comment" />
</StackPanel>
</DataTemplate>
</DataGridTextColumn.HeaderTemplate>
</DataGridTextColumn>
<DataGridTextColumn
HeaderStyle="{StaticResource DataGridColumnHeader}">
<DataGridTextColumn.HeaderTemplate>
<DataTemplate>
<StackPanel Orientation="Vertical">
<TextBlock />
<DataGridColumnHeader Content="Creation TimeStamp" />
</StackPanel>
</DataTemplate>
</DataGridTextColumn.HeaderTemplate>
</DataGridTextColumn>
</DataGrid.Columns>
<DataGridTextColumn
HeaderStyle="{StaticResource DataGridColumnHeader}">
<DataGridTextColumn.HeaderTemplate>
<DataTemplate>
<StackPanel Orientation="Vertical">
<TextBlock />
<DataGridColumnHeader Content="Location" />
</StackPanel>
</DataTemplate>
</DataGridTextColumn.HeaderTemplate>
</DataGridTextColumn>
<DataGridTextColumn
HeaderStyle="{StaticResource DataGridColumnHeader}">
<DataGridTextColumn.HeaderTemplate>
<DataTemplate>
<StackPanel Orientation="Vertical">
<TextBlock />
<DataGridColumnHeader Content="Value" />
</StackPanel>
</DataTemplate>
</DataGridTextColumn.HeaderTemplate>
</DataGridTextColumn>
</DataGrid>
And here is the result
I don't know how to add the next top column ( Manufacturer and its sub columns)
The sub columns of "Asset" looks like a gig-zaw and I can't figure out how to even them out. I have tried to add thesame heights to all column headers to no avail.
Moreover, I'm also finding it hard to modify the cell template and bind it to a particular property in my viewmodel. This is because some of the cells will contain both a textbox and a button.
Can anyone be kind enough to direct me on how to
Even out the heights of the subcolumn headers
Add the 2nd top column
Override the cell template for a single column to contain a button and a text block? enter code here
Here is the answer to couple of questions
Even out the heights of the subcolumn headers
You are missing fonts on Role, Comment, Creation Timestamp columns
FontSize="{StaticResource FontSizeLarge}" FontFamily="{StaticResource LatoBold}"
Add the 2nd top column
You just have to follow the same pattern of design for the next set of columns
<DataGrid Grid.Column="2"
Grid.Row="1" Grid.RowSpan="2"
Height="100"
x:Name="assetListGrid"
HorizontalAlignment="Stretch"
VerticalAlignment="Top"
Margin="10 10 20 20"
BorderThickness="1"
VerticalScrollBarVisibility="Auto"
AutoGenerateColumns="False"
ItemsSource="{Binding AssetList, Mode=TwoWay}"
>
<DataGrid.Resources>
<Style x:Key="DataGridColumnHeader" TargetType="{x:Type DataGridColumnHeader}">
<Setter Property="VerticalContentAlignment" Value="Center" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type DataGridColumnHeader}">
<Grid >
<ContentPresenter SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"
VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" />
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</DataGrid.Resources>
<DataGrid.Columns>
<DataGridTextColumn Header="Asset"
HeaderStyle="{StaticResource DataGridColumnHeader}">
<DataGridTextColumn.HeaderTemplate>
<DataTemplate>
<StackPanel Orientation="Vertical">
<TextBlock/>
<DataGridColumnHeader Content="Asset Number"/>
</StackPanel>
</DataTemplate>
</DataGridTextColumn.HeaderTemplate>
</DataGridTextColumn>
<DataGridTextColumn Header="Name"
HeaderStyle="{StaticResource DataGridColumnHeader}">
<DataGridTextColumn.HeaderTemplate>
<DataTemplate>
<StackPanel Orientation="Vertical">
<TextBlock Text="Asset"/>
<DataGridColumnHeader Content="Name" />
</StackPanel>
</DataTemplate>
</DataGridTextColumn.HeaderTemplate>
</DataGridTextColumn>
<DataGridTextColumn
HeaderStyle="{StaticResource DataGridColumnHeader}">
<DataGridTextColumn.HeaderTemplate>
<DataTemplate>
<StackPanel Orientation="Vertical">
<TextBlock />
<DataGridColumnHeader Content="Role" />
</StackPanel>
</DataTemplate>
</DataGridTextColumn.HeaderTemplate>
</DataGridTextColumn>
<DataGridTextColumn
HeaderStyle="{StaticResource DataGridColumnHeader}">
<DataGridTextColumn.HeaderTemplate>
<DataTemplate>
<StackPanel Orientation="Vertical">
<TextBlock />
<DataGridColumnHeader Content="Comment" />
</StackPanel>
</DataTemplate>
</DataGridTextColumn.HeaderTemplate>
</DataGridTextColumn>
<DataGridTextColumn
HeaderStyle="{StaticResource DataGridColumnHeader}">
<DataGridTextColumn.HeaderTemplate>
<DataTemplate>
<StackPanel Orientation="Vertical">
<TextBlock />
<DataGridColumnHeader Content="Creation TimeStamp" />
</StackPanel>
</DataTemplate>
</DataGridTextColumn.HeaderTemplate>
</DataGridTextColumn>
<DataGridTextColumn Header="Asset"
HeaderStyle="{StaticResource DataGridColumnHeader}">
<DataGridTextColumn.HeaderTemplate>
<DataTemplate>
<StackPanel Orientation="Vertical">
<TextBlock/>
<DataGridColumnHeader Content="Asset Number"/>
</StackPanel>
</DataTemplate>
</DataGridTextColumn.HeaderTemplate>
</DataGridTextColumn>
<DataGridTextColumn Header="Name"
HeaderStyle="{StaticResource DataGridColumnHeader}">
<DataGridTextColumn.HeaderTemplate>
<DataTemplate>
<StackPanel Orientation="Vertical">
<TextBlock Text="Manufacturer "/>
<DataGridColumnHeader Content="Name" />
</StackPanel>
</DataTemplate>
</DataGridTextColumn.HeaderTemplate>
</DataGridTextColumn>
<DataGridTextColumn
HeaderStyle="{StaticResource DataGridColumnHeader}">
<DataGridTextColumn.HeaderTemplate>
<DataTemplate>
<StackPanel Orientation="Vertical">
<TextBlock />
<DataGridColumnHeader Content="Role" />
</StackPanel>
</DataTemplate>
</DataGridTextColumn.HeaderTemplate>
</DataGridTextColumn>
<DataGridTextColumn
HeaderStyle="{StaticResource DataGridColumnHeader}">
<DataGridTextColumn.HeaderTemplate>
<DataTemplate>
<StackPanel Orientation="Vertical">
<TextBlock />
<DataGridColumnHeader Content="Comment" />
</StackPanel>
</DataTemplate>
</DataGridTextColumn.HeaderTemplate>
</DataGridTextColumn>
<DataGridTextColumn
HeaderStyle="{StaticResource DataGridColumnHeader}">
<DataGridTextColumn.HeaderTemplate>
<DataTemplate>
<StackPanel Orientation="Vertical">
<TextBlock />
<DataGridColumnHeader Content="Creation TimeStamp" />
</StackPanel>
</DataTemplate>
</DataGridTextColumn.HeaderTemplate>
</DataGridTextColumn>
</DataGrid.Columns>
<DataGridTextColumn
HeaderStyle="{StaticResource DataGridColumnHeader}">
<DataGridTextColumn.HeaderTemplate>
<DataTemplate>
<StackPanel Orientation="Vertical">
<TextBlock />
<DataGridColumnHeader Content="Location" />
</StackPanel>
</DataTemplate>
</DataGridTextColumn.HeaderTemplate>
</DataGridTextColumn>
<DataGridTextColumn
HeaderStyle="{StaticResource DataGridColumnHeader}">
<DataGridTextColumn.HeaderTemplate>
<DataTemplate>
<StackPanel Orientation="Vertical">
<TextBlock />
<DataGridColumnHeader Content="Value" />
</StackPanel>
</DataTemplate>
</DataGridTextColumn.HeaderTemplate>
</DataGridTextColumn>
</DataGrid>
Hope it helps.
this is not answer but maybe helps :
<DataGrid.Columns>
<DataGridTextColumn Header="1">
<DataGridTextColumn.HeaderTemplate>
<DataTemplate>
<Grid MinWidth="200">
<Grid.ColumnDefinitions>
<ColumnDefinition/>
<ColumnDefinition/>
<ColumnDefinition/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition/>
<RowDefinition/>
</Grid.RowDefinitions>
<TextBlock Text="header" Grid.ColumnSpan="3" HorizontalAlignment="Center"></TextBlock>
<TextBlock Grid.Row="1" Text="col"/>
<TextBlock Grid.Row="1" Grid.Column="1" Text="col1"/>
<TextBlock Grid.Row="1" Grid.Column="2" Text="col2"/>
</Grid>
</DataTemplate>
</DataGridTextColumn.HeaderTemplate>
</DataGridTextColumn>
<DataGridTextColumn Header="2"></DataGridTextColumn>
</DataGrid.Columns>
This is the full implementation of my datagrid
<DataGrid Grid.Column="2"
Grid.Row="1" Grid.RowSpan="2"
x:Name="assetListGrid"
HorizontalAlignment="Stretch"
VerticalAlignment="Top"
Margin="10 10 20 20"
Background="{StaticResource ForegroundLightBrush}"
LoadingRow="AddIndexNumberWhenLoadingRow"
BorderThickness="1"
VerticalScrollBarVisibility="Auto"
AutoGenerateColumns="False"
ItemsSource="{Binding AssetList, Mode=TwoWay}"
>
<DataGrid.Resources>
<Style x:Key="DataGridColumnHeader" TargetType="{x:Type DataGridColumnHeader}">
<Setter Property="VerticalContentAlignment" Value="Center" />
<!--<Setter Property="Background" Value="{StaticResource WordRedBrush}" />-->
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type DataGridColumnHeader}">
<Grid Background="{StaticResource WordBlueBrush}" >
<ContentPresenter SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"
VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" />
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style x:Key="DatagridColumnHeader2" TargetType="{x:Type DataGridColumnHeader}">
<Setter Property="VerticalContentAlignment" Value="Center" />
<Setter Property="BorderBrush" Value="{StaticResource ForegroundLightBrush}"/>
<Setter Property="BorderThickness" Value="0 0 1 0" />
<Setter Property="Background" Value="{StaticResource WordOrangeBrush}" />
<Setter Property="HorizontalContentAlignment" Value="Center" />
<Setter Property="Height" Value="30" />
<Setter Property="FontSize" Value="{StaticResource FontSizeLarge}" />
<Setter Property="Foreground" Value="{StaticResource ForegroundLightBrush}" />
</Style>
</DataGrid.Resources>
<!-- Columns -->
<DataGrid.Columns>
<!-- Asset Properties -->
<!-- Asset Number-->
<DataGridTemplateColumn Header="Asset"
HeaderStyle="{StaticResource DataGridColumnHeader}">
<DataGridTemplateColumn.HeaderTemplate>
<DataTemplate>
<StackPanel Orientation="Vertical">
<TextBlock
FontSize="{StaticResource FontSizeXLarge}"
FontFamily="{StaticResource LatoBold}"
HorizontalAlignment="Center"
Height="40"
/>
<DataGridColumnHeader
HorizontalContentAlignment="Center"
Width="250" Content="Asset Number"/>
</StackPanel>
</DataTemplate>
</DataGridTemplateColumn.HeaderTemplate>
<DataGridTemplateColumn.CellTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal" >
<TextBox Width="90" IsReadOnly="True"
Text="{Binding Name}"
Background="{StaticResource ForegroundLightBrush}"
Style="{StaticResource DataGridTextBox}"/>
<Button Margin="5 0 0 13" HorizontalAlignment="Right"
VerticalAlignment="Center"
Content="Right Click"
Style="{StaticResource ListViewButton}" >
<Button.ContextMenu>
<ContextMenu>
<MenuItem Header="Add Critical Point" />
</ContextMenu>
</Button.ContextMenu>
</Button>
</StackPanel>
</DataTemplate>
</DataGridTemplateColumn.CellTemplate>
</DataGridTemplateColumn>
<!-- Name -->
<DataGridTemplateColumn Header="Name"
HeaderStyle="{StaticResource DataGridColumnHeader}">
<DataGridTemplateColumn.HeaderTemplate>
<DataTemplate>
<StackPanel Orientation="Vertical">
<TextBlock FontSize="{StaticResource FontSizeLarge}"
FontFamily="{StaticResource LatoBold}"
Height="40"
MinWidth="60"
Width="auto"
x:Name="nameHeader"
Text="Asset"/>
<DataGridColumnHeader Width="{Binding ActualWidth, ElementName=nameHeader}" HorizontalContentAlignment="Center"
Content="Name" MaxWidth="150" />
</StackPanel>
</DataTemplate>
</DataGridTemplateColumn.HeaderTemplate>
<DataGridTemplateColumn.CellTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<TextBox MaxWidth="150"
Style="{StaticResource DataGridTextBox}"
/>
</StackPanel>
</DataTemplate>
</DataGridTemplateColumn.CellTemplate>
</DataGridTemplateColumn>
<!-- Role -->
<DataGridTemplateColumn
HeaderStyle="{StaticResource DataGridColumnHeader}">
<DataGridTemplateColumn.HeaderTemplate>
<DataTemplate>
<StackPanel Orientation="Vertical">
<TextBlock FontSize="{StaticResource FontSizeLarge}"
FontFamily="{StaticResource LatoBold}"
Height="40"
Width="auto"
MinWidth="45"
MaxWidth="150"
x:Name="roleHeader"
/>
<DataGridColumnHeader HorizontalContentAlignment="Center" Width="{Binding Path=ActualWidth, ElementName=roleHeader}"
MaxWidth="150" Content="Role" />
</StackPanel>
</DataTemplate>
</DataGridTemplateColumn.HeaderTemplate>
<DataGridTemplateColumn.CellTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<TextBox MaxWidth="150"
Style="{StaticResource DataGridTextBox}"
/>
</StackPanel>
</DataTemplate>
</DataGridTemplateColumn.CellTemplate>
</DataGridTemplateColumn>
<!-- Critical Point-->
<!-- CP Number-->
<DataGridTemplateColumn Header="Critical Point"
HeaderStyle="{StaticResource DataGridColumnHeader}">
<DataGridTemplateColumn.HeaderTemplate>
<DataTemplate>
<StackPanel Orientation="Vertical">
<TextBlock
FontSize="{StaticResource FontSizeLarge}"
FontFamily="{StaticResource LatoBold}"
HorizontalAlignment="Center"
Height="40"
Text="Critical Point"
Padding="0 3 0 0"
/>
<DataGridColumnHeader Style="{StaticResource DatagridColumnHeader2}"
Width="250" Content="CP Number"/>
</StackPanel>
</DataTemplate>
</DataGridTemplateColumn.HeaderTemplate>
<DataGridTemplateColumn.CellTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<TextBox Width="100" IsReadOnly="True"
Text="{Binding CriticalPoint.CPNumber}"
Background="{StaticResource ForegroundLightBrush}"
Style="{StaticResource DataGridTextBox}"/>
<Button Margin="5 0 0 13" HorizontalAlignment="Center"
VerticalAlignment="Center"
Content="Right Click"
Style="{StaticResource ListViewButton}" >
<Button.ContextMenu>
<ContextMenu>
<MenuItem Header="Delete Critical Point" />
</ContextMenu>
</Button.ContextMenu>
</Button>
</StackPanel>
</DataTemplate>
</DataGridTemplateColumn.CellTemplate>
</DataGridTemplateColumn>
<!--Name-->
<DataGridTemplateColumn
HeaderStyle="{StaticResource DataGridColumnHeader}">
<DataGridTemplateColumn.HeaderTemplate>
<DataTemplate>
<StackPanel Orientation="Vertical">
<TextBlock FontSize="{StaticResource FontSizeLarge}"
FontFamily="{StaticResource LatoBold}"
Height="40"
Width="auto"
MinWidth="60"
MaxWidth="150"
x:Name="commentHeader"
/>
<DataGridColumnHeader Style="{StaticResource DatagridColumnHeader2}" Width="{Binding Path=ActualWidth, ElementName=commentHeader}"
MaxWidth="150" Content="Name" />
</StackPanel>
</DataTemplate>
</DataGridTemplateColumn.HeaderTemplate>
<DataGridTemplateColumn.CellTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<TextBox MaxWidth="150"
Background="{StaticResource ForegroundLightBrush}"
Style="{StaticResource DataGridTextBox}"
/>
</StackPanel>
</DataTemplate>
</DataGridTemplateColumn.CellTemplate>
</DataGridTemplateColumn>
<!--Role-->
<DataGridTemplateColumn
HeaderStyle="{StaticResource DataGridColumnHeader}">
<DataGridTemplateColumn.HeaderTemplate>
<DataTemplate>
<StackPanel Orientation="Vertical">
<TextBlock FontSize="{StaticResource FontSizeLarge}"
FontFamily="{StaticResource LatoBold}"
Height="40"
Width="auto"
MinWidth="60"
MaxWidth="150"
x:Name="commentHeader"
/>
<DataGridColumnHeader Style="{StaticResource DatagridColumnHeader2}" Width="{Binding Path=ActualWidth, ElementName=commentHeader}"
MaxWidth="150" Content="Role" />
</StackPanel>
</DataTemplate>
</DataGridTemplateColumn.HeaderTemplate>
<DataGridTemplateColumn.CellTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<TextBox MaxWidth="150"
Background="{StaticResource ForegroundLightBrush}"
Style="{StaticResource DataGridTextBox}"
/>
</StackPanel>
</DataTemplate>
</DataGridTemplateColumn.CellTemplate>
</DataGridTemplateColumn>
</DataGrid.Columns>
</DataGrid>
I am using MyToolKit Grid in my uwp app. So in one column of that grid I am displaying the image/icon. Now I want to show that image based on specific condition.Did any one have idea about this?
In the following code I want to show the admin.png conditionally.
The code I have used for Grid and Icon is:
<Border x:Name="WideMainGrid" Grid.Row="1" Grid.ColumnSpan="8" Background="Black" BorderThickness="1" BorderBrush="Gray" Margin="10,-5,5,0">
<ScrollViewer x:Name="svCartItemsList" HorizontalScrollBarVisibility="Disabled" VerticalScrollBarVisibility="Auto" Grid.Row="1" Grid.ColumnSpan="8">
<controls:DataGrid x:Name="dgNewBill" RowBackgroundEvenBrush="Black" RowBackgroundOddBrush="Black" ItemsSource="{Binding objStockIssueItemList}" VerticalAlignment="Stretch" Height="470" SelectionMode="Single" TabNavigation="Local" HeaderBackground="Black" Background="Black" BorderThickness="1" BorderBrush="Gray" Grid.Row="2" Grid.ColumnSpan="9" Margin="0,0,0,0" Loading="dgNewBill_Loading">
<controls:DataGrid.Columns>
<controls:DataGridTextColumn Binding="{Binding SNumber}" Width="0.7*" CanSort="False" Foreground="White">
<controls:DataGridTextColumn.Style>
<Style TargetType="TextBlock">
<Setter Property="TextAlignment" Value="Center"></Setter>
<Setter Property="VerticalAlignment" Value="Center"></Setter>
<!--<Setter Property="MinHeight" Value="30"></Setter>-->
</Style>
</controls:DataGridTextColumn.Style>
</controls:DataGridTextColumn>
<controls:DataGridTemplatedColumn CellTemplate="{StaticResource myCellTemplateMonth}" Width="3*" x:Name="ItemDesc" CanSort="False" IsAscendingDefault="True">
</controls:DataGridTemplatedColumn>
<controls:DataGridTextColumn Binding="{Binding uom}" Width="0.7*" CanSort="False" Foreground="White">
<controls:DataGridTextColumn.Style>
<Style TargetType="TextBlock">
<Setter Property="TextAlignment" Value="Center"></Setter>
<Setter Property="VerticalAlignment" Value="Center"></Setter>
<Setter Property="Margin" Value="0,0,0,0"></Setter>
</Style>
</controls:DataGridTextColumn.Style>
</controls:DataGridTextColumn>
<controls:DataGridTemplatedColumn Width="0.7*" CanSort="False">
<controls:DataGridTemplatedColumn.CellTemplate>
<DataTemplate>
<StackPanel Name="pricePanel" Height="30" Tapped="pricePanel_Tapped" HorizontalAlignment="Stretch" >
<TextBlock Name="price" Foreground="White" Text='{Binding editedPrice}' TextAlignment="Center" HorizontalAlignment="Stretch" VerticalAlignment="Center" Margin="0,5,0,0"></TextBlock>
</StackPanel>
</DataTemplate>
</controls:DataGridTemplatedColumn.CellTemplate>
</controls:DataGridTemplatedColumn>
<controls:DataGridTemplatedColumn Width="1.2*" CanSort="False">
<controls:DataGridTemplatedColumn.CellTemplate>
<DataTemplate>
<StackPanel Name="quantityPanel" Height="30" Tapped="quantityPanel_Tapped" HorizontalAlignment="Stretch">
<TextBlock Name="quantity" TextAlignment="Center" Foreground="White" Text='{Binding quantity}' HorizontalAlignment="Stretch" VerticalAlignment="Center" Margin="0,5,0,0"></TextBlock>
</StackPanel>
</DataTemplate>
</controls:DataGridTemplatedColumn.CellTemplate>
</controls:DataGridTemplatedColumn>
<controls:DataGridTemplatedColumn Width="0.7*" CanSort="False">
<controls:DataGridTemplatedColumn.CellTemplate>
<DataTemplate>
<StackPanel Name="discountPanel" Height="30" Tapped="discountPanel_Tapped" HorizontalAlignment="Stretch" >
<TextBlock Name="Discount" TextAlignment="Center" Foreground="White" Text='{Binding discount}' HorizontalAlignment="Stretch" VerticalAlignment="Center" Margin="10,5,0,0"></TextBlock>
</StackPanel>
</DataTemplate>
</controls:DataGridTemplatedColumn.CellTemplate>
</controls:DataGridTemplatedColumn>
<controls:DataGridTextColumn Binding="{Binding cartTotal}" Width="0.7*" CanSort="False" Foreground="White">
<controls:DataGridTextColumn.Style>
<Style TargetType="TextBlock">
<Setter Property="HorizontalAlignment" Value="Center"></Setter>
<Setter Property="VerticalAlignment" Value="Center"></Setter>
</Style>
</controls:DataGridTextColumn.Style>
</controls:DataGridTextColumn>
<!--delete image column-->
<controls:DataGridTemplatedColumn CanSort="False" Width="0.7*">
<controls:DataGridTemplatedColumn.CellTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal" Margin="5,0,0,0">
<StackPanel x:Name="voidImagePanel" Tapped="voidImagePanel_Tapped">
<Image x:Name="VoidImage" Source="{Binding imageUrl}" Height="25" Width="35" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="0,2,0,0"></Image>
</StackPanel>
<StackPanel Height="28" Name="salesPersonDetails" Tapped="salesPersonDetails_Tapped">
<Image x:Name="salesDetail" Source="/Images/admin.png" Height="22" Width="35" Margin="0,2,0,0"></Image>
</StackPanel>
</StackPanel>
</DataTemplate>
</controls:DataGridTemplatedColumn.CellTemplate>
</controls:DataGridTemplatedColumn>
</controls:DataGrid.Columns>
</controls:DataGrid>
</ScrollViewer>
</Border>
I want to align the column headers to the left and the detail in the column to the right.
The header I get right, but the detail (textBlock) does not want to align to the right. Please help. Here is my code
<ListView HorizontalAlignment="Stretch"
ItemsSource="{Binding Trans}"
Grid.Row="2"
Grid.Column="0"
Grid.ColumnSpan="5"
ScrollViewer.VerticalScrollBarVisibility="Auto"
MaxHeight="230">
<!--Align column header to the left-->
<ListView.Resources>
<Style TargetType="{x:Type GridViewColumnHeader}">
<Setter Property="HorizontalContentAlignment" Value="Left"/>
</Style>
<Style TargetType="{x:Type ListViewItem}">
<Setter Property="HorizontalAlignment" Value="Stretch"/>
</Style>
</ListView.Resources>
<ListView.View>
<GridView ScrollViewer.HorizontalScrollBarVisibility="Auto">
<GridViewColumn Header="Amount" >
<GridViewColumn.CellTemplate>
<DataTemplate>
<TextBlock Foreground="Black" HorizontalAlignment="Right" Text="{Binding Path=Amount, StringFormat=N2}"/>
</DataTemplate>
</GridViewColumn.CellTemplate>
</GridViewColumn>
</GridView>
</ListView.View>
</ListView>
Please add the following attribute to text block and check
TextAlignment="Right"
to TextBlock node in Data template
Also if that didn't solve please try adding
Setter Property="HorizontalContentAlignment" Value="Right" to listview item Style
This should work,
<GridView ScrollViewer.HorizontalScrollBarVisibility="Auto">
<GridViewColumn Header="Amount" >
<GridViewColumn.CellTemplate >
<DataTemplate >
<StackPanel Width="200" >
<TextBlock Foreground="Black" TextAlignment="Right" Text="{Binding Path=Amount, StringFormat=N2}"/>
</StackPanel>
</DataTemplate>
</GridViewColumn.CellTemplate>
</GridViewColumn>
</GridView>
Try to play with something like this :
<ListView Grid.IsSharedSizeScope="True">
<ListView.Resources>
<Style TargetType="{x:Type GridViewColumnHeader}">
<Setter Property="HorizontalContentAlignment" Value="Left"/>
</Style>
<Style TargetType="{x:Type ListViewItem}">
<Setter Property="HorizontalAlignment" Value="Stretch"/> <!-- Redundent -->
</Style>
</ListView.Resources>
<ListView.View>
<GridView>
<GridViewColumn Header="Amount" >
<GridViewColumn.HeaderTemplate>
<DataTemplate>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition SharedSizeGroup="A" />
</Grid.ColumnDefinitions>
<TextBlock Foreground="Black" Background="AliceBlue" Text="{Binding}"/>
</Grid>
</DataTemplate>
</GridViewColumn.HeaderTemplate>
<GridViewColumn.CellTemplate>
<DataTemplate>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition SharedSizeGroup="A" />
</Grid.ColumnDefinitions>
<TextBlock Foreground="Black" Background="AliceBlue" HorizontalAlignment="Right" Text="{Binding Path=Amount}"/>
</Grid>
</DataTemplate>
</GridViewColumn.CellTemplate>
</GridViewColumn>
</GridView>
</ListView.View>
</ListView>