Oxygene and WP8 – Resources and Styles in Windows Phone

There are generally two kinds of resources in XAML , the resource file with extension of resx and the resource file with xaml extension.

The resx file is generally concerned with the localization strings whereas the other one with xaml extension allows the developers to define the style or properties in separate location and then reuse these resources . This article will explain how to use the resources for reusing the styles in Windows Phone.

For example , assume the button with the following style.

<Button x:Name="btnLaunch" Content="LaunchMobileOSGeek Website" Background="Blue" BorderBrush="Yellow" BorderThickness="1" />

Now , how can use the same style properties of the above button for other buttons in the application ? Simple , Just define the style in the resources section of the App.xaml file as shown below.

<!--Application Resources-->
<Application.Resources>
<local:LocalizedStrings xmlns:local="clr-namespace:MobileOSGeekOxygeneTutorial" x:Key="LocalizedStrings"/>
<Style x:Key="MobileOSGeekButtonStyle" TargetType="Button">
 <Setter Property="Background" Value="Blue" />
 <Setter Property="BorderBrush" Value="Yellow" />
 <Setter Property="BorderThickness" Value="1" />
</Style>
</Application.Resources>

Now , the style can be applied to the button by just specifying the key MobileOSGeekButtonStyle for the style property as shown below.

<Button Style="{StaticResource MobileOSGeekButtonStyle}" x:Name="btnLaunch" Content="LaunchMobileOSGeek Website" />

Implicit Styles in WP8

The above sample code snippet was an example of the explicit styles in Windows Phone 8 where we specified the x:Key=”MobileOSGeekButtonStyle” for the style property in the app.xaml file and then used the Style=”{StaticResource MobileOSGeekButtonStyle}” to apply the style .

How to apply the style implicitly to all instances of the target type (for example buttons in this example). Simple , when defining the style , donot specify the ley property and specify only the TargetType . This will implicity apply the style defined for the target type in your application as shown below.

<Application.Resources>
<local:LocalizedStrings xmlns:local="clr-namespace:MobileOSGeekOxygeneTutorial" x:Key="LocalizedStrings"/>
<Style TargetType="Button">
 <Setter Property="Background" Value="Blue" />
 <Setter Property="BorderBrush" Value="Yellow" />
 <Setter Property="BorderThickness" Value="1" />
</Style>
</Application.Resources>

Implicit style applied for the button.

<Button x:Name="btnLaunch" Content="LaunchMobileOSGeek Website" />

Oxygene and WP8 - Resources and Styles in Windows Phone

No Responses

Leave a Reply