与用户控件的标签项目的可关闭选项卡

问题描述：

我正在使用C＃WPF中的项目工作。我有一个标签容器，我想根据用户需要动态加载不同类型的标签到标签容器中。举个例子，我在做类似如下：与用户控件的标签项目的可关闭选项卡

tabContainer.Items.Add(new MyUserControl());

我想每个标签有一个关闭按钮，以便标签可以去掉容器，当用户不再需要它。

我发现this code project example，但从我看到你是一个加载用户控件，其中包含标签本身的xaml，而不是标签内容或我错过了什么。

如何将我的用户控件加载到选项卡容器中，但也可以将选项卡关闭。

目前，我装在标签使用了一些静态绑定使用以下设置分页标题：

<TabControl x:Name="tabContainer" Grid.Column="2" Margin="10,45,0,0" RenderTransformOrigin="0.5,0.55" Grid.ColumnSpan="3"> 
      <TabControl.Resources> 
       <Style TargetType="{x:Type TabItem}"> 
        <Setter Property="Header" Value="{Binding TabHeader}" /> 
       </Style> 
      </TabControl.Resources> 
     </TabControl>

我的用户控件，然后有一个'公共字符串TabHeader {获取;集;}它得到根据我的用户控件的构造函数使用，在构造函数中设置。

为什么downvote？ – Boardy

答

你将不得不自己定义的密切Button。例如，你可以做到这一点的TabItem的HeaderTemplate：

<TabControl x:Name="tabContainer"> 
    <TabControl.Resources> 
     <Style TargetType="{x:Type TabItem}"> 
      <Setter Property="Header" Value="{Binding TabHeader}" /> 
      <Setter Property="HeaderTemplate"> 
       <Setter.Value> 
        <DataTemplate> 
         <StackPanel Orientation="Horizontal"> 
          <TextBlock Text="{Binding}" /> 
          <Button Content="x" Click="Button_Click_2" 
              Tag="{Binding DataContext, RelativeSource={RelativeSource AncestorType=TabItem}}"/> 
         </StackPanel> 
        </DataTemplate> 
       </Setter.Value> 
      </Setter> 
     </Style> 
    </TabControl.Resources> 
</TabControl>

的Tag属性绑定到UserControl的Items集合，你可以在Button的单击事件处理程序删除，像这样的：

public partial class MainWindow : Window 
{ 
    public MainWindow() 
    { 
     InitializeComponent(); 
     tabContainer.Items.Add(new MyUserControl()); 
    } 

    private void Button_Click_2(object sender, RoutedEventArgs e) 
    { 
     Button button = sender as Button; 
     tabContainer.Items.Remove(button.Tag); 
    } 
}

真是太棒了，谢谢你。我从来没有设法使用'DataTemplates'完成你所能做的所有事情 – Boardy

答

如果您想为每个选项卡添加一个关闭按钮，那将是TabItem样式的ControlTemplate。通常情况下，您需要在Content中指定数据上下文（即仅驱动内容的数据，），然后在ContentTemplate中指定外观。如果你的内容是一个UserControl，那么你不指定ContentTemplate，因为UserControl知道如何绘制自己。

答

对于我的罪，我已经添加了关闭Tab键到WPF TabControl。我最终把关闭按钮放在ItemTemplate中。这里是与你填充的TabControl方式和头内容工作的最低版本：

<TabControl 
    > 
    <TabControl.Resources> 
     <Style TargetType="{x:Type TabItem}"> 
      <Setter Property="Header" Value="{Binding TabHeader}" /> 
     </Style> 
    </TabControl.Resources> 
    <TabControl.ItemTemplate> 
     <DataTemplate> 
      <Grid> 
       <Grid.ColumnDefinitions> 
        <ColumnDefinition Width="*" /> 
        <ColumnDefinition Width="Auto" /> 
       </Grid.ColumnDefinitions> 
       <Label 
        Content="{Binding}" 
        Grid.Column="0" 
        /> 
       <Button 
        VerticalAlignment="Center" 
        Grid.Column="1"> 
        <Path 
         Data="M 0, 0 L 12, 12 M 12,0 L 0,12" 
         Stroke="Red" 
         StrokeThickness="2" 
         Width="12" 
         Height="12" 
         /> 
       </Button> 
      </Grid> 
     </DataTemplate> 
    </TabControl.ItemTemplate> 
    <local:UserControl1 TabHeader="First Item" /> 
    <local:UserControl1 TabHeader="Second Item" /> 
</TabControl>

与用户控件的标签项目的可关闭选项卡

相关推荐