Как установить границу строки и цвет фона в WPF Grid

Ответ 1

Цвет Background можно просто установить для всего Grid с помощью свойства Background:

<Grid Background="Red" />

Или, если вы хотите, чтобы он был установлен для отдельных ячеек, вам нужно добавить элемент в ячейку, у которой есть свой набор свойств Background.

Что касается Borders, a Grid содержит только свойство ShowGridLines, которое может использоваться для отображения тонких точечных строк, которые нельзя стилизовать.

В MSDN:

Доступны только пунктирные линии, поскольку это свойство предназначено как инструмент проектирования для отладки макетов и не предназначен для использования в качество продукции код. Если вам нужны строки внутри сетки, элементы внутри сетки имеют границы.

Итак, чтобы добавить границы к вашей Grid, вам нужно добавить элементы Border или элементы управления, которые содержат Border в ячейки Grid, и создать эти элементы.

Но есть альтернатива. Это сообщение в блоге описывает, как вы можете расширить класс Grid, чтобы создать настраиваемую сетку, которая имеет свойства для строк Grid. Я использовал его успешно в прошлом, когда я хотел отображать линии сетки, но не хотел заполнять каждую ячейку объектом.

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

Ответ 2

Вот немного взлома, который, кажется, работает хорошо. Если вы поместите элемент фона в строки/столбцы вместе с элементами, которые вы обычно разместите там, он будет действовать как фон. Вам просто нужно учитывать упорядочение элементов в XAML (элементы появляются при увеличении Z-Order) или соответственно установить 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>

Он выглядит следующим образом:

Ответ 3

это зависит от того, что вы собираетесь делать с этой сеткой, но я предполагаю, что вы хотите заполнить ячейки Grid элементами управления.

Вам нужно будет установить свойства Background и границы (Stroke) на элементах управления или сначала инкапсулировать каждый из ваших элементов управления на границе.

Но, конечно, если вам нужен одинаковый цвет фона для каждой ячейки, тогда установите фон Grid.:)

Надеюсь, я хорошо ответил.