BlackWaspTM

This web site uses cookies. By using the site you accept the cookie policy.This message is for compliance with the UK ICO law.

Windows Presentation Foundation
.NET 4.0+

WPF Base Classes - Control - Fonts

The twenty-ninth part of the Windows Presentation Foundation Fundamentals tutorial continues to look at the Control class. This instalment examines the properties that may be applied to a control to modify its font, and that of its children.

Control

In the previous article I started to describe the Control class, which is a base class for many WPF controls, including most of the layout controls seen in earlier instalments of the WPF tutorial. The class provides lots of functionality to controls that include a control template. Although I'll be leaving templates until later in the tutorial, there are several categories of property and event that are worth discussing before then. In the last article we looked at the tab order. This article describes the properties that permit you to change a control's font.

There are five font properties defined in the Control class. They allow you to change the typeface, or font family, set how bold text appears, add italic effects, modify the size of the font and stretch the text horizontally to affect the aspect ratio of the characters. All five properties can be applied to any control derived from Control. Some such controls do not actually display text and others might not use the properties. However, the values you set will be inherited by their child controls. For example, you might set the font for an entire window. Although the window includes no text of its own, any controls within the window that do display text will inherit the properties.

To demonstrate we'll need a sample project. Start Visual Studio and create a new WPF application project. Name the solution, "ControlFontDemo".

Font Family

When you wish to choose the typeface with which to display text, you can use the FontFamily property. In XAML, you set the FontFamily attribute to the name of the font that you wish to use. If it does not exist, a default option is used instead. This ensures that your text will still be visible if the target machine is missing the font.

If you wish to set the property from code, you must provide a FontFamily object. This is usually configured during construction, by passing the name of the desired typeface to the constructor's parameter.

To show the use of this property, replace the XAML of the main window with the code shown below. This XAML sets two FontFamily values. The first is within the Window element and sets the font for the entire window and all of its child controls. The second Label also includes a FontFamily property, which overrides that of the window.

<Window x:Class="ControlFontDemo.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="Control Demo"
        Height="200"
        Width="200"
        FontFamily="Arial">
    <StackPanel>
        <Label>Inherited Font</Label>
        <Label FontFamily="Arial Black">Arial Black</Label>
    </StackPanel>
</Window>

If you run the program you should see that the label with no explicit FontFamily property uses Arial. The second label is rendered in Arial Black.

WPF FontFamily Example

Font Weight

The font weight of text describes the thickness of the strokes that make up the individual characters. Heavier fonts have thicker lines and appear darker than normal, whereas lighter versions of fonts have thinner, more delicate strokes. If you have developed Windows Forms applications it is likely that you will have modified a font weight by setting a typeface to bold. WPF allows greater control and more weight options.

To change the weight of the text in a control you can set the FontWeight property. In code you must provide a FontWeight object for this purpose. Usually these are obtained from the static properties of the FontWeights class, which provides a number of presets. In XAML, you can provide a weight name, which must match a property name from FontWeights, or you can set the weight using a number between 1 and 999, where 999 is the heaviest type permitted and 1 is the lightest.

The weight names and corresponding values are listed in the table below.

NameWeight
Thin100
ExtraLight, UltraLight200
Light300
Normal, Regular400
Medium500
DemiBold, SemiBold600
Bold700
ExtraBold, UltraBold800
Black, Heavy900
ExtraBlack, UltraBlack950

To demonstrate, add the following two labels immediately after the existing ones, inside the StackPanel.

<Label FontWeight="Black">Black Font from Name</Label>
<Label FontWeight="600">Bold Font from Number</Label>

Run the program to see the effects. The window should appear similar to that shown below. Notice how the Arial Black option and the standard Arial with FontWeight set to Black are very similar.

WPF FontWeight Example

NB: Although there is a gradual scale from 1 to 999, many weights will appear identical on screen. This is because the installed font must support the desired weight. Many fonts only include options for normal and bold. Others add extra weights, usually corresponding to the above names. When an unsupported weight is applied, a weight that is known to the font will be used instead.

2 October 2013