开发者

tab control data template

开发者 https://www.devze.com 2023-02-09 07:08 出处:网络
I want a TabControl where each tab item represents a (Employee)ViewModel; the header should be the DisplayName property of that view model, and the content should be a user control (EmployeeDetailsVie

I want a TabControl where each tab item represents a (Employee)ViewModel; the header should be the DisplayName property of that view model, and the content should be a user control (EmployeeDetailsView) that has a data context of the view model.

So pidgeon xaml (is there such a thing??):

<TabControl x:Name="Items">
    <TabItem Header="DisplayName" Content=local:EmployeeDetailsView />
<TabControl>

What should my re开发者_高级运维al XAML look like?

Cheers,

Berryl

EDIT for Vortex

        <TabControl x:Name="Items" >
            <TabControl.ItemTemplate>
                <DataTemplate>
                    <TextBlock Text="{Binding DisplayName}" />
                </DataTemplate>
            </TabControl.ItemTemplate>
            <TabControl.ContentTemplate>
                <DataTemplate>
                    <ContentControl>
                        <local:EmployeeDetailView/>
                    </ContentControl>
                </DataTemplate>
            </TabControl.ContentTemplate>
         </TabControl>


In WPF it is quite simple. But in silverlight I used custom TabControl.

Silverlight

You can find source and example here (MyTabControl.cs), where I've answered a similar question.

And now your code must be something like:

<my:MyTabControl x:Name="myTabs" MyItemsSource="{Binding Items}" MySelectedItem="{Binding SelectedItem}" >
    <my:MyTabControl.TabHeaderItemTemplate>
        <DataTemplate>
            <TextBlock Text="{Binding DisplayName}" />
        </DataTemplate>
    </my:MyTabControl.TabHeaderItemTemplate>
    <my:MyTabControl.TabItemTemplate>
        <DataTemplate>
            <local:EmployeeDetailsView />
        </DataTemplate>
    </my:MyTabControl.TabItemTemplate>
</my:MyTabControl> 

In code-behind or somewhere:

var items = new List<Employee>(){
                new Employee{DisplayName = "Employee 1"},
                new Employee{DisplayName = "Employee 2"}};

myTabs.DataContext = new SomeCollectionModel
{
      Items = items,
      SelectedItem = items[0]
};

WPF

WPF has built-in support of DataTemplates in the TabControl, so I have to do a few minor changes in XAML:

<TabControl x:Name="myTabs" ItemsSource="{Binding Items}" SelectedItem="{Binding SelectedItem}">
    <TabControl.ItemTemplate>
        <DataTemplate>
            <TextBlock Text="{Binding DisplayName}" />
        </DataTemplate>
    </TabControl.ItemTemplate>
    <TabControl.ContentTemplate>
        <DataTemplate>
            <local:EmployeeDetailsView />
        </DataTemplate>
    </TabControl.ContentTemplate>
</TabControl>
0

精彩评论

暂无评论...
验证码 换一张
取 消