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.

Answer 1

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>

Answer 2

You can used trigger for this Please check below code

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