How can I toggle a TextBlock's visibility in a DataTrigger?

Question

This code works (when ControlType="dropDown" then the background yellow):

<Window x:Class="TestCollapsed.Views.MainView"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:c="clr-namespace:TestCollapsed.Commands"
    Title="Main Window" Height="400" Width="800">
    <Window.Resources>
        <Style x:Key="DropDownStyle" TargetType="TextBlock">
            <Style.Triggers>
                <DataTrigger Binding="{Binding ControlType}" Value="dropDown">
                    <Setter Property="Background" Value="Yellow"/>
                </DataTrigger>
            </Style.Triggers>
        </Style>
    </Window.Resources>

    <StackPanel>
        <TextBlock Visibility="Visible" 
                   Text="This is going to be the dropdown control."
                   Style="{StaticResource DropDownStyle}"/>
    </StackPanel>
</Window>

But this code does not work (when ControlType="dropDown" then the TextBlock is still invisible):

<Window x:Class="TestCollapsed.Views.MainView"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:c="clr-namespace:TestCollapsed.Commands"
    Title="Main Window" Height="400" Width="800">
    <Window.Resources>
        <Style x:Key="DropDownStyle" TargetType="TextBlock">
            <Style.Triggers>
                <DataTrigger Binding="{Binding ControlType}" Value="dropDown">
                    <Setter Property="Visibility" Value="Visible"/>
                </DataTrigger>
            </Style.Triggers>
        </Style>
    </Window.Resources>

    <StackPanel>
        <TextBlock Visibility="Collapsed" 
                   Text="This is going to be the dropdown control."
                   Style="{StaticResource DropDownStyle}"/>
    </StackPanel>
</Window>

Why can't I set visibility in a style as I can background?

Decoct

Answer 1

You're setting the Visibility on the TextBlock and then trying to override it with a style. That won't work. Try this:

<Window x:Class="TestCollapsed.Views.MainView"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:c="clr-namespace:TestCollapsed.Commands"
    Title="Main Window" Height="400" Width="800">
    <Window.Resources>
        <Style x:Key="DropDownStyle" TargetType="TextBlock">
            <Setter Property="Visibility" Value="Collapsed"/>
            <Style.Triggers>
                <DataTrigger Binding="{Binding ControlType}" Value="dropDown">
                    <Setter Property="Visibility" Value="Visible"/>
                </DataTrigger>
            </Style.Triggers>
        </Style>
    </Window.Resources>

    <StackPanel>
        <TextBlock Text="This is going to be the dropdown control."
                   Style="{StaticResource DropDownStyle}"/>
    </StackPanel>
</Window>

Fug

I had to make this mistake 10 times before it sunk in. – Sebastiansebastiano

Yeah, me too. Now it's the first thing I look for when reviewing code with Triggers. – Fug

Hi, may i know how to bind the ControlType to code behind from this Binding="{Binding ControlType}" ? – Minta

Answer 2

I have the same problem. @Bryan's answer is perfect! There are the wrong and right versions. The wrong version:

<TextBlock Text="1999-09-09 16:08" VerticalAlignment="Top" Visibility="Collapsed">
                                <TextBlock.Style>
                                    <Style BasedOn="{StaticResource TipTextYellow}" TargetType="TextBlock">
                                        <Style.Triggers>
                                            <DataTrigger Binding="{Binding ElementName=Alcohol,Path=IsFocused}"  Value="True">
                                                <Setter Property="Visibility" Value="Visible"/>
                                            </DataTrigger>
                                        </Style.Triggers>
                                    </Style>
                                </TextBlock.Style>
                            </TextBlock>

The right version:

<TextBlock Text="1999-09-09 16:08" VerticalAlignment="Top">
                                <TextBlock.Style>
                                    <Style BasedOn="{StaticResource TipTextYellow}" TargetType="TextBlock">
                                        <Setter Property="Visibility" Value="Collapsed"/>
                                        <Style.Triggers>
                                            <DataTrigger Binding="{Binding ElementName=Alcohol,Path=IsFocused}"  Value="True">
                                                <Setter Property="Visibility" Value="Visible"/>
                                            </DataTrigger>
                                        </Style.Triggers>
                                    </Style>
                                </TextBlock.Style>
                            </TextBlock>

Strongroom

That doesn't help. – Beall