处理 WPF TabItems Visibility 属性

Handling WPF TabItems Visibility property

提问by aioracle

I have been reading about Visibility.Collapsedfor TabItems. When the Visibilityis set to Collapsed, the TabItemheader is hidden but the contents are still visible.

我一直在阅读有关Visibility.Collapsed的TabItems。当Visibility设置为 时Collapsed，TabItem标题被隐藏，但内容仍然可见。

I have also tried the following approch mentioned in here, but no luck.

我也尝试过这里提到的以下方法，但没有运气。

Is there any way to get the contents inside the TabItemsto hide and also select the tab that is visible.

有没有办法让里面的内容TabItems隐藏并选择可见的选项卡。

回答by Federico Berasategui

You don't need any of that. Conceptually, a TabControlis just a graphical representation of an ObservableCollection<ViewModel>, where each viewmodel is represented by a tab item, and there's only 1 SelectedItemat a given time:

你不需要任何这些。从概念上讲， aTabControl只是 an 的图形表示ObservableCollection<ViewModel>，其中每个视图模型由一个选项卡项表示，并且SelectedItem在给定时间只有 1个：

<Window x:Class="WpfApplication4.Window12"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="Window12" Height="300" Width="300">
    <Window.Resources>
        <BooleanToVisibilityConverter x:Key="BoolToVisibilityConverter"/>
    </Window.Resources>
        <TabControl ItemsSource="{Binding Items}" SelectedItem="{Binding SelectedItem}">
            <TabControl.ItemContainerStyle>
                <Style TargetType="TabItem">
                    <Setter Property="IsEnabled" Value="{Binding IsEnabled}"/>
                    <Setter Property="Visibility" Value="{Binding IsVisible, Converter={StaticResource BoolToVisibilityConverter}}"/>
                    <Setter Property="Header" Value="{Binding Title}"/>
                </Style>
            </TabControl.ItemContainerStyle>
        </TabControl>
</Window>

Code Behind:

背后的代码：

using System.Windows;
using BaseFramework.MVVM;
using System.Collections.ObjectModel;

namespace WpfApplication4
{
    public partial class Window12 : Window
    {
        public Window12()
        {
            InitializeComponent();
            DataContext = new TabbedViewModel()
                          {
                              Items =
                                  {
                                      new TabViewModel() {Title = "Tab #1", IsEnabled = true, IsVisible = true},
                                      new TabViewModel() {Title = "Tab #2", IsEnabled = false, IsVisible = true},
                                      new TabViewModel() {Title = "Tab #3", IsEnabled = true, IsVisible = false},
                                  }
                          };
        }
    }

ViewModel:

视图模型：

    public class TabbedViewModel: ViewModelBase
    {
        private ObservableCollection<TabViewModel> _items;
        public ObservableCollection<TabViewModel> Items
        {
            get { return _items ?? (_items = new ObservableCollection<TabViewModel>()); }
        }

        private ViewModelBase _selectedItem;
        public ViewModelBase SelectedItem
        {
            get { return _selectedItem; }
            set
            {
                _selectedItem = value;
                NotifyPropertyChange(() => SelectedItem);
            }
        }
    }

    public class TabViewModel: ViewModelBase
    {
        private string _title;
        public string Title
        {
            get { return _title; }
            set
            {
                _title = value;
                NotifyPropertyChange(() => Title);
            }
        }

        private bool _isEnabled;
        public bool IsEnabled
        {
            get { return _isEnabled; }
            set
            {
                _isEnabled = value;
                NotifyPropertyChange(() => IsEnabled);
            }
        }

        private bool _isVisible;
        public bool IsVisible
        {
            get { return _isVisible; }
            set
            {
                _isVisible = value;
                NotifyPropertyChange(() => IsVisible);
            }
        }
    }
}

Then, its just a matter of inheriting TabViewModelfor each one of your tabs (creating the appropiate logic inside of each), and a proper DataTemplatefor each one of these derived classes in the app.xamlor something.

然后，它只是继承TabViewModel每个选项卡的问题（在每个选项卡中创建适当的逻辑），并DataTemplate为这些派生类中的每个派生类进行适当的处理app.xaml。

Whenever you want to remove a tab item from the view, instead of manipulating the view you manipulate the ViewModel. this is the WPF approach for everything. It simplifies everything by removing the need to manipulate complex objects (UI elements) in code. Whenever you set

每当您想从视图中删除选项卡项时，您都可以操作 ViewModel，而不是操作视图。这是适用于一切的 WPF 方法。它消除了在代码中操作复杂对象（UI 元素）的需要，从而简化了一切。每当你设置

TabbedViewModel.SelectedItem.IsVisible = false;, make sure you also do:

TabbedViewModel.SelectedItem.IsVisible = false;，请确保您还执行以下操作：

TabbedViewModel.SelectedItem = TabbedViewModel.Items.First(x => x.IsVisible && x.IsEnabled);

TabbedViewModel.SelectedItem = TabbedViewModel.Items.First(x => x.IsVisible && x.IsEnabled);

This will prevent you from ever falling into the case of having an invisible tab item as the selected item.

这将防止您陷入将不可见的选项卡项目作为所选项目的情况。

回答by yo chauhan

Hi just Add and Remove the TabItems from TabControl instead of setting Visibility. There is one more issue with Turning on and off the Visibility and it is exception like Out of index when you scroll or minimize or resize the TabControl.

嗨，只需从 TabControl 添加和删除 TabItems 而不是设置可见性。打开和关闭可见性还有一个问题，当您滚动、最小化或调整 TabControl 的大小时，它会出现索引不足等异常。