resize - Layout for JavaFX with resizable component and bindings, is this proper? (image included) -

i'm creating 2x2 grid contain components inside of them. following image:

i'm unsure proper layout should this. problem bottom right isn't aligned... i'm guessing grid layout won't work (or can it?). figured i'd borderpane , have top contain top 2 panes, , bottom contain bottom two, borderpane in , go there.

1) way approach (border layout ignoring center), or there better layout?

next: blue box resize based on how large full screen is. problem run after growing large, when it's shrunk, black boxes (which should stay same dimensions, excluding ones touch blue sides should resize)

2) there way make black boxes adjust size of blue box?

by mean: if blue box grows vertically, top right pane have extend vertically well. likewise, have shrink if blue 1 does. can done binding both heights? since bottom rectangles won't expand, there way bind if height of entire pane x bound height javafx calculate me x - bottomfixedheight, yet not go smaller lets 128 (as arbitrary example)?

note: i'm not familiar multiple bindings, i'm trying google though maybe example help.

background

imho, borderpane best layout can use above stated scenario.

the javadoc borderpane says,

the top , bottom children resized preferred heights , extend width of border pane. left , right children resized preferred widths , extend length between top , bottom nodes. , center node resized fill available space in middle.

so using top , bottom not suitable scenario. suggest go center , bottom.

---

solution

now have decided use borderpane, let decide layout can use filling 4 space.

1. as can see in above picture, can use center , right of borderpane create upper part. let add vbox center , right space of borderpane. vbox on right side must have pref_width , max_width specified make sure doesn't exceed supplied width. if want have min_width, can supply well.
2. for bottom, can use hbox, add 2 vbox it. first vbox, want exceed in width, when re-sized, set hbox.hgrow="always". bottom right vbox, again set width did top-right vbox , hbox.hgrow="never".

note : you can replace vbox preferred layout. pref_width , pref_height used initial width , height

i have created sample using scenebuilder , output is, shown

fxml

<borderpane minwidth="-infinity" prefheight="400.0" prefwidth="600.0" xmlns="http://javafx.com/javafx/8" xmlns:fx="http://javafx.com/fxml/1">    <bottom>       <hbox prefheight="100.0" prefwidth="200.0" borderpane.alignment="center">          <children>             <vbox prefheight="100.0" prefwidth="100.0" style="-fx-border-color: green;" hbox.hgrow="always" />             <vbox minwidth="70.0" prefheight="200.0" prefwidth="70.0" style="-fx-border-color: black;" hbox.hgrow="never" />          </children>       </hbox>    </bottom>    <right>       <vbox minwidth="100.0" prefheight="200.0" prefwidth="100.0" style="-fx-border-color: red;" borderpane.alignment="center" />    </right>    <center>       <vbox prefheight="200.0" prefwidth="100.0" style="-fx-border-color: blue;" borderpane.alignment="center" />    </center> </borderpane> 

authors note : though not consider binding important here, can anyway use if desire better control.