Question

我正在尝试在列表视图数据模板中创建一个停靠面板，该模板占用其父标签控件的所有可用宽度。我开始将我的XAML从this question开始，因此得出了这个：

<TabControl x:Name="tabControl" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
    <TabItem Header="Clipboard Buffer">
        <ListView Name="clipboardListView" ScrollViewer.CanContentScroll="True">
            <ListView.ItemTemplate>
                <DataTemplate>
                    <Border BorderThickness="2" BorderBrush="Black" CornerRadius="2,2,2,2">
                        <DockPanel Background="AliceBlue" Width="{Binding ActualWidth, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type TabControl}}}">
                            <TextBlock Text="{Binding Text}" DockPanel.Dock="Top" />
                        </DockPanel>
                    </Border>
                </DataTemplate>
            </ListView.ItemTemplate>
        </ListView>
    </TabItem>

     ...

这几乎可以工作，但是停靠面板似乎总是比标签控件中的可用空间稍微宽一点，如您所见。

我可以使用滚动条移动并看到我的dockpanel的结尾，正如人们所期望的那样......

但是，如果我尝试重新调整表单大小，则dockpanel仍然会比制表符控件中的可用空间量略大。

我在这里缺少什么？如何使我的停靠面板保持在其父标签控件的宽度范围内？

Answer 1

试试这个：

    <TabControl x:Name="tabControl" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
        <TabItem Header="Clipboard Buffer">
            <ListView Name="clipboardListView" ScrollViewer.CanContentScroll="True" HorizontalContentAlignment="Stretch">
                <ListView.ItemTemplate>
                    <DataTemplate>
                        <Border BorderThickness="2" BorderBrush="Black" CornerRadius="2,2,2,2" >
                            <DockPanel Background="AliceBlue" >
                                <TextBlock Text="asdfasdkfhkasdfkasdgfkjhdgfkuwegyfkwegfbkuweyfuksyadukfykweugbyfu" DockPanel.Dock="Top" />
                            </DockPanel>
                        </Border>
                    </DataTemplate>
                </ListView.ItemTemplate>
            </ListView>
        </TabItem>
    </TabControl>

注意ListView中的HorizontalContentAlignment="Stretch"

Answer 2

选项卡控件的

ActualWidth是选项卡控件的外部宽度，但是在dockpanel和选项卡控件的外部之间有很多东西。如果外部的选项卡控件宽度为500像素，则在选项卡控件内的选项卡页内部的边框内放置500像素宽的内容。边框，标签页和标签控件都有边框和装饰，而里面标签控件的ActualWidth。

您需要DockPanel的直接父级的内部宽度（“windows-programming-speak”中的“客户端宽度”）。

获得它的方法不是做任何绑定到宽度属性的东西。拉伸停靠面板。 XAML 为你做这件事如果你问得好的话。现在我已经花了几年时间使用XAML，我发现从长远来看，如果你弄清楚XAML是如何做事的，那么你最不会感到头痛，并且顺其自然。

但这里的根本问题是你的ListViewItems没有水平拉伸。我可以读懂你的想法，这就是你限制宽度的原因。嗯，这是一种更简单的方法。默认情况下，ListViewItem不会拉伸以适合其父级。但你可以像以下那样重新设置它：

<TabControl x:Name="tabControl" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
    <TabItem Header="Clipboard Buffer">
        <ListView Name="clipboardListView" ScrollViewer.CanContentScroll="True">
            <ListView.ItemContainerStyle>
                <Style TargetType="ListViewItem">
                    <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
                </Style>
            </ListView.ItemContainerStyle>
            <ListView.ItemTemplate>
                <DataTemplate>
                    <Grid>
                        <Border BorderThickness="2" BorderBrush="Black" CornerRadius="2,2,2,2">
                            <DockPanel Background="AliceBlue">
                                <TextBlock Text="{Binding UnicodeText}" DockPanel.Dock="Top" />
                            </DockPanel>
                        </Border>
                    </Grid>
                </DataTemplate>
            </ListView.ItemTemplate>
        </ListView>
    </TabItem>
</TabControl>

Answer 3

您的DockPanel嵌套在Border元素中：

<Border BorderThickness="2" BorderBrush="Black" CornerRadius="2,2,2,2">
    <DockPanel Background="AliceBlue" Width="{Binding ActualWidth, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type TabControl}}}">

Border占据自己的宽度 - 边框厚度为2，因此宽度比其内容宽4个像素。

Border的内容是您的DockPanel - 并且您已将其宽度绑定到封闭TabControl的实际宽度。因此，前面提到的Border总是比封闭的TabControl宽一点。

首先，您可以尝试绑定Border的宽度而不是DockPanel的宽度。这应该在某种程度上有所帮助，虽然我不完全确定TabControl不需要为其页面内容增加一些内部空间。

Answer 4

这很可能是由DockPanel XAML中的这一行引起的：

Width="{Binding ActualWidth, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type TabControl}}}

您将Width设置为ActualWidth的{{1}}，而不考虑儿童的任何填充或保证金。

您需要检查TabControl，TabControl或TabItem是否有任何填充或边距，然后将其关闭。（别忘了2像素边框！）

WPF Dockpanel超出父

4 个答案: