如何将一张图片覆盖到另一张图片上？

Question

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

我希望图像rectangle.png和图像sticker.png重叠，sticker.png显示在顶部，并且其左上角位于像素10, 10处。

这是目前为止我所做到的，但是我该如何合并这两张图片呢？

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;

- Edward Tanguay

Answer 1

你需要一个面板来添加这两个图像控件。Grid或Canvas都可以实现，但我会选择Grid，因为它会约束图像控件（根据需要拉伸或缩小它们）。

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;

- Abe Heidebrecht

---

很好，这就是我所采用的方法，只需要加上imageSticker.VerticalAlignment = VerticalAlignment.Top;即可。 - Edward Tanguay

这不是真正的叠加。如果我想在按钮上使用组合图像怎么办？这样行不通。 - bobbyalex

为什么不呢？按钮肯定可以将那个网格作为其内容。 - Abe Heidebrecht

Answer 2

您可以在视图中将一个Image控件放在另一个Image控件的上方。将它们都放入Grid或Canvas中，然后只需将其中一个图像覆盖在另一个图像上即可。这还可以让您使用不透明度来进行混合，并且效果非常好。

如果您需要将它们合并成同一张图片，则有几个选项...

您可以从第一张图片中创建一个WritableBitmap，然后手动“绘制”另一张图片的像素到第一张图片上。然后，它可以作为显示中图像的图像源。

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

- Reed Copsey