【发布时间】：2022-01-06 17:31:27
【问题描述】：
WinUI 3.0 的新手——我正在构建一个桌面应用程序。主窗口有一个网格：
<Grid Name="mainGrid"
RowDefinitions="40,*"
ColumnDefinitions="100,*">
我将第 0 行用于 MenuBar，将第 0 列用于包含按钮的垂直 StackPanel。网格中最重要的部分是第 1 行第 1 列的单元格。在该单元格中，我需要显示一个图像（来自文件 URI）。调整窗口大小时，我需要调整图像大小。我的图像 XAML 是：
<Image Name="myImage"
Source="C:\Users\leigh\OneDrive\Documents\Usa.jpg"
Stretch="Uniform"
Grid.Row="1"
Grid.Column="1">
</Image>
到目前为止一切顺利——当我在运行时调整窗口大小时，图像在我调整窗口大小时保持其原始比例。现在最难的部分...
在代码中，我需要在图像的特定位置添加各种形状。例如，我需要添加一个椭圆，使其显示在图像顶部下方 25% 处和图像左侧右侧 65% 处。要想象这一点，请想象一张美国地图的图像。我想在芝加哥上方放置一个椭圆。当用户调整窗口大小时，椭圆必须仍然出现在芝加哥上空——当然，由于调整大小，芝加哥现在在计算机屏幕上处于不同的绝对位置。
我是否需要使用 Canvas 元素来包含 Image 元素，然后将我的椭圆添加到画布的指定位置（我可以在 SizeChanged 事件中重新计算 Canvas 绝对坐标）？我尝试将 Image 元素包装在 Canvas 中，但是当窗口调整大小时 Canvas 不会调整大小。这是否意味着我必须 (1) 获取图像文件的绝对大小，(2) 找出“拉伸数学”来设置画布的大小，这样当我将图像添加到画布，（3）找出椭圆的新画布绝对位置等。
这一切看起来都非常复杂。我只想显示一张美国地图，在运行时在芝加哥上空绘制一个椭圆，并在调整窗口大小时将椭圆保持在芝加哥上（当然不会扭曲美国的形状）。
建议？
【问题讨论】：
标签： image canvas position stretch winui-3