Wie machen Sie Miniaturansichten auf Javafx?

In diesem Artikel wird in der JavaFX -Desktop -Anwendung eine geklickte interaktive Schrumpfungskarte erstellt. Nach dem Klicken auf das Schrumpfungsdiagramm werden größere Bilder angezeigt, und eine Überlagerungsschicht mit hervorragenden Anzeigenbildern und ihren Details. Ähnlich wie interaktive Beispiele für schrumpfende Diagramme in W3school.

Zunächst müssen Sie die Abhängigkeit der FXPopup -Bibliothek hinzufügen:

<code class="language-xml"><dependency>
    <groupId>io.github.hugoquinn2</groupId>
    <artifactId>fxpopup</artifactId>
    <version>1.1.0</version>
</dependency></code>

Erstellen Sie eine einfache Miniatur

Ein einfaches, einziehbares Diagramm erfordert nur eine Überlagerungsschicht und ein Bild. Das folgende Beispiel zeigt, wie Sie eine Miniaturansicht erstellen:

Erstellen Sie benutzerdefinierte ImageView zum Schrumpfen von Diagrammen

<code class="language-java">Rectangle overlay;
FxPopup fxPopup;
ImageView imageView;

@FXML
public void initialize() {
    fxPopup = new FxPopup();
    imageView = new ImageView("https://th.bing.com/th/id/OIP.TnnO-9C6THhBBCzOhTe7mQHaFj?rs=1&pid=ImgDetMain");
    overlay = new Rectangle();
    overlay.setFill(Color.BLACK);
    overlay.setOpacity(0.3);
    overlay.setOnMouseClicked(event -> {
        MasterUtils.remove(imageView);
        MasterUtils.remove(overlay);
    });
}

@FXML
protected void onThumbnails() {
    fxPopup.show(overlay, Pos.CENTER);
    overlay.widthProperty().bind(((Pane) MasterUtils.getRoot()).widthProperty());
    overlay.heightProperty().bind(((Pane) MasterUtils.getRoot()).heightProperty());
    fxPopup.show(imageView, Pos.CENTER);
}</code>

Um die Erstellung eines schmalen Diagramms zu erleichtern, erstellen wir eine benutzerdefinierte -Klasse, um die

zu erben und es mit einem eigenen Kontraktionsdiagramm -Diagrammfunktion zu erben:

ThumbnailImage ImageView Verwenden von benutzerdefinierter Klasse können Sie problemlos mehrere Schrumpfungskartenobjekte erstellen und zu einem beliebigen Ort hinzufügen:

<code class="language-java">public class ThumbnailImage extends ImageView {
    // ... (代码与原文相同) ...
}</code>

In den obigen Schritten können Sie in der Javafx -Anwendung problemlos interaktive, einziehbare Diagramme erstellen und verwenden. Bitte beachten Sie, dass die ThumbnailImage -Klasse und -Methoden gemäß dem tatsächlichen Projekt angepasst werden müssen.

Das obige ist der detaillierte Inhalt vonWie machen Sie Miniaturansichten auf Javafx?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!