WPF ListView.ItemContainerStyle 同时按下所有 ListViewItem 元素

Question

这是我原来的 ListView 的样子：

请注意，ListView 位于 Grid 列中（如果您想要完整的视图 XAML，我稍后会编辑 post）。这是 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>

WPF ListView.ItemContainerStyle 同时按下所有 ListViewItem 元素

WPF ListView.ItemContainerStyle Presses All ListViewItem Elements Together

c#

wpf

listview

styling