Datagrid Styling

Posted 14 years ago by Niclas Lindblom

A follow on to my previous thread, but thought it would be better to start a new one.

I have managed to center the content in the Grid based on answers here. I now want to change the colour of the selected row. I have the following XAML

  <Style x:Key="CenterCellStyle" TargetType="{x:Type toolkit:DataGridCell}"  BasedOn="{StaticResource {x:Static themes:DataGridCommonDictionary.DataGridCellStyleKey}}" >
            <Setter Property="HorizontalContentAlignment" Value="Center" />
            <Style.Triggers>
                <Trigger   Property="toolkit:DataGridCell.IsSelected" Value="True">
                    <Setter Property="Background" Value="Gray" />
                </Trigger>
            </Style.Triggers>
        </Style>

However, the Background change does not take effect this this. If I remove the BasedOn statement in the Style declaration, the Background change works but I then loose the Centering of the content.

Any ideas on what the solution to this is ?

Thanks

Niclas

Comments (4)

Posted 14 years ago by Actipro Software Support - Cleveland, OH, USA

Hi Niclas,

The selected look is applied by the control Template of the DataGridCell. So your Style trigger is being shortcircuited (i.e. when the cell is selected, the DataGridCell.Background property is not used). The brushes used by our theme can be easily customized though, using our ComponentResourceKeys.

Specifically, you'd want to define a brush in your resources that uses CellBackgroundSelectedBrushKey, CellBorderSelectedBrushKey, or CellForegroundSelectedBrushKey from DataGridCommonDictionary. Something like:

xmlns:themes="http://schemas.actiprosoftware.com/winfx/xaml/themes"
...
<Window.Resources>

    <SolidColorBrush x:Key="{x:Static themes:DataGridCommonDictionary.CellBackgroundSelectedBrushKey}" Color="Gray" />
    
</Window.Resources>

Actipro Software Support

Posted 14 years ago by Niclas Lindblom

Apologies, but my WPF skills are not what the should be..How do I apply the SolidColorBrush to the Grid ? If you could complete the sampe it would be much appreciated. This is what I got now


  <UserControl.Resources>
        <SolidColorBrush x:Key="{x:Static themes:DataGridCommonDictionary.CellBackgroundSelectedBrushKey}" Color="Gray" />

        <Style x:Key="CenterCellStyle" TargetType="{x:Type toolkit:DataGridCell}"  BasedOn="{StaticResource {x:Static themes:DataGridCommonDictionary.DataGridCellStyleKey}}" >
            <Setter Property="HorizontalContentAlignment" Value="Center" />
        </Style>
    </UserControl.Resources>


<datagrid:ThemedDataGrid Name="grd1" themes:ThemeManager.Theme="Office2010Black"  HorizontalScrollBarVisibility="Hidden"  IsReadOnly="True"  Width="600" VerticalContentAlignment="Center" AutoGenerateColumns="False"  CanUserReorderColumns="False" CanUserResizeColumns="False" CanUserResizeRows="False" GridLinesVisibility="Horizontal" RowHeaderWidth="14" SelectionMode="Single" HeadersVisibility="Column" AreRowDetailsFrozen="False" EnableRowVirtualization="False" CanUserSortColumns="False" AlternationCount="1" AllowDrop="False" Background="White" AlternatingRowBackground="White">
          
                
            <datagrid:ThemedDataGrid.Columns>

                <toolkit:DataGridTextColumn Header="Name" Binding="{Binding Name}" Width="200"  />
                <toolkit:DataGridTextColumn Header="Gender" Binding="{Binding GenderName}" Width="85" />
                <toolkit:DataGridTextColumn Header="DoB" Binding="{Binding DOB, StringFormat={}\{0:dd/MM/yyyy\}}" Width="85" CellStyle="{StaticResource CenterCellStyle}" />
                <toolkit:DataGridTextColumn Header="Age" Binding="{Binding Age}" Width="85" CellStyle="{StaticResource CenterCellStyle}"/>
                <toolkit:DataGridTextColumn Header="Status" Binding="{Binding StatusName}" Width="65" />
                <toolkit:DataGridTextColumn Header="Reg ID" Binding="{Binding RegID}" Width="*" />

            </datagrid:ThemedDataGrid.Columns>
              
        </datagrid:ThemedDataGrid>

Posted 14 years ago by Niclas Lindblom

Got it (trial & error method)


 <datagrid:ThemedDataGrid.Resources>
                <SolidColorBrush x:Key="{x:Static themes:DataGridCommonDictionary.CellBackgroundSelectedBrushKey}" Color="Gray" />
            </datagrid:ThemedDataGrid.Resources>

All works now

Thanks

Posted 14 years ago by Actipro Software Support - Cleveland, OH, USA

Hi Niclas,

Yup, you got it. You should be able to put that brush in the Resources of your Window or Application also, if you want it applied to more than one instance of ThemedDataGrid.

Actipro Software Support

The latest build of this product (v24.1.2) was released 2 days ago, which was after the last post in this thread.

Comments (4)

Add Comment