Greetings.

The topic is again about the unusual ListView.
In general, there is a code:

<Window.Resources> <vm:ViewModel x:Key="viewModel"/> <Style x:Key="cellBorder" TargetType="Border"> <Setter Property="BorderBrush" Value="#F0F0F0" /> <Setter Property="BorderThickness" Value="1" /> </Style> </Window.Resources> <Grid DataContext="{StaticResource viewModel}"> <Grid> <Grid.RowDefinitions> <RowDefinition Height="Auto"/> <RowDefinition Height="*"/> </Grid.RowDefinitions> <!-- headers --> <Grid Grid.Row="0" Background="#FDFDFD"> <Grid.ColumnDefinitions> <ColumnDefinition Width="*"/> <ColumnDefinition Width="*"/> </Grid.ColumnDefinitions> <Border Grid.Column="0" Style="{StaticResource cellBorder}"> <TextBlock HorizontalAlignment="Center" Text="Name"/> </Border> <Border Grid.Column="1" Style="{StaticResource cellBorder}"> <TextBlock HorizontalAlignment="Center" Text="Price"/> </Border> </Grid> <ListView Grid.Row="1" BorderThickness="0" HorizontalContentAlignment="Stretch" ItemsSource="{Binding Products}"> <ListView.Resources> <!-- this is what unselected items will look like --> <DataTemplate x:Key="DefaultItemTemplate"> <Grid> <Grid.ColumnDefinitions> <ColumnDefinition Width="*"/> <ColumnDefinition Width="*"/> </Grid.ColumnDefinitions> <TextBlock Grid.Column="0" Margin="3" FontSize="12" Text="{Binding Name}" /> <TextBlock Grid.Column="1" Margin="3" FontSize="12" Text="{Binding Price}" /> </Grid> </DataTemplate> <!-- this is what selected items will look like --> <DataTemplate x:Key="SelectedItemTemplate"> <Grid MinHeight="80" MaxHeight="150"> <Grid.RowDefinitions> <RowDefinition Height="Auto"/> <RowDefinition Height="*"/> </Grid.RowDefinitions> <Grid.ColumnDefinitions> <ColumnDefinition Width="*"/> <ColumnDefinition Width="*"/> </Grid.ColumnDefinitions> <!-- normal row data (with bold) --> <TextBlock Grid.Row="0" Grid.Column="0" Margin="3" FontSize="12" FontWeight="Bold" Text="{Binding Name}" /> <TextBlock Grid.Row="0" Grid.Column="1" Margin="3" FontSize="12" FontWeight="Bold" Text="{Binding Price}" /> <!-- the panel below row --> <Grid Grid.Row="1" Grid.ColumnSpan="2" Margin="0,10,0,0"> <TextBox Margin="3" HorizontalAlignment="Left" Width="300" MinLines="6" AcceptsReturn="True" VerticalScrollBarVisibility="Auto" Text="{Binding Description}"/> </Grid> </Grid> </DataTemplate> </ListView.Resources> <ListView.ItemContainerStyle> <Style TargetType="ListBoxItem"> <!-- default item template when not selected --> <Setter Property="ContentTemplate" Value="{StaticResource DefaultItemTemplate}" /> <Style.Triggers> <Trigger Property="IsSelected" Value="True"> <!-- when selected change item template --> <Setter Property="ContentTemplate" Value="{StaticResource SelectedItemTemplate}" /> </Trigger> </Style.Triggers> </Style> </ListView.ItemContainerStyle> </ListView> </Grid> </Grid>

It works like this:

http://i.gyazo.com/7fd806741c1936ceb3f9cc6ba38435f6.gif

The problem is that you can not change the width of the columns, or * , or a fixed width for all.

I need to set an individual width for each column or be able to change this width with the mouse. How to implement this feature in this example?

  • @updat, If you are given an exhaustive answer, mark it as correct (click on the check mark next to the selected answer). - Nicolas Chabanovsky ♦

1 answer 1

No, you are doing wrong. You have defined columns, but your DataTemplate does not use these columns, but defines its own. Thus, your speakers have their own behavior and react incorrectly to changes in these speakers.

Use the GridView in ListView.View .

  • If you do as you said, add columns via the GridView in ListView.View, the panel effect will disappear. - updat
  • @updat: What is a panel effect? If you are on the display of the selected line, then use the code, as in the last comment to the previous question . - VladD
  • In your example, the panel and its elements depend on the size of the columns, I need an independent panel as in this example, only in this example it is impossible to adjust the size of the columns, which is not necessary for me. - updat
  • @updat: And what should be with the columns in a collapsed state? - VladD
  • I did not understand what you mean, the animation shows that there is an element with text on the panel, if you pay attention, this element does not depend on the size of the column and is not included in any definite column, but in this example you cannot adjust the size of the columns , and I need to be able to. You gave a link to the previous question, in it the answers are also not what I need, the panel is there, and its elements are included in a certain column and depend on it. - updat