Wednesday, April 20, 2011

Five Minute Silverlight 5 Aides-Memoire #2 – Implicit DataTemplates

Data Classes
  1. /// <summary>
  2. /// The cartoon character.
  3. /// </summary>
  4. public class CartoonCharacter
  5. {
  6.     /// <summary>
  7.     /// Gets or sets the forename.
  8.     /// </summary>
  9.     /// <value>The forename.</value>
  10.     public string Forename { get; set; }
  11. }
  12.  
  13. /// <summary>
  14. /// The flintstone.
  15. /// </summary>
  16. public class Flintstone : CartoonCharacter { }
  17.  
  18. /// <summary>
  19. /// The griffin.
  20. /// </summary>
  21. public class Griffin : CartoonCharacter { }
  22.  
  23. /// <summary>
  24. /// The simpson.
  25. /// </summary>
  26. public class Simpson : CartoonCharacter { }

 

XAML
  1. <Grid x:Name="LayoutRoot"
  2.       Background="White">
  3.     <Grid.Resources>
  4.         <Style x:Key="SimpsonStyle"
  5.                TargetType="TextBlock">
  6.             <Setter Property="FontFamily" Value="Comic Sans MS" />
  7.             <Setter Property="FontSize" Value="16" />
  8.             <Setter Property="Foreground" Value="Blue" />
  9.             <Setter Property="FontStyle" Value="Italic" />
  10.         </Style>
  11.         <DataTemplate DataType="this:Simpson">
  12.             <Border Background="Yellow">
  13.                 <StackPanel Orientation="Horizontal">
  14.                     <TextBlock Style="{StaticResource SimpsonStyle}"
  15.                                Text="{Binding Forename}" />
  16.                     <TextBlock Margin="5,0,0,0"
  17.                                Style="{StaticResource SimpsonStyle}"
  18.                                Text="Simpson" />
  19.                 </StackPanel>
  20.             </Border>
  21.         </DataTemplate>
  22.         <DataTemplate DataType="this:Flintstone">
  23.             <Border Background="Orange">
  24.                 <Border.RenderTransform>
  25.                     <TransformGroup>
  26.                         <SkewTransform AngleX="-20" />
  27.                         <ScaleTransform ScaleX="2"
  28.                                         ScaleY="0.75" />
  29.                         <TranslateTransform X="30" />
  30.                     </TransformGroup>
  31.                 </Border.RenderTransform>
  32.                 <StackPanel Orientation="Horizontal">
  33.                     <TextBlock Text="{Binding Forename}" />
  34.                     <TextBlock Margin="5,0,0,0"
  35.                                Text="Flintstone" />
  36.                 </StackPanel>
  37.             </Border>
  38.         </DataTemplate>
  39.         <DataTemplate DataType="this:Griffin">
  40.             <Border BorderBrush="DarkSlateBlue" BorderThickness="2">
  41.                 <StackPanel Orientation="Horizontal">
  42.                     <TextBlock Text="{Binding Forename}" FontSize="18">
  43.                         <TextBlock.Effect>
  44.                             <BlurEffect />
  45.                         </TextBlock.Effect>
  46.                     </TextBlock>
  47.                     <TextBlock Margin="5,0,0,0"
  48.                                FontSize="22" CharacterSpacing="5"
  49.                                Text="Griffin">
  50.                         <TextBlock.Effect>
  51.                             <DropShadowEffect />
  52.                         </TextBlock.Effect>
  53.                     </TextBlock>
  54.                 </StackPanel>
  55.             </Border>
  56.         </DataTemplate>
  57.     </Grid.Resources>
  58.     <ListBox x:Name="CartoonCharactersListBox"
  59.              Margin="50,20"
  60.              BorderBrush="Blue"
  61.              BorderThickness="2"
  62.              ItemsSource="{Binding}" />
  63. </Grid>

 

SL5AM2

Yeugh!!

No comments: