WPF: Data binding with slider

This entry is part 22 of 54 in the series Learn WPF

Here we create a slider that affects the font size of a TextBlock without any code behind.

When a slider is moving, it changes the font size of a TextBlock directly.  This is done with only XAML.

<Window x:Class="SliderName.MainWindow"
        Title="MainWindow" Height="350" Width="525">
            <RowDefinition />
            <RowDefinition Height="50" />
            <RowDefinition Height="Auto" />
        <TextBlock Text="This is a sizing text" FontSize="{Binding Path=Value, ElementName=slider}" TextAlignment="Center" VerticalAlignment="Center"/>
        <Slider x:Name="slider" Grid.Row="1" Minimum="10" Maximum="80" Value="30" IsSnapToTickEnabled="True"/>
        <TextBox  Text="{Binding Path=Value, ElementName=slider}" Grid.Row="2" FontSize="20"/>

This example also illustrates element to element data binding.  The source here is the value of the Slider and the target is the font size of the TextBlock.

Here I also added a TextBlock, line 13, that is bound to the value of the Slider.






Series Navigation<< WPF: Selecting An Item In Listbox
WPF: Binding slider and textbox >>

Leave a comment

Leave a Reply