In Listview configured heders. Everything works fine. I thought to add the lines themselves in the same way - but here everything is displayed clumsily

enter image description here

<ListView x:Name="listView" Grid.Column="0" HorizontalAlignment="Stretch" VerticalAlignment="Top"> <ListView.HeaderTemplate> <DataTemplate> <Grid Background="Gray"> <Grid.ColumnDefinitions> <ColumnDefinition Width="*"/> <ColumnDefinition Width="*"/> <ColumnDefinition Width="*"/> </Grid.ColumnDefinitions> <TextBlock Text="Блюдо" Grid.Column="0" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="7,2,0,0" FontWeight="Bold" FontSize="18" ></TextBlock> <TextBlock Text="Цена" Grid.Column="1" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="7,2,0,0" FontWeight="Bold" FontSize="18" ></TextBlock> <TextBlock Text="Количество" Grid.Column="2" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="7,2,0,0" FontWeight="Bold" FontSize="18" ></TextBlock> </Grid> </DataTemplate> </ListView.HeaderTemplate> <ListView.ItemTemplate> <DataTemplate> <Grid > <Grid.ColumnDefinitions> <ColumnDefinition Width="*" /> <ColumnDefinition Width="*"/> <ColumnDefinition Width="*"/> </Grid.ColumnDefinitions> <TextBlock Text="{Binding bludo}" Grid.Column="0" FontSize="18" ></TextBlock> <TextBlock Text="{Binding tsena}" Grid.Column="1" FontSize="18" ></TextBlock> <TextBlock Text="{Binding kol}" Grid.Column="2" FontSize="18" ></TextBlock> </Grid> </DataTemplate> </ListView.ItemTemplate> </ListView> </Grid>
  • You invent the table something. Why not embedded GridView? In general, whatever one may say for tables is better DataGrid - vitidev
  • @vitidev: For my taste, the DataGrid is terrible in the sense of mapping, and is only suitable for the direct presentation of tables (which is almost never needed by a normal user). - VladD
  • @Radzhab: Well, take Snoop and see what exactly spoils your layout. - VladD
  • what kind of snoop ???? - Radzhab
  • @VladD is terrible, of course. but it is at least customizable - remove the delimiters and the visualization of the lines that started, and here in the end it will be that on the screenshot - vitidev

2 answers 2

You incorrectly align your columns, because you need to set a common group in the Grid ( SharedSizeGroup ). But it's easier to really use View=GridView if you need a boring table layout:

 <ListView ItemsSource="{Binding}"> <ListView.Resources> <Style TargetType="{x:Type GridViewColumnHeader}"> <Setter Property="Background" Value="Gray" /> <Setter Property="HorizontalContentAlignment" Value="Left" /> <Setter Property="TextBlock.FontWeight" Value="Bold" /> <Setter Property="Padding" Value="5" /> </Style> </ListView.Resources> <ListView.View> <GridView> <GridViewColumn Header="Название" DisplayMemberBinding="{Binding Name}"/> <GridViewColumn Header="Цена" DisplayMemberBinding="{Binding Price}"/> <GridViewColumn Header="Количество" DisplayMemberBinding="{Binding Quantity}"/> </GridView> </ListView.View> </ListView>

I managed:

screenshot

Update.

Okay, the UWP is more complicated. I managed to stretch the columns like this:

 <ListView ...> <ListView.ItemContainerStyle> <Style TargetType="ListViewItem"> <Setter Property="HorizontalContentAlignment" Value="Stretch"/> </Style> </ListView.ItemContainerStyle> <!-- всё остальное -->
  • unfortunately I have a UWP and your code is not working - Radzhab
  • @Radzhab: Okay, try the addition in the answer. - VladD

Add ItemsContainerStyle to the ListView with these contents:

 <Style x:Key="MyListViewItemsContainerStyle" TargetType="ListViewItem"> <Setter Property="HorizontalContentAlignment" Value="Stretch"/> </Style>