none
Tabitem设置Visibility属性问题,设置为Collapsed,tabitem隐藏了,但内容不隐藏,这个怎么解决。 RRS feed

  • 问题

  • 这是tabItem的Style

        <Style TargetType="{x:Type TabItem}">
            <Setter Property="FontSize" Value="16"/>
            <Setter Property="Background" Value="Transparent"></Setter>
            <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
            <Setter Property="VerticalContentAlignment" Value="Stretch"/>
    
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type TabItem}">
                        <Grid  Height="40" >
                            <Border x:Name="Bd" Background="{TemplateBinding Background}">
                                <ContentPresenter Margin="7"  x:Name="Content" ContentSource="Header" 
                                                   HorizontalAlignment="{Binding HorizontalContentAlignment, RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}}" 
                                                   RecognizesAccessKey="True" 
                                                   SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" 
                                                   VerticalAlignment="{Binding VerticalContentAlignment, RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}}"/>
                            </Border>
                        </Grid>
                        <ControlTemplate.Triggers>
                            <MultiTrigger>
                                <MultiTrigger.Conditions>
                                    <Condition Property="IsMouseOver" Value="true"/>
                                    <Condition Property="IsSelected" Value="false"/>
                                </MultiTrigger.Conditions>
                                <Setter Property="Background" TargetName="Bd" Value="blue"/>
                            </MultiTrigger>
                            <Trigger  Property="IsSelected" Value="true">
                                <Setter Property="Background" Value="red" TargetName="Bd"/>
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

    设置tabItem的属性为Collapsed,但内容不隐藏。

    tabItem子控件的Visibility属性进行如下设置,也没有作用

    Visibility="{Binding RelativeSource={RelativeSource FindAncestor,AncestorType={x:Type TabItem},AncestorLevel=1},Path=Visibility}"

    如何解决这个问题

    2019年9月15日 12:00

答案

  • 关于Tabcontrol的原理可以参考我这篇的回答

    虽然tabcontrol是直接引用tabitem的control。

    即便是你使用如下代码

    <Setter proerty="Control">
    <Setter.Value>
    <DataTemplate>
    <!--或者是相对绑定,即便是DataTemplate使用datatype指定TabItem-->
    <ContentControl Control="{Binding}" Visibility={Binding}/>
    </DataTemplate>
    </Setter.Value>
    </Setter>

    代码也是不起作用的

    因为tabcontrol是单独引用control的

    那么解决方案就是使用controlTemplate。

    我没有直接在你的代码中直接使用,但是如果你想借着你的代码修改可以直接放置到ControlTemplate的触发器结合中。

    我的代码如下

    <Window.Resources>
            <Style x:Key="c1" TargetType="TabItem">
                <Style.Triggers>
                    <!--关键代码 可以多写一个hidden-->
                        <DataTrigger Binding="{Binding Visibility,RelativeSource={RelativeSource Mode=Self} }" Value="Collapsed">
                        <Setter Property="ContentTemplate">
                            <Setter.Value>
                                <DataTemplate>
                                    <ContentControl Visibility="Collapsed" Content="{Binding}"/>
                                </DataTemplate>
                            </Setter.Value>
                        </Setter>
                    </DataTrigger>
                    <!--关键代码-->
                    <DataTrigger Binding="{Binding Visibility ,RelativeSource={RelativeSource Mode=Self} }" Value="Visible">
                        <Setter Property="ContentTemplate">
                            <Setter.Value>
                                <DataTemplate>
                                    <ContentControl Visibility="Visible" Content="{Binding}"/>
                                </DataTemplate>
                            </Setter.Value>
                        </Setter>
                    </DataTrigger>
                </Style.Triggers>
            </Style>
            <Style x:Key="t1" BasedOn="{StaticResource c1}" TargetType="TabItem">
                <Style.Triggers>
                    <DataTrigger Binding="{Binding ElementName=cb1,Path=IsChecked}" Value="true">
                        <Setter Property="Visibility" Value="Collapsed"/>
                    </DataTrigger>
                </Style.Triggers>
            </Style>
            <Style x:Key="t2" BasedOn="{StaticResource c1}" TargetType="TabItem">
                <Style.Triggers>
                    <DataTrigger Binding="{Binding ElementName=cb2,Path=IsChecked}" Value="true">
                        <Setter Property="Visibility" Value="Collapsed"/>
                    </DataTrigger>
                </Style.Triggers>
            </Style>
        </Window.Resources>
        <Grid >
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="auto"/>
                <ColumnDefinition Width="*"/>
            </Grid.ColumnDefinitions>
            <StackPanel>
                <CheckBox x:Name="cb1">
                    <CheckBox.Content>
                        <TextBlock>
                            <Run Text="Item1 状态:"/>
                            <Run Text="{Binding ElementName=item1,Path=Visibility,Mode=OneWay}"/>
                        </TextBlock>
                    </CheckBox.Content>
                </CheckBox>
                <CheckBox  x:Name="cb2">
                    <CheckBox.Content>
                        <TextBlock>
                            <Run Text="Item2 状态:"/>
                            <Run Text="{Binding ElementName=item2,Path=Visibility,Mode=OneWay}"/>
                        </TextBlock>
                    </CheckBox.Content>
                </CheckBox>
            </StackPanel>
            <TabControl Grid.Column="1"  >
                <TabItem Header="item1" x:Name="item1"  Style="{StaticResource t1}" >
                     
                    <Grid Background="Red">
                        
                    </Grid>
                </TabItem>
                <TabItem Header="item2"  x:Name="item2" Style="{StaticResource t2}">
                    <Grid  Background="Black">
    
                    </Grid>
                </TabItem>
            </TabControl>
        </Grid>


    2019年9月15日 14:43