ComponentOne Tiles for WPF and Silverlight
C1Tiles Task-Based Help / Using Tiles in a Bound Control
In This Topic
    Using Tiles in a Bound Control
    In This Topic

    You can use C1Tiles in any ItemsControl such as a C1TileListBox or GridView control. Here's a markup example using C1FlipTile in a bound ListBox control:

    XAML
    Copy Code 
    <ListBox ItemsSource="{Binding}" x:Name="listBox" >
    <ListBox.ItemsPanel>
        <ItemsPanelTemplate>
            <c1:C1WrapPanel Background="YellowGreen"/>
        </ItemsPanelTemplate>
    </ListBox.ItemsPanel>
    <ListBox.ItemContainerStyle>
        <Style TargetType="ListBoxItem">
            <Setter Property="c1:C1TileService.PointerDownAnimation" Value="True"/>
        </Style>
    </ListBox.ItemContainerStyle>
    <ListBox.ItemTemplate>
        <DataTemplate>
            <c1:C1FlipTile Height="200" Width="200" Header="{Binding Title}" Content="{Binding}" Background="DarkGreen" HeaderBackground="#88000000" HeaderFontSize="18" Command="{Binding TileCommand, ElementName=pageRoot}" HeaderPadding="2" Padding="0" HeaderForeground="White" CommandParameter="{Binding Content, RelativeSource={RelativeSource Self}}">
                <c1:C1Tile.ContentTemplate>
                    <DataTemplate>
                        <Grid>
                            <TextBlock Text="{Binding Author}" Foreground="White" VerticalAlignment="Top" Margin="4,2,0,2"/>
                            <Image Source="{Binding Thumbnail}" Stretch="UniformToFill" Margin="1, 24, 24, 1"/>
                        </Grid>
                    </DataTemplate>
                </c1:C1Tile.ContentTemplate>
                <c1:C1Tile.AlternateContentTemplate>
                    <DataTemplate>
                        <Grid>
                            <Image Source="{Binding Thumbnail}" Stretch="UniformToFill"/>
                        </Grid>
                    </DataTemplate>
                </c1:C1Tile.AlternateContentTemplate>
            </c1:C1FlipTile>
        </DataTemplate>
    </ListBox.ItemTemplate>
</ListBox>

     

    Note: If you use C1Tile controls in the ListBox with VirtualizingStackPanel as ItemsPanel, set VirtualizingStackPanel.VirtualizationMode to Standard to avoid tile animations while scrolling the ListBox.