i'm wanting to make a "table" that has borders and background colors.  something like this generic image i pulled from google.

what's the best way to do this?
 

Hello, generally speaking, there're two ways to customize a Control's look.

First, set the various properties, if available. For example, with DataGrid, you can set RowBackground and AlternatingRowBackground to customize the rows' background, and set HeadersVisibility to Column so that only columns will display headers. You can find all those properties in Blend.

<Data:DataGrid RowBackground="#FFEFEFEF" AlternatingRowBackground="#FFEFEFEF" HeadersVisibility="Column">

Second, you can create ControlTemplates wrapped in Styles to completely change a Control's look. Unfortunately, Blend March Preview doesn't allow you to edit ControlTemplates via the designer interface, so you'll have to manually write XAML (in a future version this feature is likely to be added). Here's a simple sample for DataGridColumnHeader's ControlTemplate:

<Style x:Key="columnHeaderStyle" TargetType="Data:DataGridColumnHeader">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="Data:DataGridColumnHeader">
<Grid Name="RootElement" Background="#FFCC0033">
<Grid.RowDefinitions>
<RowDefinition Height="*" />
<RowDefinition Height="*" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="Auto" />
</Grid.ColumnDefinitions>

<Line Stretch="Fill" Grid.Row="2" Grid.ColumnSpan="2" X1="0" X2="1" Y1="0" Y2="0" StrokeThickness="1" Stroke="#FF000000" />
<Line Stretch="Fill" Grid.RowSpan="2" Grid.Column="1" X1="0" X2="0" Y1="0" Y2="1" StrokeThickness="1" Stroke="#FF000000" Visibility="{TemplateBinding SeparatorVisibility}" />

<ContentPresenter Content="{TemplateBinding Content}" Margin="3,0,3,0" Foreground="White" Grid.RowSpan="2" VerticalAlignment="Center"/>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>

To use this template, in your DataGrid, you can set the ColumnHeaderStyle property to the above Style.

<Data:DataGrid RowBackground="#FFEFEFEF" AlternatingRowBackground="#FFEFEFEF" ColumnHeaderStyle="{StaticResource columnHeaderStyle}" HeadersVisibility="Column">

shanaolanxing - Please mark the posts as answers if they help and unmark if they don't.

Hi,

I'm getting this error :(.

I got a datagrid thats in a different xaml file, thats because I made it a control.

This is the error:

A first chance exception of type 'System.Windows.Markup.XamlParseException' occurred in System.Windows.dll
Additional information: Invalid attribute value System_Windows_Controls:DataGridColumnHeader for property TargetType. [Line: 6 Position: 99]

These are the first lines of the datagrid control:

<Grid x:Name="DataGridMedewerkerOverzicht" Background="White" >

x:Name="dg" AutoGenerateColumns="False" VerticalAlignment="Top" d:LayoutOverrides="Height" Margin="0,0,-97.4440002441406,0" Height="25.134">

<System_Windows_Controls:DataGrid.Columns>

I put the style in my app.xaml, thats the only location I found where it was accepted.

<Application.Resources>

<Style x:Key="columnHeaderStyle" TargetType="System_Windows_Controls:DataGridColumnHeader">

<Setter Property="Template">

<Setter.Value> and so on....

Can anyone help me? Thx! :)