TabControl的使用添加新标签页按钮（+） [英] TabControl with Add New Tab Button (+)

问题描述

什么是在WPF中？

1. 应该正确地多标签标题行工作。


2. 这应该是在所有选项卡项目的结束


3. 标签骑自行车应能正常工作（<大骨节病>替代 + <大骨节病>标签），也就是 + 标签应该忽略


4. 我不应该修改的源集合，我结合。也就是说，控制应该是可重复使用的。


5. 解决方案应与工作 MVVM

1. It should work correctly with multiple tab header rows.
2. It should be at the end of all tab items
3. Tab cycling should work correctly (Alt + Tab), that is, the + tab should be skipped.
4. I shouldn't have to modify the source collection I am binding to. That is, the control should be reusable.
5. The solution should work with MVVM

要更precise，按钮应完全相同作为一个额外的最后一个标签，而不是作为一个单独的按钮上的所有标签带行权的某个地方。

To be more precise, the button should appear exactly as an additional last tab and not as a separate button somewhere on the right of all tab strip rows.

我只是找一般的方法来这样做。

I am just looking for the general approach to doing this.

谷歌抛出的例子很多，但如果你深入其中的一个深一点没有满足所有上述五点。

Google throws many examples, but if you dig a little deep none of them satisfy all the above five points.

推荐答案

使用IEditableCollectionView一个几乎完整的解决方案：

An almost complete solution using IEditableCollectionView:

ObservableCollection<ItemVM> _items;
public ObservableCollection<ItemVM> Items
{
    get
    {
        if (_items == null)
        {
            _items = new ObservableCollection<ItemVM>();
            var itemsView = (IEditableCollectionView)CollectionViewSource.GetDefaultView(_items);
            itemsView.NewItemPlaceholderPosition = NewItemPlaceholderPosition.AtEnd;
        }

        return _items;
    }
}

private DelegateCommand<object> _newCommand;
public DelegateCommand<object> NewCommand
{
    get
    {
        if (_newCommand == null)
        {
            _newCommand = new DelegateCommand<object>(New_Execute);
        }

        return _newCommand;
    }
}

private void New_Execute(object parameter)
{
    Items.Add(new ItemVM());
}

<DataTemplate x:Key="newTabButtonContentTemplate">
    <Grid/>
</DataTemplate>

<DataTemplate x:Key="newTabButtonHeaderTemplate">
    <Button Content="+"
        Command="{Binding ElementName=parentUserControl, Path=DataContext.NewCommand}"/>
</DataTemplate>

<DataTemplate x:Key="itemContentTemplate">
    <Grid/>
</DataTemplate>

<DataTemplate x:Key="itemHeaderTemplate">
    <TextBlock Text="TabItem_test"/>
</DataTemplate>

<vw:TemplateSelector x:Key="headerTemplateSelector"
                           NewButtonTemplate="{StaticResource newTabButtonHeaderTemplate}"
                           ItemTemplate="{StaticResource itemHeaderTemplate}"/>

<vw:TemplateSelector x:Key="contentTemplateSelector"
                            NewButtonTemplate="{StaticResource newTabButtonContentTemplate}"
                            ItemTemplate="{StaticResource itemContentTemplate}"/>

<TabControl ItemsSource="{Binding Items}"
        ItemTemplateSelector="{StaticResource headerTemplateSelector}"
        ContentTemplateSelector="{StaticResource contentTemplateSelector}"/>

public class TemplateSelector : DataTemplateSelector
{
    public DataTemplate ItemTemplate { get; set; }
    public DataTemplate NewButtonTemplate { get; set; }

    public override DataTemplate SelectTemplate(object item, DependencyObject container)
    {
        if (item == CollectionView.NewItemPlaceholder)
        {
            return NewButtonTemplate;
        }
        else
        {
            return ItemTemplate;
        }
    }
}

Enter code here

这是几乎完全的，因为标签周期不会跳过'+'标签，将显示空内容（这不完全是伟大的，但我可以住在一起，直到一个更好的解决办法过来......）。

It's almost complete, because the tab cycle doesn't skip the '+' tab, and will show empty content (which is not exactly great, but I can live with it until a better solution come around...).

这篇关于TabControl的使用添加新标签页按钮（+）的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！