web-dev-qa-db-ja.com

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

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

17
Buzz

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

<Grid Background="Red" />

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

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

MSDNごと:

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

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

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

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

うまく機能しているように見えるハックが少しあります。行/列に通常配置する要素と一緒に背景要素を配置すると、背景として機能します。 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>

次のようになります。

enter image description here

34

このグリッドで何をしようとしているかによって異なりますが、グリッドのセルにコントロールを追加することを想定しています。

コントロールのBackgroundプロパティとborder(Stroke)プロパティを設定するか、最初に各コントロールをBorderにカプセル化する必要があります。

ただし、各セルに同じ背景色が必要な場合はもちろん、グリッドの背景を設定します。 :)

よく答えられたと思います。

0
Julien
<Border Grid.Row="12" Grid.Column="0" Grid.ColumnSpan="12" Background="#fff" BorderBrush="Blue" BorderThickness="2"/>
0
Cristian Oana