[英]WPF Tabcontrol with expander functionality for tabitems
I'm very new to WPF but I'm trying to mix the functionality of both a tab control and expanders. 我是WPF的新手,但我正在尝试混合选项卡控件和扩展器的功能。
I want to be able to press each tab item which has an expander in the header, that will expand the content below. 我希望能够按下标题中包含扩展器的每个标签项,这将扩展下面的内容。 Almost like a normal tab, except that I should now be able to press that tab/expander and the tab control should be able to expand/collapse, to only show the tab headers.
几乎像普通的选项卡,除了我现在应该能够按下该选项卡/扩展器并且选项卡控件应该能够展开/折叠,以仅显示选项卡标题。
I can't get my head around to get the expand/collapse functionality to work, and the Tab control will always stay open like a normal one without expanders. 我无法理解扩展/折叠功能,并且Tab控件将始终像没有扩展器的普通控件一样保持打开状态。
At the moment my XAML looks like this: 目前我的XAML看起来像这样:
<TabControl>
<TabItem >
<TabItem.Header>
<Expander Header="One" IsHitTestVisible="False"
IsExpanded="{Binding IsSelected, RelativeSource={RelativeSource AncestorType={x:Type TabItem}}}" />
</TabItem.Header>
<TextBlock Background="Red"/>
</TabItem>
<TabItem>
<TabItem.Header>
<Expander Header="Two" IsHitTestVisible="False"
IsExpanded="{Binding IsSelected, RelativeSource={RelativeSource AncestorType={x:Type TabItem}}}" />
</TabItem.Header>
<TextBlock Background="Aqua" />
</TabItem>
</TabControl>
If I should go a completely another way to get the overall functionality, by all means, point me in that direction. 如果我应该采用另一种方式来获得整体功能,请务必指出我的方向。
This is the Simplest solution I can think of. 这是我能想到的最简单的解决方案。 and I'm still bit confused what u want
我仍然有点困惑你想要的东西
VM VM
private bool myVar;
public bool ShowItem
{
get { return myVar; }
set { myVar = value; OnPropertyChanged("ShowItem"); }
}
private void TabControl_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
ShowItem = true;
}
private void Expander_PreviewMouseLeftButtonUp(object sender, MouseButtonEventArgs e)
{
ShowItem = !ShowItem;
}
<TabControl SelectionChanged="TabControl_SelectionChanged">
<TabItem PreviewMouseLeftButtonDown="Expander_PreviewMouseLeftButtonUp" >
<TabItem.Header>
<Expander Header="One" IsHitTestVisible="False"
IsExpanded="{Binding ShowItem}" />
</TabItem.Header>
<TextBlock Background="Red" >
<TextBlock.Style>
<Style TargetType="TextBlock">
<Setter Property="Visibility" Value="Collapsed"></Setter>
<Style.Triggers>
<DataTrigger Binding="{Binding ShowItem}" Value="True">
<Setter Property="Visibility" Value="Visible"></Setter>
</DataTrigger>
</Style.Triggers>
</Style >
</TextBlock.Style>
</TextBlock>
</TabItem>
<TabItem PreviewMouseLeftButtonDown="Expander_PreviewMouseLeftButtonUp">
<TabItem.Header>
<Expander Header="Two" IsHitTestVisible="False"
IsExpanded="{Binding ShowItem}" />
</TabItem.Header>
<TextBlock Background="Aqua" >
<TextBlock.Style>
<Style TargetType="TextBlock">
<Setter Property="Visibility" Value="Collapsed"></Setter>
<Style.Triggers>
<DataTrigger Binding="{Binding ShowItem}" Value="True">
<Setter Property="Visibility" Value="Visible"></Setter>
</DataTrigger>
</Style.Triggers>
</Style >
</TextBlock.Style>
</TextBlock>
</TabItem>
</TabControl>
Instead of style, u can use converter also try this once and let me know if im missing anything 而不是风格,你可以使用转换器也尝试这一次,让我知道,如果我错过任何东西
Based on Comment 根据评论
<TabItem>
<TabItem.Header>
<StackPanel Background="Transparent" PreviewMouseLeftButtonDown="Expander_PreviewMouseLeftButtonUp">
<Expander Header="One" IsHitTestVisible="False" PreviewMouseLeftButtonDown="Expander_PreviewMouseLeftButtonUp"
IsExpanded="{Binding ShowItem}" />
</StackPanel>
</TabItem.Header>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.