How to divide a grid in ListView, in UWP - xaml

Question

<Grid Grid.Row="3" HorizontalAlignment="Stretch">
<ListView x:Name="lvAlert" HorizontalAlignment="Stretch">
<ListView.ItemTemplate>
<DataTemplate>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="70*"/>
<ColumnDefinition Width="30*"/>
</Grid.ColumnDefinitions>
<Grid Grid.Column="0" Background="{Binding ColorValue }" >
<TextBlock Text="{Binding AlertType}" Foreground="White" Height="35" HorizontalAlignment="Stretch"/>
</Grid>
<Grid Grid.Column="1" Background="{Binding ColorValue }" >
<TextBlock Text="{Binding AlertTypeValue}" Foreground="Black" Height="35" HorizontalAlignment="Stretch"/>
</Grid>
<TextBlock Grid.Column="0" Text="{Binding AlertType}" Foreground="{Binding ColorValue }" Width="400" Height="40"/>
<TextBlock Grid.Column="1" Text="{Binding AlertTypeValue}" Foreground="{Binding ColorValue }" Width="400" Height="40"/>
</Grid>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
</Grid>
When I run the above code I got an output as in a single line without getting properly separation in 70% and 30%. Can anyone solve this?

Answer 1

By default, ListView's items don't stretch horizontally, but stick to the left.
Your problem should be solved by this code:
<ListView.ItemContainerStyle>
<Style TargetType="ListViewItem">
<Setter Property="HorizontalContentAlignment"
Value="Stretch" />
</Style>
</ListView.ItemContainerStyle>

Answer 2

When I run the above code I got an output as in a single line without getting properly separation in 70% and 30%. Can anyone solve this?
It's because the Height of ColumnDefinitions should be set 7* and 3* instead of 70* and 30*:
<Grid.ColumnDefinitions>
<ColumnDefinition Width="7*"/>
<ColumnDefinition Width="3*"/>
</Grid.ColumnDefinitions>
For details of Grid usage, you can refer to Gird Class.