使用缩放和滚动在画布中保持孩子的位置 - WPF答案

【问题标题】：Maintain position for child in a Canvas with zoom and scroll - WPF使用缩放和滚动在画布中保持孩子的位置 - WPF
【发布时间】：2016-11-02 21:16:30
【问题描述】：

我想实现以下功能。

我有一个画布，里面有几个UIElements。 Canvas 允许缩放和滚动应用缩放和平移变换。

我想将红色方块始终保持在同一位置（Canvas 的左下角），以充当浮动控件，因此当我更改缩放或滚动时，红色方块始终保持不变大小和位置。类似于谷歌地图“地球窗口”的东西：

实现它的最佳方法是什么？

注意：我尝试使用 WPF adorner layer，但它不响应鼠标事件，我需要与红色方块进行交互。

【问题讨论】：

在 Canvas 顶部放置另一个面板（例如网格），并在此处添加 Rectangle。

标签： wpf canvas scroll zooming

【解决方案1】：

正如Clemens 所说，把它放在上面的另一层。 Grid 可以在同一个单元格中托管多个项目，因此请为您的 Canvas 创建一个 1 x 1 Grid 在顶部添加内容，就像任何其他 WPF 布局一样。后面的项目出现在顶部（除非指定了 Z 层）：

<Grid>
    <Canvas>
        ... do all my fancy drawing
    </Canvas>
    <Rectangle VerticalAlignment="Bottom" HorizontalAlignment="Left" Width="100" Height="100" />
</Grid>

注意，如果画布有任何非 WPF 呈现，例如视频或嵌入的 WindowsForms 内容，您可能会遇到问题。我已经看到人们在绘制 WPF 内容时遇到了麻烦。

我也相信你可以设置Canvas.Bottom="20" 来设置相对于底部边缘的位置，但我从未使用过它。

【讨论】：