when we select a row in datagrid the entire row will be highlighted along the the cell we clicked on getting a different background. when our datagrid is readonly we may not want this special treatment for the current cell. we could style the cell to remove this highlight. Here is the image of the selectedrow before and after applying the style
<Style x:Key=”dgc” TargetType=”data:DataGridCell”>
<Setter Property=”Background” Value=”Transparent” />
<Setter Property=”HorizontalContentAlignment” Value=”Stretch” />
<Setter Property=”VerticalContentAlignment” Value=”Stretch” />
<Setter Property=”Cursor” Value=”Arrow” />
<Setter Property=”IsTabStop” Value=”False” />
<Setter Property=”Template”>
<Setter.Value>
<ControlTemplate TargetType=”data:DataGridCell”>
<Grid Name=”Root” Background=”{TemplateBinding Background}”>
<vsm:VisualStateManager.VisualStateGroups>
<vsm:VisualStateGroup x:Name=”CurrentStates”>
<vsm:VisualState x:Name=”Regular” />
<vsm:VisualState x:Name=”Current”>
<Storyboard>
<DoubleAnimation Storyboard.TargetName=”FocusVisual” Storyboard.TargetProperty=”Opacity” To=”1″ Duration=”0″ />
</Storyboard>
</vsm:VisualState>
</vsm:VisualStateGroup>
<vsm:VisualStateGroup x:Name=”ValidationStates”>
<vsm:VisualStateGroup.Transitions>
<vsm:VisualTransition GeneratedDuration=”00:00:0.1″/>
</vsm:VisualStateGroup.Transitions>
<vsm:VisualState x:Name=”Valid”/>
<vsm:VisualState x:Name=”Invalid”>
<Storyboard>
<DoubleAnimation Storyboard.TargetName=”InvalidVisualElement” Storyboard.TargetProperty=”Opacity” Duration=”0″ To=”1″/>
<ColorAnimation Storyboard.TargetName=”FocusVisual” Storyboard.TargetProperty=”(Fill).Color” Duration=”0″ To=”#FFFFFFFF”/>
</Storyboard>
</vsm:VisualState>
</vsm:VisualStateGroup>
</vsm:VisualStateManager.VisualStateGroups>
<Grid.ColumnDefinitions>
<ColumnDefinition />
<ColumnDefinition Width=”Auto” />
</Grid.ColumnDefinitions>
<Rectangle Name=”FocusVisual” Stroke=”#FF6DBDD1″ StrokeThickness=”1″ Fill=”#66FFFFFF” HorizontalAlignment=”Stretch”
VerticalAlignment=”Stretch” IsHitTestVisible=”false” Opacity=”0″ />
<ContentPresenter
Content=”{TemplateBinding Content}”
ContentTemplate=”{TemplateBinding ContentTemplate}”
Cursor=”{TemplateBinding Cursor}”
HorizontalAlignment=”{TemplateBinding HorizontalContentAlignment}”
VerticalAlignment=”{TemplateBinding VerticalContentAlignment}”
Margin=”{TemplateBinding Padding}” />
<Rectangle x:Name=”InvalidVisualElement” IsHitTestVisible=”False” StrokeThickness=”1″ Stroke=”#FFDC000C” HorizontalAlignment=”Stretch” VerticalAlignment=”Stretch” Opacity=”0″/>
<Rectangle Name=”RightGridLine” Grid.Column=”1″ VerticalAlignment=”Stretch” Width=”1″ />
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
The only change we need to make is to delete the storyboard from the default style. The style is applied like this
<data:DataGrid Margin=”10″ Width=”200″ x:Name=”datagrid2″ CellStyle=”{StaticResource dgc}” ></data:DataGrid>
Hello All
I like Your blog. It is interesting. Do You have RSS so I can add to my favorites.
Let me know when it will be ready. Kee it UP.
best regards Szczecin Hotele
sure
HI, i am new to WPF. I search on your blog to solve my problem, however, i do not know how to get the correct vsm name space which prevent me use visualstatemanager. i was trying to use the name space on WPFtoolkit but it still does not working.
Can you give me some hint? Thank you.
I did not run the sample, but this might help
http://torinth.spaces.live.com/Blog/cns!DD5A60A80E18EE33!199.entry
How do you select the row programmatically?
Hi,
you could set the selecteditem of the Datagrid, witht he item you want to select.