在图像上绘制缩放图片

Question

我有一个WPF图像，我试图在上面画一些东西(让我们说一个笑脸，两个蓝色圆圈代表眼睛，一个红色椭圆代表嘴)。我在图像上做了一个小的Rectangle，并使它拉伸。

<Grid Name="mGrid">
    <Rectangle Height="0" HorizontalAlignment="Stretch" Stretch="Fill" Name="mImageFrame"  VerticalAlignment="Stretch" Width="0" />
</Grid >

我使用DrawingBrush绘制矩形中的圆圈。

显然这是错误的，因为我有两个问题：

1. DrawingBrush似乎有一个不同的规模。它将根据它正在绘制的最大的项目进行缩放。
2. 我只能用一种刷子的颜色。

那么，我怎么能以某种方式绘制一个图像，使它保持相同的比例呢？

我如何为每种形状使用不同的颜色？

Answer 1

您可以将形状放在覆盖图像的画布上，并将全部内容放在视图框中。这需要通过将图像的Stretch属性设置为None (从而强制图像大小为其Source位图的大小)或显式设置为Width或Height来定义绝对坐标。

<Viewbox>
    <Grid>
        <Image Source="C:\Users\Public\Pictures\Sample Pictures\Koala.jpg"
               Stretch="None"/>
        <Canvas>
            <Ellipse Canvas.Left="420" Canvas.Top="480"
                     Fill="Red" Width="100" Height="100"/>
            ... more shapes here ...
        </Canvas>
    </Grid>
</Viewbox>

Answer 2

一种解决方案是将绘图和Image都放入ViewBox控件中。您可以从MSDN的Viewbox页面中了解更多有关Viewbox类的信息。基本上，它提供了与Image控件相同的拉伸功能。

您还可以在MSDN上查看WPF中的形状和基本绘图概述页面。