面板与百分比坐标

Question

我想使用一个面板,其子坐标指定为面板总宽度/高度的百分比.此外,我应该能够设置坐标属性的动画,例如使按钮从10%移动到50%面板的宽度.

我做了两次尝试:

1. 使用网格并将大小指定为星号 - 这还不够,因为默认情况下,AFAIK WPF无法为星星指定的距离属性设置动画.我发现某个地方有一个自定义类可以让我这样做,它甚至可以工作,我认为这个解决方案过于复杂,我正在寻找更简单的东西.

2. 使用具有固定宽度和高度的Canvas并将其放入Viewbox中 - 这是一个简单的解决方案,但在调整Viewbox大小时,Canvas的整个内容也会调整大小.我希望内容具有固定的大小.

有一个简单的解决方案,还是我应该实现自己的面板(或者可能扩展现有面板之一,即Canvas)？

干杯!

Answer 1

我会:

• 子类Canvas,也许叫它RelativeCanvas或RatioCanvas
• 添加两个附加属性:XRatio和YRatio
• 覆盖ArrangeOverride并循环遍历所有孩子.对于每一个孩子,用自己的XRatio,并YRatio随着ActualWidth和ActualHeight的RelativeCanvas计算和他们的应用价值Canvas.Left和Canvas.Top附加属性

您可以按如下方式使用它:

<local:RelativeCanvas>
    <!-- the top-left of this button will be center of panel -->
    <Button local:RelativeCanvas.XRatio="50" local:RelativeCanvas.YRatio="50"/>
</local:RelativeCanvas>

在完成工作后,您可能想要添加的一件事是控制对齐.例如,我可能会将控件的中心与指定的比例对齐,而不是左上角.