JavaFX 2 BorderPane Usa spazio pieno

Question

Sto solo affrontando un piccolo problema che non riesco a risolvere da solo. Cerco di inserire un vBox che includa un campo di testo e un editor HTML nel mio BorderPane, ma lo spazio intero non viene utilizzato per lo . Un altro problema è che se rimpicciolisco la finestra, l'editor html si sovrappone alla mia finestra delle opzioni a sinistra.

private void initEditor() 
{ 
editor = new HTMLEditor(); 
editor.setId("editor"); 
editor.lookup(".top-toolbar").setDisable(true); 
editor.lookup(".top-toolbar").setManaged(false); 
((ToolBar) editor.lookup(".bottom-toolbar")).getItems().addAll(FXCollections.observableArrayList(((ToolBar)editor.lookup(".top-toolbar")).getItems())); 

editorBox = new VBox(); 
TextField field = new TextField(); 
field.setPrefHeight(36); 
field.setId("editor-title"); 
editorBox.setFillWidth(true); 
editorBox.getChildren().addAll(field, editor); 
    root.setCenter(editorBox); 
} 

Answer 1

OK, quindi alcune cose va male qui, cercherò di affrontarle fornire qualche consiglio e una soluzione del campione.

Provo a inserire un vBox che include un campo di testo e un editor HTML nel mio BorderPane, ma non viene utilizzato lo spazio completo.

È necessario utilizzare il metodo VBox.setVgrow(editor, Priority.ALWAYS) per consentire a HTMLEditor di occupare spazio aggiuntivo nel VBox. Inoltre, assicurati che HTMLeditor abbia un'altezza massima illimitata in modo che possa crescere per adattarsi all'area disponibile, ad esempio editor.setMaxSize(Double.MAX_VALUE, Double.MAX_VALUE). La chiamata a editorBox.setFillWidth(true) è ridondante poiché il valore predefinito per la proprietà fillWidth è true.

Ma anche se si fa tutto ciò, (come in 2.2b13) c'è un errore nel dimensionamento di WebPane che causa problemi. Internamente il WebPane è implementato come GridPane contenente la barra degli strumenti e una WebView modificabile. Per impostazione predefinita, WebView ha una dimensione preferita di 800x600. Il controllo HtmlEditor non imposta i vincoli GridPane per WebView per consentirne la ridimensionamento rispetto alla dimensione preferita.

Per aggirare il problema, è possibile cercare WebView tramite una ricerca CSS dopo è stato aggiunto a una Scena attiva e regolare manualmente i vincoli GridPane. Ecco il codice per farlo:

stage.show(); 
... 
WebView webview = (WebView) editor.lookup("WebView"); 
GridPane.setHgrow(webview, Priority.ALWAYS); 
GridPane.setVgrow(webview, Priority.ALWAYS); 

rifuggo la finestra, l'editor html si sovrappone con la mia finestra l'opzione di sinistra.

Imposta in modo esplicito l'impostazione della larghezza minima per il riquadro centrale in BorderPane in modo che non possa traboccare sul bordo esterno.

editorBox.setMinSize(0, 0); 

Hai bisogno di fare questo perché i BorderPane documentation stati:

BorderPane non ritaglia il suo contenuto di default, quindi è possibile che i limiti per bambini possono estendersi al di fuori dei propri confini se min di un bambino la dimensione impedisce che si adatti al suo spazio.

---

Per inciso le chiamate di ricerca nel codice sono sospettosi. Normalmente non è possibile cercare i nodi tramite ID css finché il nodo non è stato aggiunto a una scena attiva su uno stage visualizzato e il sistema JavaFX ha avuto la possibilità di eseguire un passaggio di layout CSS sul nodo, altrimenti la ricerca restituirà null.

---

Per il debug di problemi di layout JavaFX, l'applicazione ScenicView è inestimabile.

---

Ecco un esempio completo per generare un layout simile all'immagine collegata nella domanda, ma senza i problemi che menzioni.

import com.javafx.experiments.scenicview.ScenicView; 
import java.io.BufferedReader; 
import java.io.IOException; 
import java.io.InputStreamReader; 
import java.net.URL; 
import javafx.application.Application; 
import javafx.scene.Scene; 
import javafx.scene.control.*; 
import javafx.scene.layout.*; 
import javafx.scene.web.*; 
import javafx.stage.*; 

public class HtmlEditorInBorderPane extends Application { 
    public static void main(String[] args) { launch(args); } 
    @Override public void start(final Stage stage) throws IOException { 
    // option pane. 
    VBox optionPane = new VBox(10); 
    MenuBar menuBar = new MenuBar(); 
    menuBar.getMenus().addAll(new Menu("School"), new Menu("Social"), new Menu("Network")); 
    TreeItem<String> root = new TreeItem<>("Private Notes"); 
    root.setExpanded(false); 
    root.getChildren().addAll(new TreeItem<>("Layout"), new TreeItem<>("is not"), new TreeItem<>("easy")); 
    TreeView<String> notes = new TreeView<>(root); 
    optionPane.getChildren().addAll(menuBar, new Label("Kaiser Notes"), notes); 
    optionPane.setStyle("-fx-background-color: cornsilk; -fx-padding: 10;"); 

    // editor pane. 
    HTMLEditor editor = new HTMLEditor(); 
    VBox editorBox = new VBox(10); 
    TextField textField = new TextField(); 
    editorBox.getChildren().addAll(textField, editor); 
    editorBox.setStyle("-fx-background-color: mistyrose; -fx-padding: 10;"); 
    editor.setHtmlText(getSampleText()); 

    // option layout constraints 
    VBox.setVgrow(notes, Priority.ALWAYS); 

    // editor layout constraints 
    textField.setMinHeight(Control.USE_PREF_SIZE); // stop the textfield from getting squashed when the scene is sized small. 
    VBox.setVgrow(editor, Priority.ALWAYS);  // tells the editor to fill available vertical space. 
    editorBox.setMinSize(0, 0);     // stops the editor from overflowing it's bounds in a BorderPane. 

    // layout the scene. 
    BorderPane layout = new BorderPane(); 
    layout.setLeft(optionPane); 
    layout.setCenter(editorBox); 
    stage.setScene(new Scene(layout)); 
    stage.show(); 

    // addition of static layout grow constraints for the htmleditor embedded webview. 
    WebView webview = (WebView) editor.lookup("WebView"); 
    GridPane.setHgrow(webview, Priority.ALWAYS); // allow the webview to grow beyond it's preferred width of 800. 
    GridPane.setVgrow(webview, Priority.ALWAYS); // allow the webview to grow beyond it's preferred height of 600. 
    } 

    // get some dummy lorem ipsum sample text. 
    private String getSampleText() throws IOException { 
    StringBuilder builder = new StringBuilder(); 
    try (BufferedReader in = new BufferedReader(new InputStreamReader(new URL("http://www.lorem-ipsum-text.com/").openStream()))) { 
     String string; 
     while ((string = in.readLine()) != null) { 
     builder.append(string); 
     } 
    } 
    return builder.toString(); 
    } 
} 

Answer 2

GridPane gridPane = (GridPane) editor.getChildrenUnmodifiable().get(0); 
    RowConstraints row1 = new RowConstraints(); 
    row1.setVgrow(Priority.NEVER); 
    RowConstraints row2 = new RowConstraints(); 
    row2.setVgrow(Priority.NEVER); 
    RowConstraints row3 = new RowConstraints(); 
    row3.setVgrow(Priority.ALWAYS); 
    gridPane.getRowConstraints().addAll(row1, row2, row3);