web-dev-qa-db-ja.com

wpf gridlines-スタイルの変更

Wpfグリッドのグリッド線のスタイルを変更する方法はありますか？グリッドを4つのセルに分割する必要があります。そのために、RowDefinitionsとColumnDefinitionsを使用しました。ただし、ユーザーはどのセルがどのセルであるかを区別する必要があるため、グリッド線の色を変更する必要があります。

wpfgridgridlines
30
wpfnewbie

目的の外観によって異なります。 WPFには、ほとんど何でも行うさまざまな方法があります。簡単なものをいくつか紹介します。

最も簡単な方法は、ShowGridlines = "True"を設定することです。

    <Grid HorizontalAlignment="Stretch" 
          VerticalAlignment="Stretch" 
          Margin="5"
          ShowGridLines="True">
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*" />
            <ColumnDefinition Width="*" />
        </Grid.ColumnDefinitions>

        <Grid.RowDefinitions>
            <RowDefinition Height="*" />
            <RowDefinition Height="*" />
        </Grid.RowDefinitions>

        <TextBlock Grid.Column="0" 
                   Grid.Row="0"
                   Text="(0,0)" />
        <TextBlock Grid.Column="1" 
                   Grid.Row="0"
                   Text="(1,0)" />
        <TextBlock Grid.Column="0" 
                   Grid.Row="1"
                   Text="(0,1)" />
        <TextBlock Grid.Column="1" 
                   Grid.Row="1"
                   Text="(1,0)" />
    </Grid>

次のようなグリッドが得られます。
alt text

グリッドの各セルで四角形を使用して、さまざまな効果を得ることができます。ここでは、塗りは透明で、ストロークは青です。

<Grid HorizontalAlignment="Stretch" 
      VerticalAlignment="Stretch" 
      Margin="5">
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*" />
        <ColumnDefinition Width="*" />
    </Grid.ColumnDefinitions>

    <Grid.RowDefinitions>
        <RowDefinition Height="*" />
        <RowDefinition Height="*" />
    </Grid.RowDefinitions>

    <Rectangle Grid.Column="0"
               Grid.Row="0"  
               Stroke="Blue"
               Fill="Transparent" />
    <TextBlock Grid.Column="0" 
               Grid.Row="0"
               Text="(0,0)" />
    <Rectangle Grid.Column="1"
               Grid.Row="0"  
               Stroke="Blue"
               Fill="Transparent" />
    <TextBlock Grid.Column="1" 
               Grid.Row="0"
               Text="(1,0)" />
    <Rectangle Grid.Column="0"
               Grid.Row="1"  
               Stroke="Blue"
               Fill="Transparent" />
    <TextBlock Grid.Column="0" 
               Grid.Row="1"
               Text="(0,1)" />
    <Rectangle Grid.Column="1"
               Grid.Row="1"  
               Stroke="Blue"
               Fill="Transparent" />
    <TextBlock Grid.Column="1" 
               Grid.Row="1"
               Text="(1,0)" />
</Grid>

これはこれを生成します：
alt text

または、長方形を塗りつぶしてストロークを与えないこともできます。

    <Grid HorizontalAlignment="Stretch" 
          VerticalAlignment="Stretch" 
          Margin="5">
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*" />
            <ColumnDefinition Width="*" />
        </Grid.ColumnDefinitions>

        <Grid.RowDefinitions>
            <RowDefinition Height="*" />
            <RowDefinition Height="*" />
        </Grid.RowDefinitions>

        <Rectangle Grid.Column="0"
                   Grid.Row="0"  
                   Fill="LightBlue" />
        <TextBlock Grid.Column="0" 
                   Grid.Row="0"
                   Text="(0,0)" />
        <Rectangle Grid.Column="1"
                   Grid.Row="0"  
                   Fill="LightYellow" />
        <TextBlock Grid.Column="1" 
                   Grid.Row="0"
                   Text="(1,0)" />
        <Rectangle Grid.Column="0"
                   Grid.Row="1"  
                   Fill="LightYellow" />
        <TextBlock Grid.Column="0" 
                   Grid.Row="1"
                   Text="(0,1)" />
        <Rectangle Grid.Column="1"
                   Grid.Row="1"  
                   Fill="LightBlue" />
        <TextBlock Grid.Column="1" 
                   Grid.Row="1"
                   Text="(1,0)" />
    </Grid>

たとえば、チェッカーボードパターンを与えることができます。
alt text

これは決して包括的な答えではありません-あなたはおそらく本を埋めることができます。それは、あなたが求めていることを行うための多くの方法があり、それがあなたが必要とするすべてである場合、いくつかの非常に迅速かつ簡単な解決策があることを示すためだけでした。

85
Wonko the Sane