Question

我有一个TabControl，其中TabItem是DataTemplat。该模板似乎工作正常，因为我要在TabItem中显示的用户控件正确显示。

我不确定如何在TabItem中显示“x”以便我可以关闭每个标签，因为它们是通过模板动态生成的。

作为WPF的新手，我开始接受许多概念，但TabControl给了我很多麻烦，所以我很可能让模板可行，但不能维护。< / p>

这就是我所拥有的，我希望能够关闭每个TabControl。我还需要能够在TabControl关闭时触发自定义事件。

<UserControl x:Class="Russound.Windows.UI.UserControls.CallLog.CaseReaderWpf"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:CallLog="clr-namespace:Russound.Windows.UI.UserControls.CallLog"
    Height="637" Width="505">

    <UserControl.Resources>
        <ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>
                <ResourceDictionary Source="/Russound.Windows;component/UI/RussoundDictionary.xaml"/>
            </ResourceDictionary.MergedDictionaries>
        </ResourceDictionary>
    </UserControl.Resources>

    <TabControl x:Name="tabCases" >
        <TabControl.ItemTemplate>
            <DataTemplate DataType="{x:Type TabItem}">
                <StackPanel>
                    <TextBlock Text="{Binding Path=Id}" />
                </StackPanel>
            </DataTemplate>
        </TabControl.ItemTemplate>
        <TabControl.ContentTemplate>
            <DataTemplate DataType="{x:Type TabItem}">
                <CallLog:CaseReadOnlyDisplay DataContext="{Binding}" />
            </DataTemplate>
        </TabControl.ContentTemplate>
    </TabControl>
</UserControl>

Answer 1

查看Josh Smith的这篇MSDN文章。这是一个很好的解决方案。

<强> WPF Apps With The Model-View-ViewModel Design Pattern

http://msdn.microsoft.com/en-us/magazine/dd419663.aspx

<!-- 
This template explains how to render 
a tab item with a close button.
-->
<DataTemplate x:Key="ClosableTabItemTemplate">
<DockPanel Width="120">
  <Button 
    Command="{Binding Path=CloseCommand}"
    Content="X"
    Cursor="Hand"
    DockPanel.Dock="Right"
    Focusable="False"
    FontFamily="Courier" 
    FontSize="9"
    FontWeight="Bold"  
    Margin="0,1,0,0"
    Padding="0"
    VerticalContentAlignment="Bottom"
    Width="16" Height="16" 
    />
  <ContentPresenter 
    Content="{Binding Path=DisplayName}" 
    VerticalAlignment="Center" 
    />
</DockPanel>
</DataTemplate>

<!--
This template explains how to render the 'Workspace' content area in the main window.
-->
<DataTemplate x:Key="WorkspacesTemplate">
<TabControl 
  IsSynchronizedWithCurrentItem="True" 
  ItemsSource="{Binding}" 
  ItemTemplate="{StaticResource ClosableTabItemTemplate}"
  Margin="4"
  />
</DataTemplate>

Answer 2

您必须派生自己的标签控件。 google search显示了许多结果，其中许多都有源，所以你不必重新创建轮子。

Answer 3

Josh Smith为MSDN杂志撰写了一篇文章，其中包含了具有关闭按钮的标签项的工作示例。代码基于MVVM模式，但您应该能够从选项卡项控件模板中提取相关部分。

我没有OpenID登录信息，因此无法直接发布该网址。 Google搜索“josh smith mvvm demo app”。

Answer 4

不要劫持线程，但是当每个选项卡都有一个关闭按钮时，你可能想要考虑一下看起来有多丑。如果您更喜欢集成到TabControl本身的单个关闭按钮（一个Visual Studio），您可以查看我做过的this blog post，这样做是示例的一部分（但是不是帖子的重点）。

Answer 5

刚碰到那一个。我正在做MVVM，但使用表单事件非常类似。无论如何，我使用ItemContainerStyle参数并将其指向具有数据类型限定符的样式，如下所示：

  <Style x:Key="TabHeader" TargetType="TabItem">
        <Setter Property="FieldLayoutSettings">
            <Setter.Value>
                <StackPanel Orientation="Horizontial">
                    <TextBlock Text="{Binding HeaderText}"/>
                    <!-- MVVM style -->
                    <Button Content="X" Command="{Binding [ICommandHere]}" />
                    <!--or... Forms style -->    
                    <Button Content="X" Click="EventHandlerHere" />
             </StackPanel>
            </Setter.Value>
            </Setter> 
    </Style>

<TabControl ItemsSource="{Binding Workspaces}"
            ItemContainerStyle="{StaticResource TabHeader}"/>

如何在WPF中的模板化TabItem上获得关闭按钮？

5 个答案: