WPF ListView.ItemContainerStyle将所有ListViewItem元素压缩在一起

Question

这是我原来的ListView的样子：

请注意，ListView位于Grid列中（如果您想要查看完整的XAML，我稍后会编辑该帖子）。这是ListView的XAML：

<ListView Name="Worklist" Margin="5 2 5 5" BorderBrush="Transparent" Width="275" HorizontalAlignment="Left" Background="{StaticResource AppBackground}"
        SelectedIndex="{Binding WorklistIndex}">
    <ListView.ItemTemplate>
        <DataTemplate>
            <Border BorderBrush="White" BorderThickness="3" Margin="3 5 3 5" CornerRadius="8" Padding="4" >
                <StackPanel >
                    <TextBlock Text="{Binding SampleName}" FontSize="16" Margin="0 0 0 5" />
                    <Grid>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition />
                            <ColumnDefinition />
                        </Grid.ColumnDefinitions>
                        <TextBlock Text="{Binding SampleID}" FontSize="12" HorizontalAlignment="Left" />
                        <TextBlock Text="{Binding Test}" FontSize="12" HorizontalAlignment="Right" Grid.Column="1"/>
                    </Grid>
                </StackPanel>
            </Border>
        </DataTemplate>
    </ListView.ItemTemplate>
</ListView>

当我添加ListView.ItemContainerStyle部分时，ListViewItem中的元素会被压缩：

<ListView Name="Worklist" Margin="5 2 5 5" BorderBrush="Transparent" Width="275" HorizontalAlignment="Left" Background="{StaticResource AppBackground}"
        SelectedIndex="{Binding WorklistIndex}">
    <ListView.ItemContainerStyle>
        <Style TargetType="{x:Type ListViewItem}" >
            <Style.Triggers>
                <EventTrigger RoutedEvent="Loaded">
                    <EventTrigger.Actions>
                        <BeginStoryboard>
                            <Storyboard>
                                <DoubleAnimation Storyboard.TargetProperty="Opacity" From="0" To="1" Duration="0:0:2" />
                            </Storyboard>
                        </BeginStoryboard>
                    </EventTrigger.Actions>
                </EventTrigger>
            </Style.Triggers>
        </Style>
    </ListView.ItemContainerStyle>
    <ListView.ItemTemplate>
        <DataTemplate>
            <Border BorderBrush="White" BorderThickness="3" Margin="3 5 3 5" CornerRadius="8" Padding="4" >
                <StackPanel >
                    <TextBlock Text="{Binding SampleName}" FontSize="16" Margin="0 0 0 5" />
                    <Grid>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition />
                            <ColumnDefinition />
                        </Grid.ColumnDefinitions>
                        <TextBlock Text="{Binding SampleID}" FontSize="12" HorizontalAlignment="Left" />
                        <TextBlock Text="{Binding Test}" FontSize="12" HorizontalAlignment="Right" Grid.Column="1"/>
                    </Grid>
                </StackPanel>
            </Border>
        </DataTemplate>
    </ListView.ItemTemplate>
</ListView>

如何允许ListViewItem拉伸Grid列的整个宽度但保持淡入动画？

Answer 1

在ListView定义中，将HorizontalContentAlignment属性设置为Stretch。

<ListView 
  Name="Worklist" 
  Margin="5 2 5 5" 
  BorderBrush="Transparent" 
  Width="275" 
  HorizontalAlignment="Left" 
  HorizontalContentAlignment="Stretch" 
  Background="{StaticResource AppBackground}" 
  SelectedIndex="{Binding WorklistIndex}">
...
</ListView>