Стилирование фона сетки WPF (каждой ячейки, строки, столбца)

Ответ 1

Вот быстрый (очень грубый пример), который вы могли бы взломать, чтобы получить желаемый формат (если вы серьезно относитесь к работе с WPF, вы найдете Blend огромную помощь в том, чтобы ваши макеты выглядели хорошо):

<Page xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"                                                                                                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
       <Page.Resources>
           <Style x:Key="CustomerDefinition" TargetType="TextBlock">
               <Setter Property="Control.FontFamily" Value="Tahoma"/>
               <Setter Property="Control.FontSize" Value="12"/>
               <Setter Property="Control.Foreground" Value="Red"/>
           </Style>
           <Style TargetType="{x:Type Label}">
               <Setter Property="Width" Value="100"/>
           </Style>
           <Style x:Key="{x:Type TextBox}" TargetType="{x:Type TextBox}">
               <Setter Property="SnapsToDevicePixels" Value="True"/>
               <Setter Property="OverridesDefaultStyle" Value="True"/>
               <Setter Property="KeyboardNavigation.TabNavigation" Value="None"/>
               <Setter Property="FocusVisualStyle" Value="{x:Null}"/>
               <Setter Property="MinWidth" Value="120"/>
               <Setter Property="MinHeight" Value="20"/>
               <Setter Property="AllowDrop" Value="true"/>
               <Setter Property="Width" Value="200"/>
               <Setter Property="Template">
                   <Setter.Value>
                       <ControlTemplate TargetType="{x:Type TextBoxBase}">
                           <Border
                               Name="Border"
                               Background="#FFEBE9E9"
                               BorderBrush="#FF8B8787"
                               BorderThickness="1"
                               CornerRadius="2"
                               Padding="3">
                               <ScrollViewer x:Name="PART_ContentHost" Margin="0"/>
                           </Border>
                           <ControlTemplate.Triggers>
                               <Trigger Property="IsEnabled" Value="False">
                                   <Setter TargetName="Border" Property="Background"
                                                       Value="#EEEEEE"/>
                                   <Setter TargetName="Border" Property="BorderBrush"
                                                       Value="#EEEEEE"/>
                                   <Setter Property="Foreground" Value="#888888"/>
                               </Trigger>
                           </ControlTemplate.Triggers>
                       </ControlTemplate>
                   </Setter.Value>
               </Setter>
           </Style>
           <LinearGradientBrush x:Key="NormalBrush" StartPoint="0,0" EndPoint="0,1">
               <GradientBrush.GradientStops>
                   <GradientStopCollection>
                       <GradientStop Offset="0.0" Color="#FFF0EDED"/>
                       <GradientStop Offset="1.0" Color="#FFE1E0E0"/>
                   </GradientStopCollection>
               </GradientBrush.GradientStops>
           </LinearGradientBrush>
       </Page.Resources>
       <Grid>
           <Grid.ColumnDefinitions>
               <ColumnDefinition Width="*"/>
               <ColumnDefinition Width="*"/>
           </Grid.ColumnDefinitions>
           <Grid.RowDefinitions>
               <RowDefinition Height="26"/>
               <RowDefinition Height="23"/>
               <RowDefinition Height="24"/>
               <RowDefinition Height="24"/>
               <RowDefinition Height="24"/>
           </Grid.RowDefinitions>
           <TextBlock
               Grid.ColumnSpan="2"
               Grid.Row="0"
               Style="{StaticResource CustomerDefinition}"
               Text="Customer Definition"/>
           <Border
               Grid.Column="0"
               Grid.Row="1"
               Background="#FFEBE9E9"
               BorderBrush="#FF8B8787"
               BorderThickness="1">
               <StackPanel Background="{StaticResource NormalBrush}" Orientation="Horizontal">
                   <Label Content="Customer Code"/>
                   <TextBox Text="SMITHA 098 (normally I'd bind here)"/>
               </StackPanel>
           </Border>
           <Border
               Grid.Column="1"
               Grid.Row="1"
               Background="#FFEBE9E9"
               BorderBrush="#FF8B8787"
               BorderThickness="1">
               <StackPanel Background="{StaticResource NormalBrush}" Orientation="Horizontal">
                   <Label Content="Customer Type"/>
                   <TextBox Text="PRIVATE INDIVIDUAL"/>
               </StackPanel>
           </Border>
       </Grid> </Page>

Ответ 2

@Dan рекомендует WPF Unleashed, который я сейчас читаю. Только сегодня утром я сталкиваюсь с разделом, который касается вашего вопроса.

Глава 6, Страница 161:

Часто задаваемые вопросы: Как я могу задавать цвета фона, таблицы и границы сетки, как я могу, с ячейками таблицы HTML?

Не существует встроенного механизма для предоставления Grid-клеткам таких свойств, но вы можете имитировать их довольно легко благодаря тому, что в любой ячейке Grid могут появляться несколько элементов. Чтобы дать ячейке фоновый цвет, вы можете просто плюнуть в прямоугольник с соответствующим Fill, который растягивается, чтобы заполнить ячейку по умолчанию. Чтобы дать заполнение ячеек, вы можете использовать автоматическое определение размера и установить маржу в соответствующем дочернем элементе. Для границ вы можете снова использовать Rectangle, но дать ему явный штрих соответствующего цвета или просто использовать элемент Border.

Просто добавьте такие Прямоугольники или Границы в Сетка перед любым из других детей (или явно помечайте их с прикрепленным свойством ZIndex), поэтому их Z-порядок помещает их в основное содержимое.

Btw, WPF Развязанные породы. Его очень хорошо написано, и печать в полном цвете делает ее еще более легкой для чтения.

Ответ 3

WPF Grid не имеет видимых ячеек как таковых. Подумайте о них как о невидимых сетках, против которых вы можете выровнять дочерние элементы.

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

Сложно думать о Grid как о чем-то вроде WinForms DataGrid. Я думаю, что его ближайшим эквивалентом WinForms является элемент управления TableLayout.

Проверьте некоторые элементы управления сетью сторонних производителей. Я использовал DevExpress один, пока он был в бета-версии, и нашел это довольно простым.

Ответ 4

Я бы рекомендовал использовать границы для вашего стиля.

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

У вас будет 5 границ с colspan 2, эти границы позаботятся о ваших градиентных фонах для каждой строки и границ вдоль верхней и нижней части каждой строки. Тогда у вас будет 2 границы с rowspan 5, они будут обрабатывать границы столбцов. Представьте, что вы накладываете границы, чтобы сформировать визуальный эффект сетки, который вы после.

Для заголовка и внешней границы просто привяжите всю сетку к границе и стилю по мере необходимости.

Я бы рекомендовал хранить ваши стили в качестве ресурсов, чтобы вы могли сохранить всю информацию о стилистике в одном месте.

Позаботьтесь о том, как работает стиль, потому что он довольно мощный, но есть кривая обучения, так как она совсем не похожа на способ работы CSS. Я бы рекомендовал читать WPF Unleashed, если вы можете.

Ответ 5

Я нашел этот пост при поиске метода установки поля (или заполнения) для ячеек DataGrid. Моя проблема была решена благодаря примеру кода xaml, размещенному в (ближе к концу) - довольно минималистичным.

http://forums.silverlight.net/forums/p/16842/55997.aspx