WPF панель переключения видимости

Question

У меня две панели, только одна должна быть видна одновременно.Я переключаюсь между ними, нажимая кнопку, по одной на каждой панели.

Есть ли хороший способ сделать это в xaml без codebehind или viewmodel?

Answer 1

Это на самом деле возможно, но довольно сложно.

Мой пример работает без какого-либо кода, фактически даже без преобразователей значений.

Вот код: (теперь упрощенная версия,спасибо @HB за идеи)

<Page xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
      xmlns:sys="clr-namespace:System;assembly=mscorlib"
      xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
  <Page.Resources>
    <Style x:Key="RBToggleButtonStyle" TargetType="RadioButton">
      <Setter Property="Template">
         <Setter.Value>
           <ControlTemplate>
              <ToggleButton
                 IsChecked="{Binding IsChecked, RelativeSource={RelativeSource TemplatedParent}, Mode=TwoWay}"
                 Content="{Binding Content, RelativeSource={RelativeSource TemplatedParent}, Mode=TwoWay}" />
           </ControlTemplate>
         </Setter.Value>
       </Setter>
       <Setter Property="Width" Value="150"/>
       <Setter Property="Height" Value="25"/>
       <Setter Property="HorizontalAlignment" Value="Right"/>
       <Setter Property="VerticalAlignment" Value="Bottom"/>
       <Setter Property="Margin" Value="15"/>
       <Setter Property="Content" Value="Hide"/>
    </Style>
    <Style x:Key="MyBorderStyle" TargetType="Border">
      <Style.Triggers>
        <DataTrigger Binding="{Binding IsChecked}" Value="True">
          <Setter Property="Visibility" Value="Hidden"/>
        </DataTrigger>
      </Style.Triggers>
    </Style>
  </Page.Resources>
  <Grid>
    <Grid.ColumnDefinitions>
      <ColumnDefinition/>
      <ColumnDefinition/>
    </Grid.ColumnDefinitions>
    <Border Background="Green" Grid.Column="0" Style="{StaticResource MyBorderStyle}" DataContext="{Binding ElementName=greenB}">
      <RadioButton x:Name="greenB" GroupName="x" Style="{StaticResource RBToggleButtonStyle}"/>
    </Border>
    <Border Background="Red" Grid.Column="1" Style="{StaticResource MyBorderStyle}" DataContext="{Binding ElementName=redB}">
      <RadioButton x:Name="redB" GroupName="x" Style="{StaticResource RBToggleButtonStyle}"/>
    </Border>
  </Grid>
</Page>

Идея использования ToggleButtons украдена у какой-то другой вопрос на SO

Answer 2

Предложение с использованием tabcontrol хорошо.Я нашел некоторый код, который стилизует TabControl, чтобы показать только содержимое TabItem

<Page xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
  <Grid>
    <TabControl BorderThickness="0" Padding="0">
      <TabControl.Resources>
        <Style TargetType="TabItem">
          <Setter Property="Template">
            <Setter.Value>
              <ControlTemplate TargetType="TabItem">
              </ControlTemplate>
            </Setter.Value>
          </Setter>
        </Style>
      </TabControl.Resources>
      <TabItem Header="Not shown">
        <Grid Background="Red"/>
      </TabItem>
      <TabItem>
        <TextBlock HorizontalAlignment="Center" VerticalAlignment="Center">Tab 2

        </TextBlock>
      </TabItem>
    </TabControl>
  </Grid>
</P

Answer 3

Почему бы не использовать TabControl для этого?

Answer 4

Если вы использовали ToggleButtons, то вы могли бы связать видимость Panel 1 с состоянием IsChecked кнопки 2, а видимость Panel 2 - с состоянием IsChecked кнопки 1. Сделайте их привязками TwoWay и используйте встроенный BooleanToVisibilityконвертер.

Answer 5

Немного поработав с IValueConverter, добьемся цели.Конечно, это не старый XAML, но его нет в коде и его можно использовать повторно.

Я вижу что-то вроде привязки видимости X к видимости Y и добавляю к ней конвертер:

public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
{
  return (Visibility)value == Visibility.Visible ? Visibility.Collapsed : Visibility.Visible;
}

Answer 6

Я так не думаю.Вы должны будете использовать viewmodel или codebehind.Используйте стиль с DataTrigger и привяжите значение свойства видимости к свойству в viewmodel, избегая использования codebehind.