WPF MahApps.Metro Tabcontrol数据绑定？

Question

我试图在使用MahApps.Metro样式时将TabControl绑定到数据源

窗口xaml:

<Controls:MetroWindow x:Class="WpfApplication1.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:Controls="clr-namespace:MahApps.Metro.Controls;assembly=MahApps.Metro"
        Title="MainWindow" Height="350" Width="525">
    <Window.Resources>
        <ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>
                <ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Colours.xaml" />
                <ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Fonts.xaml" />
                <ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Controls.xaml" />
                <ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Accents/Blue.xaml" />
                <ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Accents/BaseLight.xaml" />
                <ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Controls.AnimatedSingleRowTabControl.xaml" />
            </ResourceDictionary.MergedDictionaries>
        </ResourceDictionary>
    </Window.Resources>
    <TabControl ItemsSource="{Binding Collection}">
        <TabControl.ItemTemplate>
            <DataTemplate>
                <TabItem Header="{Binding Title}">
                    <ContentControl Content="{Binding Content}" />
                </TabItem>
            </DataTemplate>
        </TabControl.ItemTemplate>
    </TabControl>
</Controls:MetroWindow>

代码隐藏:

/// <summary>
/// Interaction logic for MainWindow.xaml
/// </summary>
public partial class MainWindow : MetroWindow
{
    public MainWindow()
    {
        InitializeComponent();
        Collection = new ObservableCollection<Item>() 
            {
                new Item("Test1", 1),
                new Item("Test2", 2),
                new Item("Test3", 3)
            };
        this.DataContext = this;
    }

    public ObservableCollection<Item> Collection
    { get; set; }
}

除了TabControl失去了它的一些样式(主动选择样式)之外,它可以解决一些问题而且很难点击一个标签(你不能直接点击它就必须在它前面点击它),是否有人有解决方案对于这个问题？

Answer 1

TabControl.ItemTemplate的DataTemplate已经是一个TabItem,因此无需将其放入.

这应该工作:

<TabControl ItemsSource="{Binding Collection}">
    <TabControl.ItemTemplate>
        <DataTemplate>
            <TextBlock Text="{Binding Title}"/>
        </DataTemplate>
    </TabControl.ItemTemplate>
    <TabControl.ContentTemplate>
        <DataTemplate>
            <TextBlock Text="{Binding Content}" />
        </DataTemplate>
    </TabControl.ContentTemplate>
</TabControl>