So I am not a huge fan of the default templates for the Silverlight Controls but, hey at least we have controls now right?
I wanted to eliminate that bulky cell to the left of each row to allow for my DataGrid’s to be a little more concise. Below you will find a complete Style that will accomplish this. You can copy & paste & use in your Silverlight apps.
<Style x:Key=”GridWithoutRowHeaders” TargetType=”swcd:DataGrid”>
<Setter Property=”RowBackground”>
<Setter.Value><SolidColorBrush Color=”#FFF2F2F2″/></Setter.Value>
</Setter>
<Setter Property=”AlternatingRowBackground”>
<Setter.Value><SolidColorBrush Color=”#FFFFFFFF”/></Setter.Value>
</Setter>
<Setter Property=”Template”>
<Setter.Value>
<ControlTemplate TargetType=”swcd:DataGrid”>
<Border BorderBrush=”#FF000000″ BorderThickness=”1″>
<Border BorderBrush=”#FFFFFFFF” BorderThickness=”1″>
<Border BorderBrush=”#FFA4A4A4″ BorderThickness=”1″>
<Grid Name=”RootElement”>
<Grid.Resources>
<!– Focus related animations –>
<Storyboard x:Name=”Normal State”>
<DoubleAnimation Duration=”0:0:0″ Storyboard.TargetName=”FocusVisualElement” Storyboard.TargetProperty=”Opacity” To=”1″ />
</Storyboard>
<Storyboard x:Name=”Unfocused State”>
<DoubleAnimation Duration=”0:0:0″ Storyboard.TargetName=”FocusVisualElement” Storyboard.TargetProperty=”Opacity” To=”0″ />
</Storyboard>
<ControlTemplate x:Key=”TopLeftHeaderTemplate” TargetType=”swcd:DataGridColumnHeader”>
<Grid Name=”RootElement”>
<Grid.Background>
<LinearGradientBrush StartPoint=”0,0″ EndPoint=”0.28,0.71″>
<GradientStop Color=”#FFF9FAFA” Offset=”0″/>
<GradientStop x:Name=”StopColor2″ Color=”#FFEDF1F4″ Offset=”0.37259″/>
<GradientStop x:Name=”StopColor3″ Color=”#FFE2E8EF” Offset=”0.372881″/>
<GradientStop x:Name=”StopColor4″ Color=”#FFC3C9CD” Offset=”1″/>
</LinearGradientBrush>
</Grid.Background>
<Grid.RowDefinitions>
<RowDefinition Height=”*” />
<RowDefinition Height=”*” />
<RowDefinition Height=”Auto” />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width=”*”/>
<ColumnDefinition Width=”Auto”/>
</Grid.ColumnDefinitions>
<Line Stretch=”Fill” Grid.Column=”1″ Grid.RowSpan=”2″ X1=”0″ X2=”0″ Y1=”0″ Y2=”1″ StrokeThickness=”1″ Stroke=”#FFA4A4A4″ />
<Line Stretch=”Fill” Grid.ColumnSpan=”2″ Grid.Row=”2″ X1=”0″ X2=”1″ Y1=”0″ Y2=”0″ StrokeThickness=”1″ Stroke=”#FFA4A4A4″ />
<!–<Line Stretch=”Fill” Grid.RowSpan=”2″ X1=”0″ X2=”0″ Y1=”0″ Y2=”1″ StrokeThickness=”1″ Stroke=”{TemplateBinding SeparatorBrush}” Visibility=”{TemplateBinding SeparatorVisibility}”/>–>
<Rectangle Stretch=”Fill” Width=”39″ StrokeThickness=”2″ Stroke=”#FFFFFFFF” Grid.RowSpan=”2″/>
<Path Margin=”1,1,1,0″ Stretch=”Fill” Data=”F1 M 547.239,124.863L 430.795,124.863L 430.795,135.106C 447.845,138.848 467.753,140.997 489.017,140.997C 510.281,140.997 530.188,138.848 547.239,135.106L 547.239,124.863 Z “>
<Path.Fill>
<LinearGradientBrush StartPoint=”0.5125,-0.0864589″ EndPoint=”0.5125,1.00202″>
<GradientStop Color=”#B3FFFFFF” Offset=”0″/>
<GradientStop Color=”#3CFFFFFF” Offset=”1″/>
</LinearGradientBrush>
</Path.Fill>
</Path>
</Grid>
</ControlTemplate>
<ControlTemplate x:Key=”TopRightHeaderTemplate” TargetType=”swcd:DataGridColumnHeader”>
<Grid Name=”RootElement”>
<Grid.Background>
<LinearGradientBrush StartPoint=”0,0″ EndPoint=”0.28,0.71″>
<GradientStop Color=”#FFF9FAFA” Offset=”0″/>
<GradientStop x:Name=”StopColor2″ Color=”#FFEDF1F4″ Offset=”0.37259″/>
<GradientStop x:Name=”StopColor3″ Color=”#FFE2E8EF” Offset=”0.372881″/>
<GradientStop x:Name=”StopColor4″ Color=”#FFC3C9CD” Offset=”1″/>
</LinearGradientBrush>
</Grid.Background>
<Grid.RowDefinitions>
<RowDefinition Height=”*” />
<RowDefinition Height=”*” />
<RowDefinition Height=”Auto” />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width=”Auto”/>
<ColumnDefinition Width=”*”/>
</Grid.ColumnDefinitions>
<!–<Line Stretch=”Fill” Grid.RowSpan=”2″ X1=”0″ X2=”0″ Y1=”0″ Y2=”1″ StrokeThickness=”1″ Stroke=”{TemplateBinding SeparatorBrush}” Visibility=”{TemplateBinding SeparatorVisibility}”/>–>
<Line Stretch=”Fill” Grid.RowSpan=”2″ X1=”0″ X2=”0″ Y1=”0″ Y2=”1″ StrokeThickness=”1″ Stroke=”#FFA4A4A4″ />
<Line Stretch=”Fill” Grid.ColumnSpan=”2″ Grid.Row=”2″ X1=”0″ X2=”1″ Y1=”0″ Y2=”0″ StrokeThickness=”1″ Stroke=”#FFA4A4A4″ />
<Rectangle Stretch=”Fill” StrokeThickness=”2″ Stroke=”#FFFFFFFF” Grid.Column=”1″ Grid.RowSpan=”2″/>
<Path Grid.Column=”1″ Margin=”1,1,1,0″ Stretch=”Fill” Data=”F1 M 547.239,124.863L 430.795,124.863L 430.795,135.106C 447.845,138.848 467.753,140.997 489.017,140.997C 510.281,140.997 530.188,138.848 547.239,135.106L 547.239,124.863 Z “>
<Path.Fill>
<LinearGradientBrush StartPoint=”0.5125,-0.0864589″ EndPoint=”0.5125,1.00202″>
<GradientStop Color=”#B3FFFFFF” Offset=”0″/>
<GradientStop Color=”#3CFFFFFF” Offset=”1″/>
</LinearGradientBrush>
</Path.Fill>
</Path>
</Grid>
</ControlTemplate>
</Grid.Resources>
<Grid.Background>
<SolidColorBrush Color=”Transparent” />
</Grid.Background>
<Grid.RowDefinitions>
<RowDefinition Height=”Auto” />
<RowDefinition Height=”*” />
<RowDefinition Height=”Auto” />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width=”Auto” />
<ColumnDefinition Width=”*” />
<ColumnDefinition Width=”Auto” />
</Grid.ColumnDefinitions>
<!– Row 0 –>
<!–<swcd:DataGridColumnHeader Name=”TopLeftCornerHeaderElement” Template=”{StaticResource TopLeftHeaderTemplate}” />–>
<Canvas Name=”ColumnHeadersPresenterElement” Grid.Column=”1″/>
<swcd:DataGridColumnHeader Name=”TopRightCornerHeaderElement” Grid.Column=”2″ Template=”{StaticResource TopRightHeaderTemplate}” />
<!– Row 1 –>
<!–<Canvas Name=”RowHeadersPresenterElement” Grid.Row=”1″/>–>
<Canvas Name=”CellsPresenterElement” Grid.Column=”1″ Grid.Row=”1″>
<Canvas.Resources>
<SolidColorBrush x:Key=”DefaultVerticalGridlinesBrush” Color=”#FFACACAC”/>
<SolidColorBrush x:Key=”DefaultHorizontalGridlinesBrush” Color=”#FFACACAC”/>
</Canvas.Resources>
</Canvas>
<Rectangle Name=”FocusVisualElement” Stroke=”#FF400000″ StrokeDashArray=”.2 4″ HorizontalAlignment=”Left” VerticalAlignment=”Top” StrokeDashCap=”Round” IsHitTestVisible=”false” Opacity=”0″ Grid.Column=”1″ Grid.Row=”1″/>
<ScrollBar Name=”VerticalScrollbarElement” Orientation=”Vertical” Grid.Column=”2″ Grid.Row=”1″ Width=”18″ />
<!– Row 2 –>
<!–<Rectangle Fill=”#FFE7E7E7″ Grid.Row=”2″/>–>
<ScrollBar Name=”HorizontalScrollbarElement” Orientation=”Horizontal” Grid.Column=”1″ Grid.Row=”2″ Height=”18″ />
<Rectangle Fill=”#FFE7E7E7″ Grid.Column=”2″ Grid.Row=”2″ />
</Grid>
</Border>
</Border>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>