Creating a self-updating Textblock user control in WPF

Question

I'm trying to create a re-usable textblock user control in WPF. The basic idea is as follows:

User does not directly specify the content of the textblock
There are three dependancy properties in my user control called IsToggled, ToggleTrueText, and ToggleFalseText.
The control will display ToggleTrueText if IsToggled is true; or display ToggleFalseText if IsToggled is false.
When IsToggled changes during runtime, the text automatically changes to either ToggleTrueText or ToggleFalseText

I started by adding a PropertyChangedCallback to the IsToggled DP:

Code-behind of the UserControl:

public static readonly DependencyProperty IsToggledProperty =
        DependencyProperty.Register("IsToggled", typeof(bool), 
        typeof(TagToggle), new PropertyMetadata(new 
        PropertyChangedCallback(OnToggleStateChanged)));

public bool IsToggled
{
    get { return (bool)GetValue(IsToggledProperty); }
    set { SetValue(IsToggledProperty, value); }
}

//ToggleTrueText and ToggleFalseText are declared similarly to IsToggled

...

private static void OnToggleStateChanged(DependencyObject d, 
 DependencyPropertyChangedEventArgs e)
{
    ...
}

Xaml of the user control:

<Grid x:Name="LayoutRoot">
    <TextBlock x:Name="TheTextBlock" Text="{Binding WhatDoIBindTo}"/>
</Grid>

However, I'm not sure what would be the best way to ensure that TheTextBlock updates its text whenever IsToggled changes during runtime.

It's impossible to know, since you didn't bother to provide a minimal reproducible example showing us what you're doing. But assuming the Grid and its TextBlock are in the UserControl XAML, then you should have a view model private to the UserControl that can be used as the data context for the TextBlock. Either that or just set the property explicitly as TheTextBlock.Text in the OnToggleStateChanged() method. Please improve the question so it's clear what you're doing and what specifically you need help with. — Peter Duniho
why dont you just create a CLR property and bind it to your textblock text property and dont forget to implement INotifyPropertyChanged. — tabby

mm8 mm8 · Accepted Answer · 2017-04-18T09:06:08

Try this:

private static void OnToggleStateChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
{
    TagToggle ctrl = d as TagToggle;
    if (ctrl != null)
    {
        TheTextBlock.Text = ctrl.IsToggled ? ToggleTrueText. : ToggleFalseText;
    }
}

If you want to bind the Text property of the TextBlock you need to make sure that you are binding to properties of the UserControl. You could do this by setting the DataContext property of the TextBlock:

<TextBlock x:Name="TheTextBlock" DataContext="{Binding RelativeSource={RelativeSource AncestorType=UserControl}}">
    <TextBlock.Style>
        <Style TargetType="{x:Type TextBlock}">
            <Setter Property="Text" Value="{Binding ToggleTrueText}" />
            <Style.Triggers>
                <DataTrigger Binding="{Binding IsToggled}" Value="False">
                    <Setter Property="Text" Value="{Binding ToggleFalseText}"/>
                </DataTrigger>
            </Style.Triggers>
        </Style>
    </TextBlock.Style>
</TextBlock>

Creating a self-updating Textblock user control in WPF

2 Answers