1

我正在定制一个包含选项卡控件子元素的用户控件。用户控件停靠在主窗口的一侧。我希望标签项根据停靠位置定向,例如。左侧停靠的选项卡项目旋转 90 度以沿侧面放置。我通过绑定到附加属性 DockPanel.Dock 使选项卡正确对齐。问题在于,当呈现选项卡时,它们会被选项卡控件中的一行断开。我可以为外部用户控件对象手动设置 (DockPanel.Dock) 属性,并且沿该方向停靠的选项卡正确绘制,但其他选项卡由一条线分隔。

这是 TabDockControl XML:

<UserControl x:Class="AnimationMotionCaptureStudio.TabDockControl"
         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
         xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
         mc:Ignorable="d" 
         d:DesignHeight="300" d:DesignWidth="300" x:Name="Root" DockPanel.Dock="Left">
<Grid>
    <TabControl Height="Auto" HorizontalAlignment="Stretch" Name="tabControl1" VerticalAlignment="Stretch" Width="Auto" TabStripPlacement="{Binding Path=(DockPanel.Dock),ElementName=Root}">
        <TabControl.Resources>

            <Style TargetType="{x:Type TabItem}">
                <Setter Property="Padding" Value="2" />
                <Setter Property="HeaderTemplate">
                    <Setter.Value>
                        <DataTemplate>
                            <ContentPresenter Content="{TemplateBinding Content}" />
                        </DataTemplate>
                    </Setter.Value>
                </Setter>
                <Style.Triggers>
                    <DataTrigger  Binding="{Binding Path=(DockPanel.Dock), ElementName=Root}" Value="Left">
                        <Setter Property="Padding" Value="2" />
                        <Setter Property="HeaderTemplate">
                            <Setter.Value>
                                <DataTemplate>
                                    <ContentPresenter Content="{TemplateBinding Content}">
                                        <ContentPresenter.LayoutTransform>
                                            <RotateTransform Angle="90" />
                                        </ContentPresenter.LayoutTransform>
                                    </ContentPresenter>
                                </DataTemplate>
                            </Setter.Value>
                        </Setter>
                    </DataTrigger>
                    <DataTrigger  Binding="{Binding Path=(DockPanel.Dock), ElementName=Root}" Value="Right">
                        <Setter Property="Padding" Value="5" />
                        <Setter Property="HeaderTemplate">
                            <Setter.Value>
                                <DataTemplate>
                                    <ContentPresenter Content="{TemplateBinding Content}">
                                        <ContentPresenter.LayoutTransform>
                                            <RotateTransform Angle="-90" />
                                        </ContentPresenter.LayoutTransform>
                                    </ContentPresenter>
                                </DataTemplate>
                            </Setter.Value>
                        </Setter>
                    </DataTrigger>
                </Style.Triggers>
            </Style>
        </TabControl.Resources>

        <TabItem Header="{Binding Path=(DockPanel.Dock), ElementName=Root}" Name="tabItem1">
            <Grid>
                <Border BorderBrush="Silver" BorderThickness="1" Height="Auto" HorizontalAlignment="Stretch" Name="border1" VerticalAlignment="Stretch" Width="Auto" />
            </Grid>
        </TabItem>
    </TabControl>
</Grid>

除了 VS2010 生成的构造函数之外,文件后面的代码没有添加任何额外的代码。

以及控件的 MainWindow XML 用法:

        <DockPanel Grid.Row="1" Height="Auto" HorizontalAlignment="Stretch" Name="MainDockPanel" VerticalAlignment="Stretch" Width="Auto" >
        <DockPanel.Children>
            <StatusBar Height="23" Name="statusBar1" Width="Auto" DockPanel.Dock="Bottom" Background="#FF00476D" />

            <AMCS:TabDockControl DockPanel.Dock="Left">
            </AMCS:TabDockControl>

            <AMCS:TabDockControl DockPanel.Dock="Right">
            </AMCS:TabDockControl>              

            <AMCS:TabDockControl DockPanel.Dock="Bottom">
            </AMCS:TabDockControl>
            <Border BorderBrush="Silver" BorderThickness="2" Height="Auto" Name="border1" Width="Auto" DockPanel.Dock="Top" Background="#FF898888">
                <Image Height="Auto" HorizontalAlignment="Stretch" Name="D3DImage" Stretch="Fill" VerticalAlignment="Stretch" Width="Auto" MouseLeftButtonDown="D3DImage_MouseLeftButtonDown" MouseLeftButtonUp="D3DImage_MouseLeftButtonUp" MouseMove="D3DImage_MouseMove" Grid.RowSpan="1" Grid.Row="1" MouseWheel="D3DImage_MouseWheel">
                    <Image.Source>
                        <i:D3DImage x:Name="D3DImageSource"/>
                    </Image.Source>
                </Image>
            </Border>
        </DockPanel.Children>
    </DockPanel>

任何有关如何设置它以正确呈现选项卡的建议将不胜感激。

4

0 回答 0