wpf - WPFグリッドで行の境界線と背景色を設定する方法

Question

WPFグリッドコントロールで境界線と背景色を設定するにはどうすればよいですか？
行と列を動的に作成してからグリッドに追加し
ていますが、コードビハインドから色と境界線を設定できますか？

Answer 1

これはうまくいくように見えるちょっとしたハックです。通常そこに配置する要素と一緒に行/列に背景要素を配置すると、背景として機能します。XAML内の要素の順序（要素はZオーダーの増加で表示されます）を気にするか、それに応じて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>

次のようになります。

Answer 2

プロパティを使用して、全体のBackground色を設定できます。GridBackground

<Grid Background="Red" />

Backgroundまたは、個々のセルに設定する場合は、プロパティが設定されている要素をセルに追加する必要があります。

Bordersに関しては、スタイル設定できない細い点線を表示するために使用できるプロパティGridのみが含まれています。ShowGridLines

MSDNによる：

このプロパティはレイアウトの問題をデバッグするための設計ツールとして意図されており、本番品質のコードでの使用を意図していないため、点線のみが使用可能です。グリッド内に線が必要な場合は、グリッド内の要素に境界線を付けるようにスタイルを設定します。

したがって、グリッドに境界線を追加するにBorderは、を含む要素またはコントロールをBorderグリッドセルに追加し、それらの要素のスタイルを設定する必要があります。

しかし、別の方法があります。このブログ投稿では、Gridクラスを拡張して、Grid線のプロパティを持つカスタムグリッドを作成する方法の概要を説明しています。過去にグリッド線をレンダリングしたいが、すべてのセルをオブジェクトで埋めたくなかったときに、これをうまく使用しました。

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