wpf - wpf グリッド線 - スタイルの変更

Question

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

Answer 1

それはあなたが目指している外観によって異なります。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>

これにより、次のようなグリッドが得られます。

グリッドの各セルで Rectangle を使用して、さまざまな効果を得ることができます。ここでは、塗りが透明で線が青です。

<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>

それはこれを生成します：

または、Rectangle を塗りつぶし、Stroke を指定しないこともできます。

    <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>

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

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