Question

目前我正在分别设置每个网格行的背景：

<Grid>
    <Grid.RowDefinitions><RowDefinition /><RowDefinition /></Grid.RowDefinitions>
    <Grid.ColumnDefinitions><ColumnDefinition /><ColumnDefinition /><ColumnDefinition /><ColumnDefinition /><ColumnDefinition /><ColumnDefinition /></Grid.ColumnDefinitions>

    <Border Grid.Row="0" Grid.Column="0" Grid.ColumnSpan="6" Height="24" BorderBrush="#FF252A30" CornerRadius="10" BorderThickness="1">
        <Border.Background>
            <LinearGradientBrush EndPoint="1.036,0.367" StartPoint="-0.194,0.362">
                <GradientStop Color="#AAE098" Offset="0.1"/>
                <GradientStop Color="#D5E9D4" Offset="0.9"/>
            </LinearGradientBrush>
        </Border.Background>
    </Border>

    <Border Grid.Row="1" Grid.Column="0" Grid.ColumnSpan="6" Height="24" BorderBrush="#FF252A30" CornerRadius="10" BorderThickness="1">
        <Border.Background>
            <LinearGradientBrush EndPoint="1.036,0.367" StartPoint="-0.194,0.362">
                <GradientStop Color="#AAE098" Offset="0.1"/>
                <GradientStop Color="#D5E9D4" Offset="0.9"/>
            </LinearGradientBrush>
        </Border.Background>
    </Border>
</Grid>

肯定必须有一些方法为所有行设置此边框一次。怎么做的？

谢谢！

Answer 1

或者你可以使用我刚制作的这个网格。它会自动为网格中的每个单元格添加边框。这是结果：

enter image description here

C＃：

using System.Windows;
using System.Windows.Controls;
using System.Windows.Media;

namespace GridWithBorder
{
   public class BorderGrid : Grid
   {
       protected override void OnRender(DrawingContext dc)
       {
           double leftOffset = 0;
           double topOffset = 0;
           Pen pen = new Pen(Brushes.Black, 3);
           pen.Freeze();

           foreach (RowDefinition row in this.RowDefinitions)
           {
               dc.DrawLine(pen, new Point(0, topOffset), new Point(this.ActualWidth, topOffset));
               topOffset += row.ActualHeight;
           }
            // draw last line at the bottom
        dc.DrawLine(pen, new Point(0, topOffset), new Point(this.ActualWidth, topOffset));

           //foreach (ColumnDefinition column in this.ColumnDefinitions)
           //{
           //   dc.DrawLine(pen, new Point(leftOffset, 0), new Point(leftOffset, this.ActualHeight));
           //   leftOffset += column.ActualWidth;
           //}
           // draw last line on the right
           //dc.DrawLine(pen, new Point(leftOffset, 0), new Point(leftOffset, this.ActualHeight));

           base.OnRender(dc);
       }
   }
}

XAML：

<Window x:Class="GridWithBorder.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:local="clr-namespace:GridWithBorder"
        Title="MainWindow" Height="350" Width="525">
    <local:BorderGrid>
        <local:BorderGrid.RowDefinitions>
            <RowDefinition />
            <RowDefinition />
            <RowDefinition />
        </local:BorderGrid.RowDefinitions>
        <local:BorderGrid.ColumnDefinitions>
            <ColumnDefinition />
            <ColumnDefinition />
            <ColumnDefinition />
            <ColumnDefinition />
        </local:BorderGrid.ColumnDefinitions>
        <Rectangle Grid.Row="0" Grid.Column="0" Fill="Red" Margin="5" />
        <Rectangle Grid.Row="0" Grid.Column="1" Fill="Blue" Margin="5" />
        <Rectangle Grid.Row="0" Grid.Column="2" Fill="Orange" Margin="5" />
        <Rectangle Grid.Row="0" Grid.Column="3" Fill="Red" Margin="5" />
        <Rectangle Grid.Row="1" Grid.Column="0" Fill="Yellow" Margin="5" />
        <Rectangle Grid.Row="1" Grid.Column="1" Fill="Green" Margin="5" />
        <Rectangle Grid.Row="1" Grid.Column="2" Fill="Purple" Margin="5" />
        <Rectangle Grid.Row="1" Grid.Column="3" Fill="Green" Margin="5" />
        <Rectangle Grid.Row="2" Grid.Column="0" Fill="Orange" Margin="5" />
        <Rectangle Grid.Row="2" Grid.Column="1" Fill="Red" Margin="5" />
        <Rectangle Grid.Row="2" Grid.Column="2" Fill="Blue" Margin="5" />
        <Rectangle Grid.Row="2" Grid.Column="3" Fill="Red" Margin="5" />
    </local:BorderGrid>
</Window>

Answer 2

您可以将该边框拉入可重用资源，但我怀疑您真正要做的是创建GridView。

Answer 3

您只需在Background上设置Grid媒体资源即可。如果要应用于不同行的边框之间存在共性，则可以创建默认样式（如果需要，可以将此样式的范围限制为Grid本身）：

<强> XAML

<Grid>
    <Grid.Resources>
        <Style TargetType="{x:Type Border}">
            <!-- All rows -->
            <Setter Property="BorderBrush" Value="Black" />
            <Setter Property="BorderThickness" Value="2" />
            <Setter Property="CornerRadius" Value="5" />
        </Style>
    </Grid.Resources>

    <Grid.RowDefinitions>
        <RowDefinition />
        <RowDefinition />
        <RowDefinition />
    </Grid.RowDefinitions>

    <Border Grid.Row="0">
        <TextBlock Text="This row has a black border (default)." />
    </Border>

    <Border BorderBrush="Red" Grid.Row="1">
        <TextBlock Text="This row has a red border." />
    </Border>

    <Border BorderBrush="Green" BorderThickness="4" Grid.Row="2">
        <TextBlock Text="This has a thick green border." />
    </Border>

</Grid>

使用默认Style时，不需要在行Border上设置其他属性以实现默认外观（上面的第一行）。如果某一行需要调整外观，那么只需在Border上提供其他属性即可覆盖默认Style中设置的属性（上面的第二行和第三行）。如果您在应用程序中的多个视图中应用此技术，则可以将此样式提取到单独的ResourceDictionary中，并在适当的位置简单地合并。

希望这有帮助！

为每个网格行分配边框

3 个答案: