在WPF中数据绑定TabControl时,如何使用自定义TabItem控件?

时间:2009-06-01 19:12:45

标签: wpf .net-3.5 user-interface styles itemtemplate

我有一个源自TabItem的自定义控件,我想将该自定义TabItem数据绑定到股票TabControl。我宁愿避免为这种罕见的情况创建一个新的TabControl

这就是我所拥有的,并且我没有运气得到正确的控件来加载。在这种情况下,我想使用我的ClosableTabItem控件而不是库存TabItem控件。

<TabControl x:Name="tabCases" IsSynchronizedWithCurrentItem="True" 
            Controls:ClosableTabItem.TabClose="TabClosed" >
    <TabControl.ItemTemplate>
        <DataTemplate DataType="{x:Type Controls:ClosableTabItem}" >
            <TextBlock Text="{Binding Path=Id}" />
        </DataTemplate>
    </TabControl.ItemTemplate>
    <TabControl.ContentTemplate>
        <DataTemplate DataType="{x:Type Entities:Case}">
            <CallLog:CaseReadOnlyDisplay DataContext="{Binding}" />
        </DataTemplate>
    </TabControl.ContentTemplate>
</TabControl>

编辑:这是我最终的结果,而不是尝试绑定自定义控件。 “CloseCommand”我来自previous question

    <Style TargetType="{x:Type TabItem}" BasedOn="{StaticResource {x:Type TabItem}}" >
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type TabItem}">
                    <Border 
                            Name="Border"
                            Background="LightGray"
                            BorderBrush="Black" 
                            BorderThickness="1" 
                            CornerRadius="25,0,0,0"
                            SnapsToDevicePixels="True">
                        <StackPanel Orientation="Horizontal">
                        <ContentPresenter x:Name="ContentSite"
                              VerticalAlignment="Center"
                              HorizontalAlignment="Center"
                              ContentSource="Header"
                              Margin="20,1,5,1"/>
                            <Button 
                                Command="{Binding Path=CloseCommand}"
                                Cursor="Hand"
                                DockPanel.Dock="Right"
                                Focusable="False"
                                Margin="1,1,5,1"
                                Background="Transparent"
                                BorderThickness="0">
                                <Image Source="/Russound.Windows;component/Resources/Delete.png" Height="10" />
                            </Button>
                        </StackPanel>
                    </Border>
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsSelected" Value="True">
                            <Setter Property="FontWeight" Value="Bold" />
                            <Setter TargetName="Border" Property="Background" Value="LightBlue" />                            
                            <Setter TargetName="Border" Property="BorderThickness" Value="1,1,1,0" />
                            <Setter TargetName="Border" Property="BorderBrush" Value="DarkBlue" />
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

2 个答案:

答案 0 :(得分:7)

找到了办法, 从TabControl派生一个类并覆盖此函数,在我的情况下,我希望选项卡控件的项目(绑定时)为CloseableTabItems

public class CloseableTabControl : TabControl
    {
        protected override DependencyObject GetContainerForItemOverride()
        {
            return new CloseableTabItem();
        }
    }

HTH某人

萨姆

答案 1 :(得分:1)

在这种情况下,您不想设置DataType的{​​{1}}。每当需要添加新项时,都会使用DataTemplate属性的值,对于制表符控件,它将用于创建新的ItemTemplate。您应该在TabItem本身内声明您的类的实例:

DataTemplate

只要将新标签添加到<TabControl x:Name="tabCases" IsSynchronizedWithCurrentItem="True" Controls:ClosableTabItem.TabClose="TabClosed"> <TabControl.ItemTemplate> <DataTemplate> <Controls:ClosableTabItem> <TextBlock Text="{Binding Path=Id}" /> </Controls:ClosableTabItem> </DataTemplate> </TabControl.ItemTemplate> <TabControl.ContentTemplate> <DataTemplate DataType="{x:Type Entities:Case}"> <CallLog:CaseReadOnlyDisplay DataContext="{Binding}" /> </DataTemplate> </TabControl.ContentTemplate> </TabControl> ,就会创建新的ClosableTabItem

<强>更新;从您的评论中可以看出,TabControl控制了ItemTemplate中创建的内容,而不是更改TabItem本身。要执行您想要执行的操作,但对于TabItem,您可以设置TreeView。很遗憾,我没有看到HeaderTemplate的{​​{1}}属性。

我进行了一些搜索,this tutorial通过向HeaderTemplate添加控件来修改标签页眉的内容。也许您可以为TabControl创建TabItem.Header,以添加您的班级当前添加的关闭按钮?