Hilighting entire row in datagrid

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>

Advertisements

Resizing Childwindow

Resizing of the childwindows is not supported in silverlight 3 beta which might be possible in the RTM version, but until then here is one way we can style it and get the resizing to work

I took the style of the ChildWindow and added  a Canvas in the style and added 4 thumbs one on each side of the window. Their size is .5px. so  they dont change the look of the childwindow. when you mouse over near the borders you can see the visual cue from the cursors,  The dragDelta event is handled to resize the window.

we can follow the same logic to get the resize behavior to work with Floatable window

you can see a sample here and download the code here