WPF在6个堆栈面板之间切换可见性,并在打开其中时隐藏所有其他面板

时间:2015-09-29 12:29:37

标签: wpf xaml toggle visibility

我有六个堆叠面板元素,通过一个单独的切换按钮切换,这是我需要的。但是,当用户打开其中一个堆栈面板时,我想关闭所有其他堆栈面板,只显示他们点击的那个。

<Grid HorizontalAlignment="Left" Height="504" Margin="-1,1,0,0" VerticalAlignment="Top" Width="760">

    <Grid.Resources>
        <BooleanToVisibilityConverter x:Key="boolConverter" />
    </Grid.Resources>

    <StackPanel HorizontalAlignment="Left" Height="505" VerticalAlignment="Top" Width="124" Background="#FF45B8F9" Margin="1,-1,0,0"/>

    <StackPanel HorizontalAlignment="Left" Height="505" VerticalAlignment="Top" Width="124" Background="#FFF95545" Margin="636,0,0,-1" Visibility="{Binding ElementName=button, Path=IsChecked, Converter={StaticResource boolConverter}}"/>

    <StackPanel HorizontalAlignment="Left" Height="505" VerticalAlignment="Top" Width="124" Background="#FFF9F945" Margin="507,-1,0,0" Visibility="{Binding ElementName=button_Copy, Path=IsChecked, Converter={StaticResource boolConverter}}"/>

    <StackPanel HorizontalAlignment="Left" Height="505" VerticalAlignment="Top" Width="124" Background="#FF76F945" Margin="378,-1,0,0" Visibility="{Binding ElementName=button1, Path=IsChecked, Converter={StaticResource boolConverter}}"/>

    <ToggleButton x:Name="button" Content="Green" HorizontalAlignment="Left" Margin="10,10,0,0" VerticalAlignment="Top" Width="105" Click="button_Click"/>

    <ToggleButton x:Name="button_Copy" Content="Yellow" HorizontalAlignment="Left" Margin="10,55,0,0" VerticalAlignment="Top" Width="105" Click="button_Click"/>

    <ToggleButton x:Name="button1" Content="Red" HorizontalAlignment="Left" Margin="10,114,0,0" VerticalAlignment="Top" Width="105"/>

</Grid>

1 个答案:

答案 0 :(得分:1)

使RadioButton自定义模板显示为Expander:

<Style TargetType="{x:Type RadioButton}">
    <Setter Property="GroupName" Value="MyToggleButtonGroupName"/>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type RadioButton}">
                <Expander IsExpanded="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=IsChecked}">
                    <ContentPresenter/>
                </Expander>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

<RadioButton>
    <StackPanel>...</StackPanel>
</RadioButton>
<RadioButton>
    <StackPanel>...</StackPanel>
</RadioButton>
<RadioButton>
    <StackPanel>...</StackPanel>
</RadioButton>