WPF ListView中的网格线

Question

如何在WPF ListView控件中显示网格线？

Answer 1

尝试这些资源 - 它们都提供了类似的简单解决方案，我过去已经成功使用过。

WPF ListView Vertical Lines (Horizontal as Bonus

How Do I Set Up Grid Lines for my ListView?

Answer 2

实现自定义GridViewRowPresenter并在ArrangeOverride方法中绘制垂直线。

    protected override Size ArrangeOverride(Size arrangeSize)
    {
        var size = base.ArrangeOverride(arrangeSize);
        var children = Children.ToList();
        EnsureLines(children.Count);
        for (var i = 0; i < _lines.Count; i++)
        {
            var child = children[i];
            var x = child.TransformToAncestor(this).Transform(new Point(child.ActualWidth, 0)).X + child.Margin.Right;
            var rect = new Rect(x, -Margin.Top, 1, size.Height + Margin.Top + Margin.Bottom);
            var line = _lines[i];
            line.Measure(rect.Size);
            line.Arrange(rect);
        }
        return size;
    }

然后将其用于ListViewItem模板。

        <ListView.ItemContainerStyle>
            <Style TargetType="{x:Type ListViewItem}">
                <Setter Property="Margin" Value="2,0,0,0"/>
                <Setter Property="Padding" Value="0,2"/>
                <Setter Property="BorderBrush" Value="LightGray"/>
                <Setter Property="BorderThickness" Value="0,0,0,1"/>
                <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="{x:Type ListViewItem}">
                            <Border BorderBrush="{TemplateBinding BorderBrush}" 
                                    BorderThickness="{TemplateBinding BorderThickness}" 
                                    Background="{TemplateBinding Background}">
                                <GridLines:GridViewRowPresenterWithGridLines 
                                    Columns="{TemplateBinding GridView.ColumnCollection}"
                                    Margin="{TemplateBinding Padding}" />
                            </Border>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
                <Style.Triggers>
                    <Trigger Property="IsSelected" Value="True">
                        <Setter Property="Background" Value="{DynamicResource {x:Static SystemColors.ControlDarkBrushKey}}"/>
                    </Trigger>
                    <Trigger Property="IsEnabled" Value="False">
                        <Setter Property="Background" Value="{DynamicResource {x:Static SystemColors.ControlBrushKey}}"/>
                    </Trigger>
                </Style.Triggers>
            </Style>
        </ListView.ItemContainerStyle>

See details in my blog entry

Answer 3

迟到的答案，但它可能对某人有所帮助：

首先为celltemplate边框创建一个样式，如下所示：

 <Style x:Key="BorderStyle" TargetType="{x:Type Border}">
     <Setter Property="BorderThickness" Value="0,0,1,0"></Setter>
     <Setter Property="BorderBrush" Value="Black"></Setter>
     <Setter Property="Margin" Value="0,0,-7,0"></Setter>
 </Style>
 <DataTemplate x:Key="_SomeColumnCellTemplate">
     <Border Style="{StaticResource BorderStyle}">
        <DockPanel Margin="5,0,0,0">
           <TextBlock Text="{Binding Name}" Margin="5,0,0,0"/>
        </DockPanel>
     </Border>
  </DataTemplate>

然后按如下方式设置itemcontainer样式：

  <Style x:Key="_ItemContainerStyle" TargetType="{x:Type ListViewItem}">
     <Setter Property="HorizontalContentAlignment" Value="Stretch" />
     <Setter Property="VerticalContentAlignment" Value="Stretch" />
  </Style>

最后引用你的listview项容器样式资源，如下所示（我跳过绑定到此代码中的listview项源）：

<ListView ItemContainerStyle="{StaticResource _ListViewItemContainerStyle}">
   <ListView.View>
      <GridView>
         <GridViewColumn Header="SomeName" CellTemplate="{StaticResource _SomeColumnCellTemplate}"/>
      </GridView>
   </ListView.View>
</ListView>

Answer 4

阐述我的comment to selected answer - （必须在右侧边缘使用-8）

<ListView HorizontalContentAlignment="Stretch" BorderBrush="Gray" BorderThickness="1" ItemsSource="{Binding FileList}" SelectedItem="{Binding FileSelected, Mode=TwoWay}" >
    <ListView.Resources>
        <DataTemplate x:Key="VerTemplate">
            <Border BorderBrush="Gray" BorderThickness="1,0,0,0" Margin="-6,-2,-8,-2">
                <StackPanel Margin="6,2,6,2">
                    <TextBlock Text="{Binding SFVer}" HorizontalAlignment="Center" TextAlignment="Center"  />
                </StackPanel>
            </Border>
        </DataTemplate>
        <DataTemplate x:Key="FOTemplate">
            <Border BorderBrush="Gray" BorderThickness="1,0,0,0" Margin="-6,-2,-8,-2">
                <StackPanel Margin="6,2,6,2">
                    <TextBlock Text="{Binding SFFO}" HorizontalAlignment="Center" TextAlignment="Center"  />
                </StackPanel>
            </Border>
        </DataTemplate>             
        <!-- etc. -->
    </ListView.Resources>
    <ListView.ItemContainerStyle>
        <Style TargetType="ListViewItem">
            <Setter Property="HorizontalContentAlignment" Value="Stretch" />
            <Setter Property="BorderBrush" Value="Gray"></Setter>
            <Setter Property="BorderThickness" Value="0,0,0,1"></Setter>
        </Style>
    </ListView.ItemContainerStyle>
    <ListView.View>
        <GridView AllowsColumnReorder="False">
            <GridView.Columns>
                <GridViewColumn CellTemplate="{StaticResource VerTemplate}"/>
                <GridViewColumn CellTemplate="{StaticResource FOTemplate}"/>
                <!-- etc. -->
            </GridView.Columns>
        </GridView>
    </ListView.View>            
</ListView>

结果：