通过ScrollViewer边界调整元素大小

Question

我有两个用户控件： UserControl A 由嵌套在ScrollViewer 中的 StackPanel组成。 UserControl B 基本上是一个具有额外功能的行，一个功能是将鼠标悬停在按钮上，展开网格以显示详细信息。

我遇到的问题是，当我将 UserControl B 添加到 UserControl A StackPanel 时，悬停效果无法调整大小超过ScrollViewers界限。

用户控制A

<ScrollViewer Width="200" Height="250" Margin="0,25,0,0" ClipToBounds="False" VerticalScrollBarVisibility="Auto">
    <StackPanel Name="StackPanel_ContentContainer" ClipToBounds="False">
        <!--User Control B goes here-->
    </StackPanel>
</ScrollViewer>

用户控制B

<Canvas Name="Popup" Panel.ZIndex="50" ClipToBounds="False">
    <Grid Name="Information_Content" Margin="-60,-80,0,0" Width="300" Height="300" Panel.ZIndex="100" ClipToBounds="False">
    </Grid>
</Canvas>

有没有办法在ScrollViewers边界之外调整控件？

Answer 1

问题是用户控件B中的画布：It doesn't know how to "auto size" based on its content.

  

Canvas是唯一没有固有布局的面板元素   特点。 Canvas具有默认的Height和Width属性   零，除非它是自动调整大小的元素的子元素   它的子元素。画布的子元素永远不会调整大小，它们   只是位于他们指定的坐标。这提供了   灵活的固有尺寸限制或   不需要或想要对齐。对于你想要孩子的情况   要自动调整大小和对齐的内容，通常最好   使用网格元素。

正如MSDN推荐的那样，解决这个问题的最简单方法是使用Grid而不是Canvas。