Ich möchte einen einfachen Bildbetrachter in WPF erstellen, der es dem Benutzer ermöglicht:
- Schwenken (durch Ziehen der Maus mit der Maus).
- Zoom (mit einem Schieberegler).
- Überlagerungen anzeigen (z. B. Auswahl eines Rechtecks).
- Originalbild anzeigen (bei Bedarf mit Bildlaufleisten).
Können Sie erklären, wie es geht?
Ich habe im Web keine gute Probe gefunden. Soll ich ViewBox verwenden? Oder ImageBrush? Benötige ich ScrollViewer?
Antworten:
Ich habe dieses Problem gelöst, indem ich das Bild innerhalb eines Rahmens platziert habe, dessen ClipToBounds-Eigenschaft auf True gesetzt war. Das RenderTransformOrigin für das Bild wird dann auf 0,5,0,5 festgelegt, sodass das Bild in der Bildmitte zu zoomen beginnt. Die RenderTransform wird auch auf eine TransformGroup festgelegt, die eine ScaleTransform und eine TranslateTransform enthält.
Ich habe dann das MouseWheel-Ereignis auf dem Bild behandelt, um das Zoomen zu implementieren
Um das Schwenken zu handhaben, habe ich zuerst das MouseLeftButtonDown-Ereignis auf dem Bild behandelt, die Maus erfasst und ihren Speicherort aufgezeichnet. Außerdem speichere ich den aktuellen Wert von TranslateTransform. Dieser Wert wird aktualisiert, um das Schwenken zu implementieren.
Dann habe ich das MouseMove-Ereignis behandelt, um die TranslateTransform zu aktualisieren.
Vergessen Sie nicht, die Mauserfassung freizugeben.
Weitere Informationen zu den Auswahlhandles für die Größenänderung, die mit einem Adorner ausgeführt werden können, finden Sie in diesem Artikel .
quelle
Nachdem ich Beispiele aus dieser Frage verwendet habe, habe ich eine vollständige Version der Pan & Zoom-App mit dem richtigen Zoomen relativ zum Mauszeiger erstellt. Der gesamte Schwenk- und Zoomcode wurde in eine separate Klasse namens ZoomBorder verschoben.
ZoomBorder.cs
MainWindow.xaml
MainWindow.xaml.cs
quelle
double zoomCorrected = zoom*st.ScaleX; st.ScaleX += zoomCorrected; st.ScaleY += zoomCorrected;
Die Antwort wurde oben gepostet, war aber nicht vollständig. Hier ist die fertige Version:
XAML
Code dahinter
Ich habe ein Beispiel für ein vollständiges wpf-Projekt, das diesen Code auf meiner Website verwendet: Notieren Sie sich die Haftnotiz-App .
quelle
Versuchen Sie diese Zoomsteuerung: http://wpfextensions.codeplex.com
Die Verwendung des Steuerelements ist sehr einfach. Verweisen Sie auf die wpfextensions-Assembly als:
Bildlaufleisten werden derzeit nicht unterstützt. (Es wird in der nächsten Version sein, die in ein oder zwei Wochen verfügbar sein wird).
quelle
quelle
@Anothen und @ Number8 - Die Vector-Klasse ist in Silverlight nicht verfügbar. Damit dies funktioniert, müssen Sie nur die letzte Position aufzeichnen, die beim letzten Aufruf des MouseMove-Ereignisses gesichtet wurde, und die beiden Punkte vergleichen, um den Unterschied zu ermitteln ;; Passen Sie dann die Transformation an.
XAML:
Code-Behind:
Beachten Sie auch, dass Sie keine TransformGroup oder Sammlung benötigen, um Schwenken und Zoomen zu implementieren. stattdessen eine CompositeTransform den Trick mit weniger Aufwand.
Ich bin mir ziemlich sicher, dass dies in Bezug auf die Ressourcennutzung wirklich ineffizient ist, aber zumindest funktioniert es :)
quelle
Um relativ zur Mausposition zu zoomen, benötigen Sie lediglich:
quelle
@ Merk
Für Ihre Lösung mit Lambda-Ausdruck können Sie folgenden Code verwenden:
Dieser Code kann unverändert für .Net Frame Work 3.0 oder 2.0 verwendet werden
Hoffe es hilft dir :-)
quelle
Noch eine Version derselben Art von Kontrolle. Es hat ähnliche Funktionen wie die anderen, fügt jedoch hinzu:
Die Verwendung ist einfach:
Und der Code:
quelle
if (image.ActualWidth*(st.ScaleX + zoom) < 200 || image.ActualHeight*(st.ScaleY + zoom) < 200) //don't zoom out too small. return;
in image.MouseWheelDadurch wird das Bild vergrößert und verkleinert sowie geschwenkt, das Bild bleibt jedoch innerhalb der Grenzen des Containers. Als Steuerelement geschrieben, fügen Sie den Stil
App.xaml
direkt oder über das hinzuThemes/Viewport.xaml
.Zur besseren Lesbarkeit habe ich dies auch auf Gist und Github hochgeladen
Ich habe das auch auf Nuget verpackt
./Controls/Viewport.cs:
./Themes/Viewport.xaml:
./App.xaml
Verwendung:
Bei Problemen rufen Sie mich an.
Viel Spaß beim Codieren :)
quelle