WPF XAML Listview水平線

Question

我想在每個項目之間的列表視圖中添加一條水平線（參見圖片）。

我不確定我將如何適應當前的xaml以做到這一點。 如果可能的話，我希望這條線在圖片的兩端逐漸淡出。

謝謝。

當前的XAML：

<Setter Property="FocusVisualStyle" Value="{x:Null}" />
<Setter Property="BorderThickness" Value="0" />
<Setter Property="Foreground" Value="#787f82" />
<Setter Property="Template">
    <Setter.Value>
        <ControlTemplate TargetType="{x:Type ListViewItem}">
            <Border
                 BorderBrush="Transparent"
                 BorderThickness="0"
                 Background="{TemplateBinding Background}">
                <GridViewRowPresenter HorizontalAlignment="Stretch" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" Width="Auto" Margin="0" Content="{TemplateBinding Content}"/>
            </Border>
        </ControlTemplate>
    </Setter.Value>
</Setter>

圖片示例：

Answer 1

我自己就能解決。 我將在下面發布我的代碼，以便其他人可能有機會自己做。

我只是為每個項目的底部設置了邊框，即他們對邊框應用了漸變。

 <Style x:Key="level1" TargetType="{x:Type ListViewItem}">
        <Setter Property="FocusVisualStyle" Value="{x:Null}" />
        <Setter Property="BorderThickness" Value="0" />
        <Setter Property="Foreground" Value="#787f82" />
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type ListViewItem}">
                    <Border
                         BorderThickness="0,0,0,2"
                         Background="{TemplateBinding Background}">
                        <GridViewRowPresenter HorizontalAlignment="Stretch" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" Width="Auto" Margin="0" Content="{TemplateBinding Content}"/>
                        <Border.BorderBrush>
                            <LinearGradientBrush StartPoint="0,1" EndPoint="1,0" Opacity="0.3">
                                <GradientStop Offset="0" Color="transparent"/>
                                <GradientStop Offset="0.5" Color="white"/>
                                <GradientStop Offset="1" Color="transparent"/>
                            </LinearGradientBrush>
                        </Border.BorderBrush>
                    </Border>
                </ControlTemplate>
            </Setter.Value>
        </Setter>

        <Style.Triggers>
            <Trigger Property="IsMouseOver" Value="True">
                <Setter Property="Background">
                    <Setter.Value>
                        <ImageBrush ImageSource="images/selection-large.png"/>
                    </Setter.Value>
                </Setter>
                <Setter Property="BorderThickness" Value="0" />
            </Trigger>
            <Trigger Property="IsSelected" Value="True">
                <Setter Property="Background">
                    <Setter.Value>
                        <ImageBrush ImageSource="images/selection-large.png"/>
                    </Setter.Value>
                </Setter>
                <Setter Property="BorderThickness" Value="0" />
                <Setter Property="Foreground" Value="#FFFFFF" />
                <Setter Property="FontWeight" Value="bold" />
            </Trigger>
        </Style.Triggers>
    </Style>

Answer 2

我的解決方案是使用ListView.ItemContainerStyle屬性設置項目容器所需的樣式

                <ListView ItemsSource="{Binding Champs}" Name="listView1" HorizontalContentAlignment="Stretch" Background="Transparent" Padding="-1" >
                    <ListView.ItemContainerStyle>
                        <Style>
                            <Setter Property="Control.Background" Value="White" />
                            <Setter Property="Control.BorderThickness" Value="0.3" />
                            <Setter Property="Control.BorderBrush" Value="Black" />
                        </Style>
                    </ListView.ItemContainerStyle>

                    <ListBox.ItemTemplate>
                        <DataTemplate>
                            <Grid Margin="0,5,0,5">
                                <Grid.RowDefinitions>
                                    <RowDefinition Height="Auto"/>
                                    <RowDefinition Height="*" />
                                </Grid.RowDefinitions>
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition Width="*"/>
                                </Grid.ColumnDefinitions>
                                <TextBlock Text="{Binding Nom}" FontWeight="Bold" FontSize="10" />
                                <TextBox Grid.Row="1" TextAlignment="Center" Text="{Binding Valeur}" />
                            </Grid>
                        </DataTemplate>
                    </ListBox.ItemTemplate>
                </ListView>