如何将一个图像叠加到另一个图像上？

Question

我想显示由两个图像组成的图像。

我想图像rectangle.png与在像素10，10，其左上角它的顶部图像sticker.png显示。

这是我得到的，但我如何组合图像？

Image image = new Image();
image.Source = new BitmapImage(new Uri(@"c:\test\rectangle.png"));
image.Stretch = Stretch.None;
image.HorizontalAlignment = HorizontalAlignment.Left;

Image imageSticker = new Image();
imageSticker.Source = new BitmapImage(new Uri(@"c:\test\sticker.png"));

image.OverlayImage(imageSticker, 10, 10); //how to do this?

TheContent.Content = image;

Answer 1

您需要一个Panel来添加两个Image控件。 Grid或Canvas将允许这样，但我会使用Grid，因为它将约束Image控件（从而适当地拉伸或缩小它们）。

Image image = new Image();
image.Source = new BitmapImage(new Uri(@"c:\test\rectangle.png"));
image.Stretch = Stretch.None;
image.HorizontalAlignment = HorizontalAlignment.Left;

Image imageSticker = new Image();
imageSticker.Source = new BitmapImage(new Uri(@"c:\test\sticker.png"));
imageStiker.Margin = new Thickness(10, 10, 0, 0);

Grid grid = new Grid();
grid.Children.Add(image);
grid.Children.Add(imageSticker);

TheContent.Content = grid;

Answer 2

您可以将一个Image控件放在View中另一个Image控件的顶部。 将两者放入网格或画布中，然后将其中一个图像叠加在另一个上面。 这也允许您使用不透明度进行混合，并且效果很好。

如果你需要让它们进入相同的图像，有几个选项....

您可以从第一个图像中制作WritableBitmap ，然后手动“绘制”第一个图像顶部的其他图像像素。 然后，它可以作为显示器中图像的图像源。

或者，您可以执行上面提到的叠加，并将其渲染为RenderTargetBitmap 。 然后可以将其用作图像源。