代码之家 › 专栏 › 技术社区 › CasualNobody

公开UserControls内容模板

dependency-properties data-binding wpf c#

CasualNobody · 技术社区 · 7 年前

我正在尝试用C语言制作我的第一个用户控件。这是一种生活质量有所改善的TabControll。目标是能够在各种项目中使用它,因此它必须尽可能通用。

到目前为止,我已经通过DependencyProperty公开了ItemSource。但我不知道如何对ContentTemplate属性进行同样的处理。

以下是我迄今为止的代码示例:

XAML:

<UserControl ...>
    <UserControl.Resources>
        <!-- some styles and templates -->
    </UserControl.Resources>
    <TabControl ItemsSource="{Binding ItemsSource}" SelectedIndex="{Binding selectedIndex}"
            Style="{StaticResource FixatedTabControl}" ItemTemplateSelector="{StaticResource myDataTemplateSelector}"/>
</UserControl>

背后的代码:

public partial class DynamicTabControl : UserControl, INotifyPropertyChanged
{
    public DynamicTabControl()
        {
            InitializeComponent();
            this.DataContext = this;
        }

        public static readonly DependencyProperty ItemsSourceProperty =
            DependencyProperty.Register("ItemsSource", typeof(IEnumerable<ITabItem>), typeof(DynamicTabControl));
        public IEnumerable<ITabItem> ItemsSource
        {
            get { return (IEnumerable<ITabItem>)GetValue(ItemsSourceProperty); }
            set { SetValue(ItemsSourceProperty, value); }
        }
}

我可以这样使用DynamicTabControl:

<Window x:Class="Demo.MainWindow"
        ...            
        xmlns:local="clr-namespace:Demo"
        xmlns:foo="clr-namespace:DynamicTabUserControl"
        mc:Ignorable="d"
        Title="MainWindow" Height="350" Width="525">
    <Grid>
        <foo:DynamicTabControl x:Name="testTabContr" ItemsSource="{Binding data}">

        </foo:DynamicTabControl>
    </Grid>
</Window>

但是,我如何才能更改/添加UserControl的TabControl的contentTemplate呢? 我希望它表现得像这样:

<Window x:Class="Demo.MainWindow"
            ...            
            xmlns:local="clr-namespace:Demo"
            xmlns:foo="clr-namespace:DynamicTabUserControl"
            mc:Ignorable="d"
            Title="MainWindow" Height="350" Width="525">
        <Grid>
            <foo:DynamicTabControl x:Name="testTabContr" ItemsSource="{Binding data}">
               <foo:DynamicTabControl.TabControl.ContentTemplate>
                   <DataTemplate>
                      <TextBox Text="{Binding someData}"/>
                   </DataTemplate>
               </foo:DynamicTabControl.TabControl.ContentTemplate>
            </foo:DynamicTabControl>
        </Grid>
    </Window>

我还在学习,请帮帮我。提前谢谢你。

1 回复 | 直到 7 年前

mm8 7 年前

将另一个依存关系属性添加到 UserControl :

public partial class DynamicTabControl : UserControl, INotifyPropertyChanged
{
    public DynamicTabControl()
    {
        InitializeComponent();
    }

    public static readonly DependencyProperty ItemsSourceProperty =
        DependencyProperty.Register("ItemsSource", typeof(IEnumerable<ITabItem>), typeof(DynamicTabControl));
    public IEnumerable<ITabItem> ItemsSource
    {
        get { return (IEnumerable<ITabItem>)GetValue(ItemsSourceProperty); }
        set { SetValue(ItemsSourceProperty, value); }
    }

    public static readonly DependencyProperty TabContentTemplateProperty =
        DependencyProperty.Register("TabContentTemplate", typeof(DataTemplate), typeof(DynamicTabControl));

    public DataTemplate TabContentTemplate
    {
        get { return (DataTemplate)GetValue(TabContentTemplateProperty); }
        set { SetValue(TabContentTemplateProperty, value); }
    }
}

...并与之绑定:

<UserControl>
    <UserControl.Resources>
        <!-- some styles and templates -->
    </UserControl.Resources>
    <TabControl ItemsSource="{Binding ItemsSource, RelativeSource={RelativeSource AncestorType=UserControl}}"
                Style="{StaticResource FixatedTabControl}"
                ContentTemplate="{Binding TabContentTemplate, RelativeSource={RelativeSource AncestorType=UserControl}}"/>
</UserControl>

然后,可以在窗口的XAML标记中设置此属性:

<foo:DynamicTabControl x:Name="testTabContr" ItemsSource="{Binding data}">
    <foo:DynamicTabControl.TabContentTemplate>
        <DataTemplate>
            <TextBox Text="{Binding someData}"/>
        </DataTemplate>
    </foo:DynamicTabControl.TabContentTemplate>
</foo:DynamicTabControl>