将元素从屏幕边缘动画到中心

Question

我正在WPF中写一个对话框，我想从屏幕边缘进入，并在显示时动画到中心。即使调整窗口大小，对话框也需要保持在屏幕中央。这似乎在WPF中应该很简单，但我仍然没有想到实现这种效果的可靠方法。我更喜欢使用纯粹的“布局”方法，而不是使用绑定计算对话框的位置。

在HTML / CSS中，我只是简单地将对话框的left CSS属性从0'设置为50% ...是否有类似的方法在WPF中实现此效果？< / p>

Answer 1

为了达到这个效果，我编写了自己的Panel子类，其作用类似Canvas，但接受百分比偏移而不是绝对偏移。这使我能够在屏幕的0％到50％之间设置“模态”UserControl的动画。

Here's the class on Github.

用法类似于Canvas：

<Window>
    <local:PercentagePanel>
        <Button local:PercentagePanel.Left=".10" local:PercentagePanel.Bottom=".5"
         Width="100" Height="40">Hello world!</Button>
    </local:PercentagePanel>
</Window>

结果：

默认情况下，PercentagePanel根据每个孩子的相应边缘定位其子项（类似于CSS定位）。 PercentagePanel还可以通过PositioningMode属性将其子项相对于每个孩子的中心定位：

<local:PercentagePanel PositioningMode="Center">

以下是更改上例中PositioningMode属性的结果：