Question

I'm creating a WPF app and I would like to know the best way to be able to change the font size for every element in the ui. Do I create a resource dictionary and set Styles to set the font size for all the controls I use?

What is the best practice?

Was it helpful?

Solution

I'd do it this way:

<Window.Resources>
        <Style TargetType="{x:Type Control}" x:Key="baseStyle">
            <Setter Property="FontSize" Value="100" />
        </Style>
        <Style TargetType="{x:Type Button}" BasedOn="{StaticResource baseStyle}"></Style>
        <Style TargetType="{x:Type Label}" BasedOn="{StaticResource baseStyle}"></Style>
        <Style TargetType="{x:Type TextBox}" BasedOn="{StaticResource baseStyle}"></Style>
        <Style TargetType="{x:Type ListView}" BasedOn="{StaticResource baseStyle}"></Style>
        <!-- ComboBox, RadioButton, CheckBox, etc... -->
    </Window.Resources>

That way, if I want to change ALL the controls, I'd just have to change the "baseStyle" style, the rest would just inherit from it. (That's what BasedOn property those, you can also extend the base style if you create other setters inside of the inherited style)

OTHER TIPS

FontSizeProperty is inherited from Parent Control. So you just need to change FontSize of your main window.

If you don't need dynamic behaviour this should work:

Add a style for Window to your ResourceDictionary

<Style TargetType="{x:Type Window}">
     <Setter Property="FontSize" Value="15" />
</Style>

Apply the style to your main form (will not be applied implicit because its a derived type)

 Style = (Style)FindResource(typeof (Window));

Another option is to define the FontFamily and FontSize as resources.

<FontFamily x:Key="BaseFontFamily">Calibri</FontFamily>
<sys:Double x:Key="BaseFontSize">12</sys:Double>

That way you can use them in your setters.

<Window> has a property FontSize.

So you can set desired fontsize in element if you want to change the fontsize in all the elements within that window.

<Window FontSize="12">

</Window>
Application.Current.MainWindow.FontSize = _appBodyFontSize;

This way you can change the Font Size at run time also.

TextElement.FontSize is an inherit property, which means you can simply set the font size at root element, and all the children elements will use that size (as long as you don't change them manually)

For any styles in WPF, you should have a separate resource dictionary that contains the styles for your app.

If you want to have a single Font Size that's reused throughout the app then just create a style for that font size. You can either give it a unique name/key to use explicitly or you can set a targetType that will transcend throughout the app.

Explicit Key:

<Style
    x:Key="MyFontSize"
    TargetType="TextBlock">
    <Setter
        Property="FontSize"
        Value="10" />
</Style>

<Control
    Style="{StaticResource MyFontSize}" />

*Note this style can be used with controls that have contentPresenters

For all textblocks in the app:

<Style
    TargetType="TextBlock">
    <Setter
        Property="FontSize"
        Value="10" />
</Style>

<TextBlock
        Text="This text will be size 10" />

If you need to programmatically change global FontSize, not statically (XAML), to be applied once for all your windows, you can do:

TextElement.FontSizeProperty.OverrideMetadata(
            typeof(TextElement),
            new FrameworkPropertyMetadata(16.0));

        TextBlock.FontSizeProperty.OverrideMetadata(
            typeof(TextBlock),
            new FrameworkPropertyMetadata(16.0));

This values are applied to any TextBlock, Labels and almost any text in any windows, whereas it has not a explicit FontSize defined. But this does not affect for TextBox, you have to write a similar code for it or any other special controls.

To dynamically change the font size globally with ctrl-mousewheel:

XAML:

<Window Name="MainWindow" ... PreviewMouseWheel="MainWindow_PreviewMouseWheel">

code behind:

private void MainWindow_PreviewMouseWheel(object sender, MouseWheelEventArgs e)
{
    if ((Keyboard.Modifiers & ModifierKeys.Control) != 0)
    {
        if (e.Delta > 0)
            ++mainCtrl.FontSize;
        if (e.Delta < 0 && mainCtrl.FontSize > 1)
             --mainCtrl.FontSize;
    }
}
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top