WPF MahApps.Metro Tabcontrol data bound?

mahapps.metro, wpf

Solution

The DataTemplate for TabControl.ItemTemplate would be a TabItem already so no need to put that in.

This should work:

<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>

Problem

Well im trying to bind a TabControl to a datasource while using the MahApps.Metro style Window 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> ``` Codebehind: ``` /// <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; } } ``` This works some what but the TabControl looses some of its style (active selection style) and it gets hard to click a tab (you can't click it directly you have to click right in front of it), does any one have a solution for this problem?

Original source