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

本文关键字:控件 图像 绘制 | 更新日期: 2023-09-27 18:02:01

我的XAML是:

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

正如你所看到的,我在网格中有画布和图像控件,可以在图像上执行绘图。

我正在加载的所有图像都具有相同的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属性,但它不适合我。

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

您的代码的问题是,图像控件,因此内部网格总是得到加载的图像的大小。然后Viewbox缩放所有内容以适应外部网格(单元格)。显然,这也会以相同的比例因子缩放Canvas及其子元素。因此,当加载不同大小的图像时,您会观察到不同大小的椭圆。

解决方案是不使用Viewbox。Image控件已经缩放了显示的图像,除非您将其Stretch属性设置为None。因此你根本不需要Viewbox。您应该通过设置图像控件的WidthHeight(或者两者都设置)来给它一个适当的大小。

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