Using Resources

You’ve seen how you can affect the properties of a single control, but in an application with more than one control, you wouldn’t want to have to set each control’s properties individually. That’s where resources come in. You define a resource for an entire WPF application, where it can be used by any appropriate control.

To see how this works, you’ll add another Label and Button to your Hello WPF example. Drag a Label control to somewhere near the upper-left corner of the window. Drag a Button control next to the Say Hello button. You can see in the Design window that the new controls have the Windows standard appearance, not the custom appearance that you gave the two older controls. In some cases, that’s fine, but most of the time, you’ll want all the controls in your application to have a consistent appearance.

For the Label, change its name to lblTop, and set its Content property to “WPF Test”. You won’t do anything programmatically with this label; it’s just for demonstration purposes. You might as well give the button something to do, though. Change its Name to btnCancel, and its Content property to “Cancel”. Double-click the button to create its event handler, and add the following code:

this.Close( );

In a WPF application, you use the Close( ) method to end the application, rather than Application.Exit( ), as you would in Windows Forms.

To get the controls of each type to have the same appearance, you’ll define a Style element as a resource. Resources are generally scoped to particular elements. You could create a resource for each individual control, but it’s easier to do it at the scope of the Window element.

In the XAML window, after the opening Window tag, enter the following code:

<Window.Resources>
    <Style x:Key="btnStyle" TargetType="Button">
        <Setter Property="Opacity" Value="0.5" />
    </Style>
    <Style x:Key="lblStyle" TargetType="Label">
        <Setter Property="Opacity" Value="0.5" />
        <Setter Property="Background" Value="SlateGray" />
        <Setter Property="Foreground" Value="White" />
    </Style>
</Window.Resources>

You start off with the Window.Resources element; that’s clear enough. The next line defines the Style element. As we mentioned before, the x is used to indicate the namespace for this application. Here, you’re defining a Key as part of the namespace so that other elements can refer to it elsewhere in the form. We’ve given the Key a value of btnStyle, to make it obvious what it’s referring to, but just as you saw with dictionaries back in Chapter 14, a Key can be anything you like, as long as you can find it later. The TargetType property restricts the style to being applied to Button controls only; it’s not strictly necessary, but if you defined a style specifically for Button controls, without using the TargetType property, and later tried to apply that style to a TextBox, you could cause an error, depending on the specific styles you defined.

Once you’ve opened the Style element, you can define some Setter elements. These, as the name implies, set properties of the target. In this case, the only change you’re making to the Button control is to set the Opacity property to 0.5, so you provide the Property, and then the Value.

You then close the Style element for the Button, and open one for the Label control, cleverly named lblStyle. This style has a few more properties than btnStyle does, but they’re all pretty simple.

The next step is to apply those styles to the individual controls. You do that within the element for each control, with the Style attribute:

<Label Style="{StaticResource lblStyle}" Height="28" 
       Margin="77,83,81,0" Name="lblHello" VerticalAlignment="Top">
       Label</Label>

In this case, you define the Style property with a static resource, which means that the control element will look for the style definition with the appropriate name elsewhere in the XAML file, within the scope that it can access. You defined lblStyle as a resource for the entire Window, so the Label can find and use that resource. Note that the curly braces are required.

Now apply the lblStyle to the other Label, and the btnStyle to the two Button controls. You should find that the styles are applied immediately in the Design window, and of course they stay if you run the application. The entire XAML file for this example is shown in Example 19-3.

Example 19-3. When you define a resource for the Window element, that resource is available to all the elements in the window

<Window x:Class="Example_19_3_ _ _ _Classes_and_Styles.Window1"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="Window1" Height="300" Width="300">
    <Window.Resources>
        <Style x:Key="btnStyle" TargetType="Button">
            <Setter Property="Opacity" Value="0.5" />
        </Style>
        <Style x:Key="lblStyle" TargetType="Label">
            <Setter Property="Opacity" Value="0.5" />
            <Setter Property="Background" Value="SlateGray" />
            <Setter Property="Foreground" Value="White" />
        </Style>
    </Window.Resources>
    <Grid Background="IndianRed">
        <Label Style="{StaticResource lblStyle}" Height="28" 
               Margin="77,83,81,0" Name="lblHello" 
               VerticalAlignment="Top">Label</Label>
        <Button Style="{StaticResource btnStyle}" Height="23" 
               Margin="77,0,126,105" Name="btnHello" 
               VerticalAlignment="Bottom" Click="btnHello_Click">
               Say Hello</Button>
        <Label Style="{StaticResource lblStyle}" Height="28" 
               HorizontalAlignment="Left" Margin="15,18,0,0" 
               Name="lblTop" VerticalAlignment="Top" Width="120">
               WPF Test</Label>
        <Button Style="{StaticResource btnStyle}" Height="23" 
               HorizontalAlignment="Right" Margin="0,0,26,105" 
               Name="btnCancel" VerticalAlignment="Bottom" 
               Width="75" Click="btnCancel_Click">Cancel</Button>
    </Grid>
</Window>
..................Content has been hidden....................

You can't read the all page of ebook, please click here login for view all page.
Reset