在 WPF HandyControl TabControl 中自定义下拉内容

Question

我正在使用 WPF HandyControl TabControl，当有太多选项卡无法容纳在可见区域中时，我想自定义下拉列表中显示的内容。目前，当选项卡宽度超过TabControl的可见区域时，显示的内容不是我所期望的。我尝试过使用 ItemTemplate 和 DropDownContentTemplate，但似乎没有得到所需的结果。

    <hc:TabControl
        IsAnimationEnabled="False"
        IsDraggable="False"
        IsTabFillEnabled="False"
        ItemsSource="{Binding DataSaves, UpdateSourceTrigger=PropertyChanged, Mode=TwoWay}"
        SelectedItem="{Binding SelectedDataSave, UpdateSourceTrigger=PropertyChanged, Mode=TwoWay}">
        <hc:TabControl.ItemTemplate>
            <DataTemplate>
                <StackPanel Orientation="Horizontal">
                    <TextBlock
                        Name="txt1"
                        Margin="6,0,0,0"
                        VerticalAlignment="Center"
                        Text="{Binding DisplayName}" />
                </StackPanel>
            </DataTemplate>
        </hc:TabControl.ItemTemplate>
        <hc:TabControl.ContentTemplate>
            <DataTemplate>
                <ContentPresenter Content="{Binding UserControl, UpdateSourceTrigger=PropertyChanged, Mode=TwoWay}" />
            </DataTemplate>
        </hc:TabControl.ContentTemplate>
    </hc:TabControl>

Answer 1

我建议使用 ComboBox + ContentControl 而不是 TabControl。

public interface IData
{
    string Label { get; }
}

public class DataWithList : IData
{
    public string Label {get; set;}
    public List<string> Items {get; set;}
}

public class DataWithStack : IData
{
    public string Label {get; set;}
    public Stack<string> Items {get; set;}
}

public class MyModel : INotifyPropertyChanged
{
    public event PropertyChangedEventHandler PropertyChanged; 

    public List<IData> Entries { get; set; }

    private IData m_selection;
    public IData Selection {
        get => m_selection; 
        set
        {
            m_selection = value;
            PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(nameof(Selection)));
        }
    }
}

在您的 WPF 中，

<ComboBox ItemsSource="{Binding Entries}" SelectedItem="{Binding Selection, UpdateSourceTrigger=PropertyChanged}">
      <ComboBox.ItemTemplate>
        <DataTemplate>
          <TextBox Text="{Binding Label}"/>
        </DataTemplate>
      </ComboBox.ItemTemplate>
</ComboBox>
<ContentControl Content="{Binding Selection}"/>

您可以使用 DataTemplate 或 DataTemplateSelector 定义内容模板

<DataTemplate DataType="{x:Type DataWithList}">
      <TextBlock Text="DataWithList"/>
</DataTemplate>
<DataTemplate DataType="{x:Type DataWithStack}">
      <TextBlock Text="DataWithStack"/>
</DataTemplate>