2010-03-19 13 views
9

Ich möchte ein Bild bestehend aus zwei Bilder anzeigen.Wie kann ich ein Bild auf ein anderes überlagern?

Ich mag Bild rectangle.png mit Bild sticker.png auf oben davon mit seiner linken Ecke bei Pixel 10 zeigen, 10.

hier so weit wie Ich habe, aber Wie kombiniere ich die Bilder?

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; 

Antwort

12

Sie benötigen ein Panel, um beide Bildsteuerelemente hinzuzufügen. Ein Raster oder ein Canvas erlauben dies, aber ich würde mit dem Grid gehen, da es die Image-Steuerelemente einschränkt (wodurch sie entsprechend gestreckt oder verkleinert werden).

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; 
+0

ausgezeichnet, das ist der Ansatz, den ich verwenden, nur erforderlich, um auch einen imageSticker.VerticalAlignment hinzufügen = VerticalAlignment.Top; –

+0

Dies ist kein echtes Overlay. Was wäre, wenn ich das kombinierte Bild auf einer Schaltfläche verwenden möchte? Dies würde nicht funktionieren. – bobbyalex

+0

Warum nicht? Der Button kann definitiv dieses Gitter als Inhalt haben. –

2

Sie können in Ihrer Ansicht eine Bildsteuerung über die Oberseite der anderen Bildsteuerung gerade auf. Platzieren Sie beide in ein Raster oder eine Leinwand und überlagern Sie eines der Bilder übereinander. Auf diese Weise können Sie die Deckkraft auch zum Überblenden verwenden und funktionieren sehr gut.

Wenn Sie sie in das gleiche Bild erhalten müssen, gibt es ein paar Optionen ....

Sie ein WritableBitmap aus dem ersten Bild machen können, dann manuell „malen“ die anderen Bildpixel auf oben auf dem ersten. Dies kann dann als Bildquelle für Ihr Bild im Display dienen.

Alternativ können Sie die oben genannte Überlagerung durchführen und diese in eine RenderTargetBitmap rendern. Dies könnte dann als Ihre Bildquelle verwendet werden.

Verwandte Themen