2011-02-09 4 views
1

Я хочу элемент управления TabControl, где каждый элемент табуляции представляет (Viewer) Employee ViewModel; заголовок должен быть свойством DisplayName этой модели представления, а контент должен быть пользовательским элементом управления (EmployeeDetailsView), который имеет контекст данных модели представления.tab control data template

Так стендовая XAML (есть такая вещь ??):

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

Что должен мой реальный XAML выглядеть?

Cheers,
Berryl

EDIT для 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> 

ответ

3

В WPF это довольно просто. Но в silverlight я использовал пользовательский TabControl.

Silverlight

Вы можете найти источник и пример here (MyTabControl.cs), где я отвечал на подобный вопрос.

И теперь ваш код должен быть что-то вроде:

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

В фоновом коде или где-то:

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 имеет встроенную поддержку DataTemplates в TabControl, поэтому мне нужно сделать несколько незначительных изменений в 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

Awesome. Должен ли я иметь пользовательский элемент EmployeeDetailsView как ресурс где-нибудь (он находится в xmlns с псевдонимом «локальный»)? Я не могу напрямую привязываться к нему – Berryl

+0

О, я вижу. Я могу просто вставить его в элемент управления контентом декларативно: Berryl

+0

@Berryl EmployeeDetailsView является свойством ViewModel и предполагается, что он будет создан в коде. Например, элементы [0] .EmployeeDetailsView = new SomeUserControlView(); Также вы можете получить от ресурса, this.Resources "controlResourceKey" – vorrtex