如何在 WPF Grid 中设置行边框和背景颜色答案

【问题标题】：How to set row border and background color in WPF Grid如何在 WPF Grid 中设置行边框和背景颜色
【发布时间】：2012-06-28 12:17:06
【问题描述】：

我们如何在 WPF 网格控件中设置边框和背景颜色，
我正在动态创建行和列然后添加到网格中，
我们可以从后面的代码中设置颜色和边框吗？

【问题讨论】：

标签： wpf grid wpf-controls

【解决方案1】：

这里有一个似乎运作良好的 hack。如果您将背景元素与通常放置在那里的元素一起放置在行/列中，它将充当背景。您只需要注意 XAML 中元素的顺序（元素以递增的 Z-Order 出现），或相应地设置 Panel.Zorder。

<Window x:Class="gridBackground.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="MainWindow" Height="350" Width="525">
<Grid>
    <Grid.RowDefinitions>
        <RowDefinition/>
        <RowDefinition/>
        <RowDefinition/>
    </Grid.RowDefinitions>
    <Grid.ColumnDefinitions>
        <ColumnDefinition/>
        <ColumnDefinition/>
    </Grid.ColumnDefinitions>
        <Border Background="Red" />
        <Border Grid.Row="2" Grid.Column="1"  Background="Red" />        
        <Border  Grid.Row="1" Background="LightBlue" />       
        <Border Grid.Row="2" Background="Orange" />
        <Border Grid.Row="0" Grid.Column="1" Background="Orange" />
        <TextBlock Grid.ColumnSpan="2" Grid.Row="1" Text="Here is some more text" HorizontalAlignment="Center"  VerticalAlignment="Center"/>
        <TextBlock Grid.ColumnSpan="2" Text="Here is some text" HorizontalAlignment="Center"  VerticalAlignment="Center"/>
        <TextBlock Grid.ColumnSpan="2" Grid.Row="2" Text="Here is even more text" HorizontalAlignment="Center"  VerticalAlignment="Center"/>
    </Grid>
</Window>

看起来像这样：

【讨论】：

【解决方案2】：

可以使用Background 属性为整个Grid 设置Background 颜色：

<Grid Background="Red" />

或者，如果您想为单个单元格设置它，您需要将一个元素添加到设置了 Background 属性的单元格。

对于Borders，Grid 只包含ShowGridLines 属性，可用于显示无法设置样式的细虚线。

每个 MSDN：

只有虚线可用，因为此属性旨在作为设计工具来调试布局问题，并不打算用于生产质量代码。如果您想要网格内的线条，请设置样式 Grid 中的元素具有边框。

因此，为了给网格添加边框，您必须将 Border 元素或包含 Border 的控件添加到网格单元格，并对这些元素设置样式。

但是还有一个选择。 This blog post 概述了如何扩展 Grid 类以创建具有 Grid 行属性的自定义 Grid。当我想渲染网格线但不想用对象填充每个单元格时，我使用了它successfully in the past。

<my:CustomGrid ShowCustomGridLines="True"
               GridLineBrush="Blue"
               GridLineThickness="1">

【讨论】：