Creating Grid

Here is the XAML that defines the C1FlexGrid.

XAML	Copy Code
<!-- show songs in a FlexGrid --> <fg:C1FlexGrid x:Name="_flexiTunes" Grid.Row="1" AreRowGroupHeadersFrozen="False" HeadersVisibility="Column" GridLinesVisibility="None" Background="White" RowBackground="White" AlternatingRowBackground="White" GroupRowBackground="White" MinColumnWidth="30" SelectionBackground="#a0eaeff4" CursorBackground="#ffeaeff4" AutoGenerateColumns="False" > <fg:C1FlexGrid.Columns> <fg:Column Binding="{Binding Name}" Header="Title" AllowDragging="False" Width="300" /> <fg:Column Binding="{Binding Duration}" HorizontalAlignment ="Right" /> <fg:Column Binding="{Binding Size}" HorizontalAlignment ="Right" /> <fg:Column Binding="{Binding Rating}" HorizontalAlignment="Center" Width="200" /> </fg:C1FlexGrid.Columns> </fg:C1FlexGrid>

XAML

Copy Code

<!-- show songs in a FlexGrid -->
<fg:C1FlexGrid x:Name="_flexiTunes" Grid.Row="1"
  AreRowGroupHeadersFrozen="False"
  HeadersVisibility="Column"
  GridLinesVisibility="None"
  Background="White"
  RowBackground="White"
  AlternatingRowBackground="White"
  GroupRowBackground="White"
  MinColumnWidth="30"
  SelectionBackground="#a0eaeff4"
  CursorBackground="#ffeaeff4"
  AutoGenerateColumns="False" >
  <fg:C1FlexGrid.Columns>
    <fg:Column Binding="{Binding Name}" Header="Title"
      AllowDragging="False" Width="300" />
    <fg:Column Binding="{Binding Duration}"
      HorizontalAlignment ="Right" />
    <fg:Column Binding="{Binding Size}"
      HorizontalAlignment ="Right" />
    <fg:Column Binding="{Binding Rating}"
      HorizontalAlignment="Center" Width="200" />
  </fg:C1FlexGrid.Columns>
</fg:C1FlexGrid>

The XAML sets a few style-related properties. Notice how the grid exposes several properties that allow you to customize its appearance considerably without resorting to custom cells or XAML templates.

Notice also that the code sets the AutoGenerateColumns property to false and defines the columns explicitly. This gives us a little extra control over the columns appearance and behavior.

Finally, notice that the XAML code sets the AreRowGroupHeadersFrozen property to false. Normally, group rows do not scroll horizontally. This allows users to see the group information at all times. But our iTunes application will display information on all columns of the group rows, so we do want them to scroll horizontally like all other rows. Setting theAreRowGroupHeadersFrozen property to false achieves this.

WPF Reference

C1FlexGrid Class

AutoGenerateColumns Property

AreRowGroupHeadersFrozen Property

Silverlight Reference

C1FlexGrid Class

AutoGenerateColumns Property

AreRowGroupHeadersFrozen Property