Bild aus Explorer in die Silverlight Anwendung ziehen

“Nur kein Code ist guter Code”. Ein Zitat aus meinem Munde [hannesp]. Entsprechend versuche ich immer mit minimalen Code mein Ziel zu erreichen. Vielleicht auch ein Grund warum ich mit Layern und MVxx recht sparsam umgehe.

Deshalb bin ich auch ganz stolz auf mein Silverlight Bilder Drag & Drop Beispiel. Fünf Zeilen Code. Weniger geht kaum.

Drag& Drop ist eine Funktion in Silverlight 4 die sowohl für OOB als auch in Browser Anwendungen funktioniert. Der Benutzer kann eine oder mehrere Dateien auf ein UIElement ziehen und dort fallen lassen. Dafür muss im UIElement das Attribut Allowdrop auf true gesetzt werden. Dann werden vier mögliche Events gefeuert.

  • DragEnter
  • DragOver
  • DragLeaver
  • Drop

Wirklich wichtig ist nur das letzte Ereignis Drop. Die anderen Events könnten verwendet werden um den Benutzer durch z.B. Farbänderungen sichtbar zu machen wohin er gerade dropped. In Meinem Beispiel möchte ich auf ein Image Element ein Bild ziehen können. Da das Image ohne Bild nicht sichtbar ist, reagiert es auch auf keine Events und ist nicht abschätzbar wo die Grenzen sind. Ähnliches passiert meinen Silverlight Kurs Teilnehmer recht häufig mit einem Rechteck. Das ist auch nur clickbar wenn es mit einer Brush gefüllt ist.

Um also den Rahmen zu zeichnen und das Drop Event zu bekommen, packe ich einfach das Image in ein Border der gefüllt ist.

<Border HorizontalAlignment="Left" 
Height="211" Margin="75,0,0,0" Drop="Image1_Drop" AllowDrop="True" VerticalAlignment="Top"
Width="202"> <Border.Background> <LinearGradientBrush EndPoint="0.5,1"
StartPoint="0.5,0"> <GradientStop Color="Black" Offset="0"/> <GradientStop Color="White" Offset="1"/> </LinearGradientBrush> </Border.Background> <Image
MouseLeftButtonDown="Image1_MouseLeftButtonDown" x:Name="Image1" Stretch="Fill" /> </Border>

Im Drop  Event bekommt man per e.Data die Liste der gedroppten Dateien. In meinem Fall nehme ich einfach die erste Datei im Index und gehe davon aus das es ein JPG oder PNG ist. Dann wird die Datei per Filestream geöffnet und einem BitmapImage zugewiesen. Dieses wiederum ist die perfekte Quelle für das Image Element.

Private Sub Image1_Drop(ByVal sender As System.Object, 
ByVal e As System.Windows.DragEventArgs) Dim fi As FileInfo =
e.Data.GetData(DataFormats.FileDrop)(0) Using fs As FileStream = fi.OpenRead Dim bi As New BitmapImage bi.SetSource(fs) Image1.Source = bi End Using End Sub

 

imageimage

wie gesagt alles Beispiele aus meiner Silverlight Schulung. Der nächste Termin ist in Leipzig.

Kommentare sind geschlossen