设置 WPF 布局网格背景（每个单元格、行、列）的样式

Question

我想知道是否有任何方法可以设置 WPF 布局网格的单元格、行和列的样式。 我一直在尝试寻找任何信息，但我发现的少数提及内容并没有那么丰富。

我想将网格样式设置为看起来像链接的屏幕截图中的网格。

如果实际控件不支持它，我可以以某种方式继承它并执行吗？ 我对 WPF 还很陌生，因此非常感谢任何帮助。

另一件事，我知道我可以对网格中的每个控件进行样式设置，但这似乎有点矫枉过正。 我想要一个可以自己完成的网格。

截图http://img21.imageshack.us/img21/2842/capturehz8.png

Answer 1

@Dan 推荐我目前正在阅读的 WPF Unleashed。 就在今天早上，我看到了一个解决您问题的部分。

第 6 章，第 161 页：

常见问题解答：如何为网格单元格提供背景颜色、填充和边框，就像为 HTML 表格单元格提供的那样？

没有内在机制可以赋予网格单元这样的属性，但是由于多个元素可以出现在任何网格单元中，因此您可以很容易地模拟它们。 要给单元格设置背景颜色，您只需放入一个带有适当填充的矩形，默认情况下它会拉伸以填充单元格。 要提供单元格填充，您可以使用自动调整大小并在适当的子元素上设置边距。 对于边框，您可以再次使用 Rectangle，但为其指定适当颜色的显式 Stroke，或者您也可以简单地使用 Border 元素。

只需确保在任何其他子项之前将此类矩形或边框添加到网格（或使用 ZIndex 附加属性显式标记它们），以便它们的 Z 顺序将它们置于主要内容后面。

顺便说一句，WPF 释放了岩石。 它写得很好，全彩印刷使其更易于阅读。

Answer 2

这是一个快速（非常粗略的示例），您可以修改它以获得您想要的格式（如果您认真使用 WPF，您会发现 Blend 对使您的布局看起来不错有很大帮助）：

<Page xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"                                                                                                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
       <Page.Resources>
           <Style x:Key="CustomerDefinition" TargetType="TextBlock">
               <Setter Property="Control.FontFamily" Value="Tahoma"/>
               <Setter Property="Control.FontSize" Value="12"/>
               <Setter Property="Control.Foreground" Value="Red"/>
           </Style>
           <Style TargetType="{x:Type Label}">
               <Setter Property="Width" Value="100"/>
           </Style>
           <Style x:Key="{x:Type TextBox}" TargetType="{x:Type TextBox}">
               <Setter Property="SnapsToDevicePixels" Value="True"/>
               <Setter Property="OverridesDefaultStyle" Value="True"/>
               <Setter Property="KeyboardNavigation.TabNavigation" Value="None"/>
               <Setter Property="FocusVisualStyle" Value="{x:Null}"/>
               <Setter Property="MinWidth" Value="120"/>
               <Setter Property="MinHeight" Value="20"/>
               <Setter Property="AllowDrop" Value="true"/>
               <Setter Property="Width" Value="200"/>
               <Setter Property="Template">
                   <Setter.Value>
                       <ControlTemplate TargetType="{x:Type TextBoxBase}">
                           <Border
                               Name="Border"
                               Background="#FFEBE9E9"
                               BorderBrush="#FF8B8787"
                               BorderThickness="1"
                               CornerRadius="2"
                               Padding="3">
                               <ScrollViewer x:Name="PART_ContentHost" Margin="0"/>
                           </Border>
                           <ControlTemplate.Triggers>
                               <Trigger Property="IsEnabled" Value="False">
                                   <Setter TargetName="Border" Property="Background"
                                                       Value="#EEEEEE"/>
                                   <Setter TargetName="Border" Property="BorderBrush"
                                                       Value="#EEEEEE"/>
                                   <Setter Property="Foreground" Value="#888888"/>
                               </Trigger>
                           </ControlTemplate.Triggers>
                       </ControlTemplate>
                   </Setter.Value>
               </Setter>
           </Style>
           <LinearGradientBrush x:Key="NormalBrush" StartPoint="0,0" EndPoint="0,1">
               <GradientBrush.GradientStops>
                   <GradientStopCollection>
                       <GradientStop Offset="0.0" Color="#FFF0EDED"/>
                       <GradientStop Offset="1.0" Color="#FFE1E0E0"/>
                   </GradientStopCollection>
               </GradientBrush.GradientStops>
           </LinearGradientBrush>
       </Page.Resources>
       <Grid>
           <Grid.ColumnDefinitions>
               <ColumnDefinition Width="*"/>
               <ColumnDefinition Width="*"/>
           </Grid.ColumnDefinitions>
           <Grid.RowDefinitions>
               <RowDefinition Height="26"/>
               <RowDefinition Height="23"/>
               <RowDefinition Height="24"/>
               <RowDefinition Height="24"/>
               <RowDefinition Height="24"/>
           </Grid.RowDefinitions>
           <TextBlock
               Grid.ColumnSpan="2"
               Grid.Row="0"
               Style="{StaticResource CustomerDefinition}"
               Text="Customer Definition"/>
           <Border
               Grid.Column="0"
               Grid.Row="1"
               Background="#FFEBE9E9"
               BorderBrush="#FF8B8787"
               BorderThickness="1">
               <StackPanel Background="{StaticResource NormalBrush}" Orientation="Horizontal">
                   <Label Content="Customer Code"/>
                   <TextBox Text="SMITHA 098 (normally I'd bind here)"/>
               </StackPanel>
           </Border>
           <Border
               Grid.Column="1"
               Grid.Row="1"
               Background="#FFEBE9E9"
               BorderBrush="#FF8B8787"
               BorderThickness="1">
               <StackPanel Background="{StaticResource NormalBrush}" Orientation="Horizontal">
                   <Label Content="Customer Type"/>
                   <TextBox Text="PRIVATE INDIVIDUAL"/>
               </StackPanel>
           </Border>
       </Grid> </Page>

Answer 3

WPF Grid 本身没有可见单元格。 将它们视为不可见的网格线，您可以将子元素对齐。

因此，要设置网格单元格的样式，您必须设置网格内对齐的项目的样式。

将 Grid 视为类似于 WinForms DataGrid 的东西会令人困惑。 我猜想它最接近的 WinForms 等效项是 TableLayout 控件。

查看一些第 3 方网格控件。 我在 DevExpress 处于测试阶段时使用过它，发现它非常简单。

Answer 4

我建议您使用边框来设计样式。

您可以通过为每行和每列创建边框并相应地设置行跨度和列跨度来非常轻松地重新创建该布局。

您将有 5 个 colspan 2 的边框，这些边框将处理每行的渐变背景以及每行顶部和底部的边框。 然后你将有 2 个行距为 5 的边框，它们将处理列边框。 想象一下，您正在叠加边框以形成您想要的视觉网格效果。

对于标题和外边框，只需根据需要用边框和样式包裹整个网格即可。

我建议将您的样式存储为资源，以便您可以将所有样式信息保存在一个位置。

请注意学习样式的工作原理，因为它非常强大，但有一个学习曲线，因为它与 CSS 的工作方式完全不同。 如果可以的话，我建议您阅读 WPF Unleashed。

Answer 5

我在寻找为 DataGrid 单元格设置边距（或填充）的方法时发现了这篇文章。 我的问题得到了解决，感谢发布在（接近尾声）的示例 xaml 代码——非常简约。

http://forums.silverlight.net/forums/p/16842/55997。 ASPX