[WPF] Visibility Control based on ComboBox Selection

 ComboBox에서 선택된 값을 바인딩하여 다른 컨트롤을 제어하고 싶을때가 있다.

만약 Visible을 제어한다고 한다면 일반적으로 아래와 같이 생각하기 쉽다.

<ComboBox Name="cbItems">
    <ComboBoxItem>Visible</ComboBoxItem>
    <ComboBoxItem>Hidden</ComboBoxItem>
</ComboBox>

<TextBlock Text="Visible Control">
    <TextBlock.Style>
        <Style TargetType="TextBlock">
            <Setter Property="Visibility" Value="Hidden" />
            <Style.Triggers>
                <DataTrigger Binding="{Binding ElementName=cbItems, Path=SelectedValue}" Value="Visible">
                    <Setter Property="Visibility" Value="Visible" />
                </DataTrigger>
            </Style.Triggers>
        </Style>
    </TextBlock.Style>
</TextBlock>

하지만 위와 같이 작성하면 안된다.

 

왜나면 ComboBox에 바인딩할때 SelectedValue나 SelectedItem 등을 바인딩하면 ComboBoxItem을 가져오기 때문이다.

이를 우회하기 위해 Tag를 아래와 같이 이용하는 방법을 사용할 수 있다.

<ComboBox Name="cbItems">
    <ComboBoxItem Tag="Visible">Visible</ComboBoxItem>
    <ComboBoxItem Tag="Hidden">Hidden</ComboBoxItem>
</ComboBox>

<TextBlock Text="Visible Control">
    <TextBlock.Style>
        <Style TargetType="TextBlock">
            <Setter Property="Visibility" Value="Hidden" />
            <Style.Triggers>
                <DataTrigger Binding="{Binding ElementName=cbItems, Path=SelectedItem.Tag}" Value="Visible">
                    <Setter Property="Visibility" Value="Visible" />
                </DataTrigger>
            </Style.Triggers>
        </Style>
    </TextBlock.Style>
</TextBlock>

각 ComboBoxItem에 Tag를 지정해주고, SelectedItem == ComboboxItem 임으로 ComboBoxItem의 Tag를 가져와서 Property를 제어할 수 있다.