Представление TabControl не обновляется при изменении шаблона

Question

Мне нужно изменить представление содержимого TabControl на лету .
Я предполагаю, что лучший способ сделать это - определить представление как DataTemplate, а затем изменитьШаблон с использованием триггера.

В моем тестовом приложении цвет фона привязан к тому же триггеру данных, что и шаблон. Цвет фона обновляется сразу после выбора переключателя.

• Ожидаемое поведение: Элемент Tab Content / DataTemplate также обновляется немедленно.
• Фактическое поведение: представление содержимого вкладки не обновляется, пока не будет изменен выбор вкладки.

Вот мой пример Минимальный, Полный и Проверяемый :

Окно XAML

<Window x:Class="ChangeView.Window1"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        Title="Window1" Height="350" Width="400">
    <Window.Resources>
        <DataTemplate x:Key="ContentTemplate1">
            <Grid>
                <Label HorizontalAlignment="Center" VerticalAlignment="Center" Content="{Binding MyBlurb}"/>
            </Grid>
        </DataTemplate>

        <DataTemplate x:Key="ContentTemplate2">
            <Grid>
                <Label HorizontalAlignment="Stretch" VerticalAlignment="Stretch" 
                       HorizontalContentAlignment="Center" VerticalContentAlignment="Center"
                       Content="{Binding MyHeader}" Background="Black" Foreground="White" FontSize="72"/>
            </Grid>
        </DataTemplate>
    </Window.Resources>

    <Grid>
        <Grid.Style>
            <Style TargetType="{x:Type Grid}">
                <Style.Triggers>
                    <DataTrigger Binding="{Binding ViewType1}" Value="False">
                        <Setter Property="Background" Value="Chartreuse"/>
                    </DataTrigger>
                    <DataTrigger Binding="{Binding ViewType1}" Value="True">
                        <Setter Property="Background" Value="Bisque"/>
                    </DataTrigger>
                </Style.Triggers>
            </Style>
        </Grid.Style>
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition/>
        </Grid.RowDefinitions>

        <TextBlock Margin="10,38,0,0" Text="Content Template:"/>
        <RadioButton x:Name="radio1" Margin="120,40,0,0" Grid.ColumnSpan="2" Content="1" GroupName="ViewSelect" IsChecked="{Binding Path=ViewType1}"/>
        <RadioButton Margin="170,40,0,0" Grid.ColumnSpan="2" Content="2" GroupName="ViewSelect"/>

        <TabControl Grid.Row="1" ItemsSource="{Binding TabGroup}">
            <TabControl.Style>
                <Style TargetType="{x:Type TabControl}">
                    <Setter Property="Margin" Value="10"/>
                    <Style.Triggers>
                        <DataTrigger Binding="{Binding ViewType1}" Value="True">
                            <Setter Property="ContentTemplate" Value="{DynamicResource ContentTemplate1}"/>
                        </DataTrigger>
                        <DataTrigger Binding="{Binding ViewType1}" Value="False">
                            <Setter Property="ContentTemplate" Value="{DynamicResource ContentTemplate2}"/>
                        </DataTrigger>
                    </Style.Triggers>
                </Style>
            </TabControl.Style>
            <TabControl.ItemTemplate>
                <DataTemplate>
                    <Border x:Name="headerBorder">
                        <Label Content="{Binding MyHeader}" FontSize="20"/>
                    </Border>
                </DataTemplate>
            </TabControl.ItemTemplate>
        </TabControl>
    </Grid>
</Window>

Код сзади

namespace ChangeView
{
    using System.Windows;
    using System.ComponentModel;
    using System.Collections.ObjectModel;

    /// <summary>
    /// Interaction logic for Window1.xaml
    /// </summary>
    public partial class Window1 : Window, INotifyPropertyChanged
    {
        public ObservableCollection<TabData> TabGroup { get; set; } = new ObservableCollection<TabData>();

        private bool _viewType1 = true;
        public bool ViewType1
        {
            get { return _viewType1; }
            set { _viewType1 = value; RaisePropertyChanged(nameof(ViewType1)); }
        }

        public Window1()
        {
            TabGroup.Add(new TabData("♻️", "Recycle"));
            TabGroup.Add(new TabData("⚔", "Swords"));
            TabGroup.Add(new TabData("⚗", "Chemistry"));
            TabGroup.Add(new TabData("?", "Cactus"));
            TabGroup.Add(new TabData("?", "Tengu"));
            TabGroup.Add(new TabData("?", "Octopus"));

            DataContext = this;
            InitializeComponent();
        }

        public event PropertyChangedEventHandler PropertyChanged = delegate { };
        private void RaisePropertyChanged(string propName)
        {
            PropertyChanged(this, new PropertyChangedEventArgs(propName));
        }
    }

    public class TabData : INotifyPropertyChanged
    {
        private string _myHeader, _myBlurb;

        public TabData(string header, string blurb)
        {
            MyHeader = header;
            MyBlurb = blurb;
        }

        public string MyHeader
        {
            get { return _myHeader; }
            set { _myHeader = value; RaisePropertyChanged(nameof(MyHeader)); }
        }

        public string MyBlurb
        {
            get { return _myBlurb; }
            set { _myBlurb = value; RaisePropertyChanged(nameof(MyBlurb)); }
        }

        public event PropertyChangedEventHandler PropertyChanged = delegate { };
        private void RaisePropertyChanged(string propName)
        {
            PropertyChanged(this, new PropertyChangedEventArgs(propName));
        }
    }
}

Answer 1

После изменения состояния переключателя измените выбранную вкладку. Затем вы увидите правильный шаблон содержимого.

Похоже, что в TabControl изменение только одного шаблона содержимого не приводит к его отображению. Если вы визуализируете новый контент, переключая выбранную вкладку, будет использоваться текущий шаблон контента.

Итак, давайте напишем один ContentTemplate, который создает ContentControl и переключает ContentTemplate ContentControl. Я протестировал, и ContentControl будет повторно визуализировать свой контент, когда его ContentTemplate изменится. Привязки становятся немного многословными.

<TabControl ItemsSource="{Binding TabGroup}" Grid.Row="1">
    <TabControl.ContentTemplate>
        <DataTemplate>
            <ContentControl
                x:Name="ContentCtl"
                Content="{Binding}"
                />
            <DataTemplate.Triggers>
                <DataTrigger 
                    Binding="{Binding DataContext.ViewType1, RelativeSource={RelativeSource AncestorType=TabControl}}" 
                    Value="True">
                    <Setter 
                        TargetName="ContentCtl" 
                        Property="ContentTemplate" 
                        Value="{DynamicResource ContentTemplate1}"
                        />
                </DataTrigger>
                <DataTrigger 
                    Binding="{Binding DataContext.ViewType1, RelativeSource={RelativeSource AncestorType=TabControl}}" 
                    Value="False"
                    >
                    <Setter 
                        TargetName="ContentCtl" 
                        Property="ContentTemplate" 
                        Value="{DynamicResource ContentTemplate2}"
                        />
                </DataTrigger>
            </DataTemplate.Triggers>
        </DataTemplate>
    </TabControl.ContentTemplate>
    <TabControl.ItemTemplate>
        <DataTemplate>
            <Border x:Name="headerBorder">
                <Label Content="{Binding MyHeader}" FontSize="20"/>
            </Border>
        </DataTemplate>
    </TabControl.ItemTemplate>
</TabControl>

Вы также можете сделать что-то уродливое в своем коде, чтобы заставить TabControl снова визуализироваться по команде. Или, может быть, вы можете заменить метаданные на TabControl.ContentTemplate.