Question

我的XAML是：

<Grid Name="grid">
            <Viewbox Name="viewBox"  Grid.Column="0" Grid.Row="0">
                <Grid>
                    <Image Name="image" />
                    <Canvas Name="canvas" />
                </Grid>
            </Viewbox>
        </Grid>

正如你所看到的，我在Grid中有Canvas和Image控件来执行在Image上的绘制。

我正在加载的所有图像都具有相同的dpi - 72。

加载图像后，我获取一些数据并执行绘图：

var ellipse = new Ellipse
                {
                    Width = 100,
                    Height = 100,
                    Cursor = Cursors.Hand,
                    Fill = new SolidColorBrush(Colors.Green),
                    Stroke = new SolidColorBrush(Colors.Black),
                    StrokeThickness = 1
                };
            canvas.Children.Add(ellipse);
            Canvas.SetLeft(ellipse, 10);
            Canvas.SetTop(ellipse, 10);

但看起来椭圆在不同的图像上看起来不同。它的大小取决于加载图像的大小。如果加载的图像具有大分辨率 - 椭圆很小。如果加载的图像分辨率很小 - 椭圆太大。

如何绘制具有相同物理尺寸的椭圆？

我尝试在椭圆控件上应用SnapsToDevicePixels属性，但它对我不起作用。

Answer 1

代码的问题在于Image控件以及内部Grid总是得到加载图像的大小。 Viewbox然后缩放所有内容以适应外部网格（单元格）。显然，它也可以通过相同的缩放因子来缩放Canvas及其子元素。因此，在加载不同大小的图像时，您会观察到不同大小的椭圆。

解决方案不是使用Viewbox。除非您将Stretch属性设置为None，否则图像控件已经缩放了显示的图像。因此，您根本不需要Viewbox。您应该通过设置Width或其Height，或者两者都设置，为Image控件提供合适的大小。

<Grid>
    <Image Name="image" Width="120" />
    <Canvas Name="canvas" />
</Grid>

画布在图像 - 不同大小的绘制控件

1 个答案: