2009-06-01 3 views
2

У меня есть TabControl, где TabItem s - DataTemplat ed. Шаблон, похоже, работает правильно, так как пользовательский контроль, который я хочу показать в TabItem, отображается правильно.Как я могу получить кнопку закрытия шаблона TabItem в WPF?

Что я не уверен в том, как получить «x» для отображения в TabItem, чтобы я мог закрыть каждую вкладку, так как они динамически генерируются через шаблон.

Являясь довольно новым для WPF, я начинаю понимать многие концепции, но TabControl дал мне массу проблем, поэтому я могу очень хорошо работать с шаблоном, но не поддерживаемым.

Это то, что у меня есть, и я хотел был бы иметь возможность закрыть каждый 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> 

ответ

7

Ознакомьтесь с этой статьей 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> 
+2

Хотя я считаю, что это часть «Темных искусств», она работает после довольно много чтения и игры. Я уверен, что мне просто нужно привыкнуть к этому способу мышления, и просто нужно принять это как часть Winforms для изменения WPF. – Russ

+3

Интересно, почему он связал название TabItem с DisplayName, а не свойство заголовка TabItem. – Sam

+0

Простой и элегантный. Это было самое легкое решение, с которым я столкнулся и работал как шарм. –

0

вам нужно будет получить свой собственный элемент управления вкладкой. google search показывает много результатов, многие из них с источником, поэтому вам не нужно воссоздавать колесо.

0

Josh Smith написал статью для журнала MSDN с рабочим примером элементов табуляции, которые имеют близкие кнопки. Код основан на шаблоне MVVM, но вы должны иметь возможность извлекать соответствующие элементы из шаблона управления элементами вкладки.

У меня нет входа OpenID, поэтому я не мог опубликовать URL-адрес напрямую. Поиск в Google «josh smith mvvm demo app».

0

Не увлекайтесь нитью, но вы можете подумать, как выглядят уродливые вещи, когда каждые вкладка имеет кнопку закрытия. Если вы предпочитаете одну кнопку закрытия (a la Visual Studio), встроенную в сам TabControl, вы можете взглянуть на this blog post Я сделал, что делает это как часть образца (но не в центре внимания сообщения) ,

+3

Я слышал, что ваше высказывание, но я нахожу, что почти все tabed приложения я бегу accross, (IE, и FireFox является хорошим примером), есть возможность «x» из вкладки непосредственно на вкладке. Я лично считаю, что это приводит действие в контекст с контейнером. – Russ

+2

Достаточно честный. Скрытие кнопки до тех пор, пока пользователь не перевернется, наверняка смягчит уродство. –

+0

Это действительно то место, где я хочу закончить, но я делаю это за один шаг. – Russ

0

Просто столкнулся с тем. Я делаю 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}"/> 
+1

Ошибка: «Параметры FieldLayoutSettings не найдены на TabItem». Жаль, это выглядело хорошо. – Sam

+0

Не уверен, что это значит, но я узнал, что 'FieldLayoutSettings' часто ассоциируется с пространством имен' igDP', которое определяется как 'xmlns: igDP =" http://infragistics.com/DataPresenter "'. Надеюсь, что это поможет другим читателям. – rekire