Coming in Mango–Implicit Styles

Mango From Scratch

Mango represents the upgrading of the Windows Phone Operating System from Silverlight 3+ to 4.  With Silverlight 4 comes a number of very useful features, not least of which is implicit styling.

With implicit styling you create a target type but not a key for your style and the style is implicitly applied to any object of that type that does not otherwise have an explicit style.

This is easily seen with an example.

Create a new Mango application, and open App.xaml where you will fill in the resources with the following styles (cribbed from the Silverlight 4 help files)

<Application.Resources>

   <Style
      TargetType="TextBlock">
      <Setter
         Property="Foreground"
         Value="Yellow" />
      <Setter
         Property="FontSize"
         Value="36" />
      <Setter
         Property="VerticalAlignment"
         Value="Center" />
   </Style>

   <Style
      TargetType="TextBox">
      <Setter
         Property="Width"
         Value="250" />
      <Setter
         Property="Height"
         Value="100" />
      <Setter
         Property="Margin"
         Value="4" />
      <Setter
         Property="FontSize"
         Value="36" />
      <Setter
         Property="Background">
         <Setter.Value>
            <LinearGradientBrush
               StartPoint="0,0.5"
               EndPoint="1,0.5">
               <GradientStop
                  Color="White"
                  Offset="0.0" />
               <GradientStop
                  Color="LightBlue"
                  Offset="0.5" />
               <GradientStop
                  Color="Navy"
                  Offset="1" />
            </LinearGradientBrush>
         </Setter.Value>
      </Setter>
   </Style>

</Application.Resources>

This creates two implicit styles, one for TextBlocks and one for TextBoxes.  Return to MainPage.xaml and add a StackPanel that contains a TextBlock (as a prompt) and a TextBox.  If you do not apply an explicit style to either, the implicit styles will be applied as shown in the illustration above,

<StackPanel
   x:Name="TitlePanel"
   Grid.Row="0"
   Margin="12,17,0,28">
   <TextBlock
      x:Name="ApplicationTitle"
      Text="What's Coming In Mango"
      Style="{StaticResource PhoneTextNormalStyle}" />
   <TextBlock
      x:Name="PageTitle"
      Text="Implicit Styles"
      Margin="9,-7,0,0"
      Style="{StaticResource PhoneTextTitle1Style}" />
</StackPanel>