Hilighting entire row in datagrid

Posted on June 29, 2009. Filed under: Sivlerlight 3 |

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

datagridselectionremoved1
 <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>


Read Full Post | Make a Comment ( 1 so far )

Recently on Lee’s corner...

Resizing Childwindow

Posted on June 22, 2009. Filed under: Sivlerlight 3 |

Interacting with charts-2

Posted on May 27, 2009. Filed under: Sivlerlight 3 |

Comments on blog

Posted on May 27, 2009. Filed under: General |

Flipping Items in Listbox

Posted on May 20, 2009. Filed under: Sivlerlight 3 |

Customizing DataPager

Posted on May 13, 2009. Filed under: Sivlerlight 3 | Tags: |

Slider with Ticks

Posted on April 12, 2009. Filed under: Silverlight, Sivlerlight 3 |

TabControl and vertical Text

Posted on April 6, 2009. Filed under: Sivlerlight 3 |

Styling slider control

Posted on March 26, 2009. Filed under: Sivlerlight 3 |

Using asp.net Membership and profile providers with RIA Services

Posted on March 25, 2009. Filed under: RIA Services, Sivlerlight 3 |

RIA Services – sample

Posted on March 20, 2009. Filed under: RIA Services, Sivlerlight 3 |

Liked it here?
Why not try sites on the blogroll...