Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to Apply a Cell Style to DataGrid Cell

I have the following DataGrid

<DataGrid x:Name="cultureDataGrid" 
          Grid.Row="1" 
          CellStyle="{StaticResource DataGridCell}"
          ItemsSource="{Binding Cultures, 
                                NotifyOnSourceUpdated=True, 
                                UpdateSourceTrigger=PropertyChanged, 
                                Mode=TwoWay, 
                                IsAsync=True}" 
          Style="{x:Null}" >
    <DataGrid.Columns>
        <DataGridTextColumn Header="Code" Binding="{Binding Code}" IsReadOnly="True"/>
        <DataGridTextColumn Header="Language" Binding="{Binding Language}" IsReadOnly="True"/>
        <DataGridTextColumn Header="LocalName" Binding="{Binding LocalName}" IsReadOnly="True"/>
    </DataGrid.Columns>
</DataGrid>

I have the following cell style to change the selected Backcolor

<Style TargetType="DataGridCell" BasedOn="{StaticResource {x:Type DataGridCell}}">
    <Setter Property="Background" Value="White"/>
    <Setter Property="VerticalContentAlignment" Value="Center"/>
    <Style.Triggers>
        <Trigger Property="IsSelected" Value="True">
            <Setter Property="Background" Value="Red"/>
            <Setter Property="Foreground" Value="White"/>
        </Trigger>
    </Style.Triggers>
</Style>

I have tried applying the CellStyle="{StaticResource DataGridCell}" as shown above, and using DynamicResource but the resource is failing to be resolved. I have imported the correct resource dictionary as other styles are working What am I doing wrong here?

Thanks for your time.

like image 331
MoonKnight Avatar asked Sep 04 '13 20:09

MoonKnight


2 Answers

Since your Style has no Key you do not have to set CellStyle on the DataGrid, it will be applied to all DataGridCell by default.

If you dont want it applied to all DataGridCell by default give the style an x:Key and set the CellStyle on the DataGrid

Example:

<Style x:Key="MyDataGridCell" TargetType="DataGridCell" BasedOn="{StaticResource {x:Type DataGridCell}}">
    <Setter Property="Background" Value="White"/>
    <Setter Property="VerticalContentAlignment" Value="Center"/>
    <Style.Triggers>
        <Trigger Property="IsSelected" Value="True">
            <Setter Property="Background" Value="Red"/>
            <Setter Property="Foreground" Value="White"/>
        </Trigger>
    </Style.Triggers>
</Style>

<DataGrid CellStyle="{StaticResource MyDataGridCell}" />
like image 64
sa_ddam213 Avatar answered Sep 23 '22 20:09

sa_ddam213


To apply the style to only some DataGridRow :

Create your DataGridCell style :

< !-- DataGridCell Style-->
< Style x:Key="MyDataGridCellStyle" TargetType="{x:Type DataGridCell}">
    <Setter Property="Background" Value="White"/>
    <Setter Property="VerticalContentAlignment" Value="Center"/>
    <Style.Triggers>
        <Trigger Property="IsSelected" Value="True">
            <Setter Property="Background" Value="Red"/>
            <Setter Property="Foreground" Value="White"/>
        </Trigger>
    </Style.Triggers>
</Style>

Use it in the column you want

< !-- DataGrid -->
<DataGrid >
    <DataGrid.Columns>
        <DataGridComboBoxColumn CellStyle="{StaticResource MyDataGridCellStyle}" />
        <DataGridTextColumn CellStyle="{StaticResource MyDataGridCellStyle}" />
    </DataGrid.Columns>
</DataGrid>
like image 39
Mr Rubix Avatar answered Sep 22 '22 20:09

Mr Rubix