BorderPane Seiten ein und ausblenden?

[MiMa]

In einem BorderPane Fenster möchte ich über Schaltfläche in der Toolbar die Seiten des Borderpanes ein und ausblenden lassen können.
Weiß jemand wie das funktioniert?

Vielen Dank

 

[KonradN]

Eine Möglichkeit wäre, dass Du dann an der Seite eine Pane einfügst und du dann diese pane sichtbar bzw. unsichtbar machst.

Ein kleines Beispiel, wie es aussehen könnte:

    @Override
    public void start(Stage primaryStage) throws IOException {
        BorderPane root = new BorderPane();
        Scene scene = new Scene(root, 300, 200);

        // Pane mit Label erstellen
        Pane contentPane = new Pane();
        contentPane.setPrefSize(200, 200);
        contentPane.setStyle("-fx-background-color: lightblue;");
        Label label = new Label("Dies ist eine versteckte Pane");
        contentPane.getChildren().add(label);
        contentPane.setVisible(false);

        // Button zum Ein-/Ausblenden der Pane erstellen
        Button toggleButton = new Button("Ein-/Ausblenden");
        toggleButton.setOnAction(e -> {
            contentPane.setVisible(!contentPane.isVisible());
        });

        // BorderPane einrichten
        root.setCenter(toggleButton);
        BorderPane.setMargin(toggleButton, new Insets(10));
        root.setRight(contentPane);

        primaryStage.setScene(scene);
        primaryStage.setTitle("Pane ein/ausblenden");
        primaryStage.show();
    }

 

[MiMa]

Vielen Dank.
Ach so, wenn das Border Feld leer ist wird es nicht angezeigt.
Sobald es aber einen Inhalthalt wird es auch dargestell.

 

[KonradN]

Ja genau, wobei es nicht leer sein muss. Ein unsichtbarer Inhalt hat auch den gleichen Effekt. Aber die Pane entfernen und bei Bedarf wieder einfügen müsste ebenso funktionieren - aber ist vom Code her natürlich deutlich aufwendiger als einfach das unsichtbar machen.

 

[MiMa]

Ich habe ein Testfenster mit SceneBuilder gebaut um benötigte Funktionen aus zu testen.
Das Problem mit der VBox aus zu schalten funktioniert mit einem ToglgeButton sehr gut.
Allerdings habe ich ein Problem mit dem Biden der ListView an den entsprechenden Kanten oben, unten und der rechten Seite.
Das Layout soll auch funktionieren wenn es vergrössert oder verkelinert wird.
Wenn ich die Lösung mit HBox und VBox erstelle, dann habe ich das Problem, dass sowohl die VBox und die ListVie an den Seiten nicht gebunden werden kann. Wenn ich die Lösung wie im Bild mit AnkePane baue, dann kann ich zwar die Kanten binden, aber wenn ich die VBox ausblende, verbreitert sich die ListView nicht.

 

[KonradN]

Kannst Du ein kleines, minimales Beispiel bringen, welches das Problem aufzeigt? Im Augenblick habe ich das Problem, dass ich das Problem nicht ganz verstehe. Was für ein Problem hast Du mit dem Binden? Wie sieht die Struktur des Fensters aus? (Also was für Controls hast Du wie verschachtelt?)

Wenn Du ein kleines Beispielprojekt machst, dann könnte man etwas damit herumspielen und nach dem Problem suchen.

 

[MiMa]

Mit ist dann die idee gekommen, die Bindung links der Dateiliste von 45 auf 0 im Kontroller zu verändern sobal der ToggleButon geklickt wurde.
Also beim ausschalten habe ich den linken anker auf 0 gesetzt und beim einschalten der VBox habe ich die lonke Bindung wieder auf 45 gesetzt.
Funktioniert.

@FXML
    void postfach_tb_tb_btnOA(ActionEvent event) {
        System.out.println("Die Schaltfläche TB im Postfach der Vertikalen Toolbar wurde gedrückt");
        if (postfach_verttoolbar.isVisible()) {
            // Wenn sichtbar, ausblenden
            postfach_verttoolbar.setVisible(false);
            postfach_tb_toggle.setText("EIN"); // Ändern Sie den Text der Schaltfläche
            postfach_seitelinks_AKP.setLeftAnchor(postfach_dateiliste, 0.0); // Linken Bindungswert auf 0 setzen, um auszublenden
        } else {
            // Wenn nicht sichtbar, sichtbar machen
            postfach_verttoolbar.setVisible(true);
            postfach_tb_toggle.setText("AUS"); // Ändern Sie den Text der Schaltfläche
            postfach_seitelinks_AKP.setLeftAnchor(postfach_dateiliste, 45.0); // Linken Bindungswert auf 0 setzen, um auszublenden
        }
    }

Ich hatte vorher das Problem das die vbox mit den senkrechten Buttons zwar ausgeschaltet wurde, aber der Platz nicht freigegeben wurde.
Die Dateiliste wurde an allen kannten oben 40 links 45, unten 0 und rechts 0 mit den AnchorPane Constrains gebunden.
Also VBox ist aus, wird der linke Constrain von 45 auf 0 gesetzt. Damit verbreitert sich die Dateiliste.
Beim einschalten wird dieser wieder auf 45 gesetzt, die VBox wird wieder sichtbar gemacht und die Dateiliste verkleinert sich wiede rin der breite.

 

[KonradN]

Die Frage ist, ob Du überhaupt mit Ankern arbeiten solltest. Es ist oft einfacher, alles mit einem Baum an diversen Nodes zu machen. Dann richtet sich vieles ganz von alleine aus, wenn Du etwas ein- / ausblendest. Damit habe ich bisher die besten Erfahrungen gemacht bei etwas komplexeren UIs (Wobei ich in erster Linie im Backend unterwegs bin. Ich bin hier also kein Experte!)

 

[MiMa]

Das habe ich auch versucht aber das hat nicht wirklich gut funktioniert.
So gerne ich mit vBox und hBox gearbeitet hätte gibt es dann das Problem an den Mittel und Unterteilen.
Die Mittelteile kann ich nicht wirklich gut bestimmen da ich nie genau weiss wie beit oder hoch die Mittelteile sind.
Ich kann halt keine vBox rechts oder unten am fenster anbinden. Zumindest habe ich das bisher nicht gesehen. Ich denke das ist auch nicht das Ziel von den Boxen. Daher habe ich die AnkerPane genommen, und damit ging das ganze dann schon wesentich einfacher.
Das bedeutet nicht das ich jetzt alles mit AnkerPane mache, das kann ich je nach Bedarf ja mischen.
Die senkrechte Toolbarliste habe ich ja auch nichts anderes als eine VBox Vertikal genommen und ein paar Buttons hinein gepackt.

 

[KonradN]

Ich kann halt keine vBox rechts oder unten am fenster anbinden.

Das geht doch über die BorderPane. Was fehlt da an Funktionalität? Du packst Die dann also in der BorderPane an die Seite, wo etwas hin soll.

 

[MiMa]

Anfangs hatte ich das mal mit BprderPane probiert, bin aber dann davon wieder abgegangen.
Ich probiere es mit meinen jetzigen Kentnisstand nochmal mit der BoderPane.

 

[MiMa]

So ich habe das jetzt mal probiert und hier ist mal eine Beschreibung.
Die Grüne Umrandung ist die BorderPane linke Seite.
Dort müsste eine Senkrechte Toolbar sein, die sich ein und ausschalten lässt. Diese habe ich dunkelblau dargestellt und sollte sich bis unten ausdehnen. Die Breite ist fest definiert.
Der Hellblaue Bereich ist eine ListView, die sich sowohl Horizontal als auch Vertikal ausdehen soll. Wird der dunkelblaue Bereich ausgeblendet, soll sich der hellblaue Bereich horizontal ausdehen und beim einschalten des blauen Bereiches wieder verkürzen.
Die hell und dunkelgrünen Flächen sind die HBoxen. Diese passen sich zwar in der breite an, aber nicht in der Vertikalen.
Und dieses Problem habe ich nicht gelöst bekommen ohne konkret aus zu rechnen wie die Höhe und die Breite ist. Ändert sich die Fenstergröße hab ich dann scheinbar wieder ein Problem?
Ich habe so ziemlich viel ausprobiert. Mit einer Pane und v-und hBoxen in verschiedenen kombinationen. Bei allen bin ich immer an dem Problem gestoßen mit der automatischen Breite oder Höhe ohne Parameter definitiv anzu geben.
Ausserdem sind Dateinamen mal länger und deshalb hatte ich mich dann für eine SplitPane entschieden wo ich im gegensatz zu BorderPane Bereiche anpassen kann.
Aber wenn du da interesante Möglichkeiten hast das Problem zu lösen würde ich es mir gerne mal ansehen.

 

[KonradN]

Ich habe da jetzt noch nichts gross probiert, aber das, was Du da in Blau und Grün dargestellt hast, sieht doch auch wieder stark nach einem BorderPane aus D hast oben die grüne Leiste und unten die weisse. Und dann hast Du 3 Elemente, die halt Links, Mitte und Rechts sein könnten.

Du kannst also die diversen Pane auch verschachteln. Du musst da also nicht mit HBox und VBox auf Zwang was machen (wobei das auch gehen müsste, aber halt mit viel mehr eigenem Aufwand). Das aber einfach nur als ein schneller Einwurf.

 

[MiMa]

Nein, eigentlich sollte in der linken Border Pane so aussehen

oben in der anderen Grafik siehtst du das weisse, weil die Box nicht nach unten automatisch anschlägt.
Und rechts der Hellrüne bereich siehst du auch nur weil die Box rechts nicht anschlagt.
Das sind die Problemantiken die ich versucht habe zu erläuftern.
Der Linek BorderPane Bereich sollte so aussehen.

Der Grüne Bereich oben für eine toolbar horizontal und links der dunkelblaue Bereich für eine Toolbar links die ein und ausgeschaltet wird. und der Hellblaue Bereich ist der die ListView darstellt. dieser bereich erweitert sich auf die gesamte Breite wenn der dunkelblaue Bereich ausgeblendt wird und verringert sich wieder wenn der dunkelblaue Bereich wieder eingeschaltet wird.

Also aktuell habe ich das Problem relativ einfach mit der AnkerPane gelöst, das mit den h -und vHoxen scheint nicht wirklich zu funktionieren?! Zumindest habe ich das nicht hin bekommen.

 

[KonradN]

Also ich habe massive Probleme, Dich hier zu verstehen. Daher ist es ganz wichtig, dass man konkreten Code hat, an dem man
a) Probleme nachvollziehen / verstehen kann
b) Lösung ausprobieren kann

Evtl. habe ich das Problem gefunden. Ich habe einfach mal mit meinem Beispiel etwas herum gespielt und da dann die Seite zum Ausblenden von rechts nach links gepackt und siehe da: Der Platz war auch weiterhin vorhanden - die center pane is nicht nach links verschoben worden.

Das Problem ist, dass auch eine unsichtbare pane weiterhin seinen Platz einnimmt. Man könnte die Pane komplett heraus nehmen, oder man sagt zusätzlich, dass diese nicht mehr managed ist: contentPane.setManaged(!contentPane.isManaged());

Der Beispiel-Code hat sich somit nun etwas geändert:

    @Override
    public void start(Stage primaryStage) throws IOException {
        BorderPane root = new BorderPane();
        Scene scene = new Scene(root, 300, 200);

        // Pane mit Label erstellen
        Pane contentPane = new Pane();
        contentPane.setPrefSize(200, 200);
        contentPane.setStyle("-fx-background-color: lightblue;");
        Label label = new Label("Dies ist eine versteckte Pane");
        contentPane.getChildren().add(label);

        Button toggleButton = new Button("Ein-/Ausblenden");
        toggleButton.setOnAction(e -> {
            contentPane.setVisible(!contentPane.isVisible());
            contentPane.setManaged(!contentPane.isManaged());
        });

        Pane buttonPane = new Pane();
        buttonPane.setStyle("-fx-background-color: green;");
        buttonPane.getChildren().add(toggleButton);

        root.setCenter(buttonPane);
        root.setLeft(contentPane);

        primaryStage.setScene(scene);
        primaryStage.setTitle("Pane ein/ausblenden");
        primaryStage.show();
    }

Das ist dann jetzt hoffentlich ein besseres Beispiel - und damit so ein Fehler auffällt, habe ich das center auch eingefärbt.

 

[MiMa]

Hallo Konrad,
wie ich sehe, hast du das Problem immer noch nicht verstanden.
HBox und VBox in der obersten Struktur zu nutzen, funktioniert schon.
Zwei Boxen nebeneinander zeigen nicht das Problem, es tritt erst auf wenn die Verschatelung größer ist.
Sobald man zwei HBoxen in einen continer einfügt und in der untersten H-Box zwei VBoxen drin sind, passen sich die vboxen und die untere HBox nicht mehr an.
Hier habe ich mal ein Video welches ich mit AnkerPane gelöst habe .
Ich werde das mas Problem mit den box container nicht mehr weiter Verfolgen.
BoderPane links mit Tollbars und Dateiliste

 

[KonradN]

wie ich sehe, hast du das Problem immer noch nicht verstanden.

Genau deshalb habe ich zwei Mal um konkrete Beispiele in Code gebeten zusammen mit einer Beschreibung.

Aber wenn Du dieses Problem nicht weiter verfolgen willst, dann ist es ok für mich.