Привязка текста элемента к ToggleButton у Expander

126

28 января 2021, 21:30

Не могу придумать как это сделать. Нужно чтобы при нажатии на экспандер сообщение текстблока менялось на "Скрыть описание", а при повторном нажатии (когда он снова сворачивается), чтобы надпись опять становилась "Показать описание".

<Expander>
  <Expander.Header>
    <TextBlock Text="Показать описание"/>
  </Expander.Header>
<Expander>

Была идея привязать текст текстблока к ToggleButton этого экспандера, а потом через конвертер это реализовать, но только я не знаю как эту привязку сделать, ведь мы имеем только сам экспандер, а не ToggleButton внутри него. Надеюсь на вашу помощь

Answer 1

Просто сделайте нужный стиль и добавьте в него триггер.

Уберем из вашего кода все и зададим внутри переопределение стиля:

<Expander>
    <Expander.Style>
        <Style TargetType="Expander">
        </Style>
    </Expander.Style>
</Expander>

Далее задаем в стиле стандартные значения:

<Setter Property="IsExpanded" Value="False" />
<Setter Property="Header" Value="Показать описание" />

Теперь создаем триггер, который будет менять свойство Header, если IsExpanded == true:

<Style.Triggers>
    <Trigger Property="IsExpanded" Value="True">
        <Setter Property="Header" Value="Скрыть описание" />
    </Trigger>
</Style.Triggers>

Итоговый результат:

<Expander>
    <Expander.Style>
        <Style TargetType="Expander">
            <Setter Property="IsExpanded" Value="False" />
            <Setter Property="Header" Value="Показать описание" />
            <Style.Triggers>
                <Trigger Property="IsExpanded" Value="True">
                    <Setter Property="Header" Value="Скрыть описание" />
                </Trigger>
            </Style.Triggers>
        </Style>
    </Expander.Style>
</Expander>