I have the following JavaFX FXML structure:
<BorderPane fx:id="mainWindow" prefHeight="500.0" prefWidth="800.0" styleClass="mainFxmlClass" xmlns:fx="http://javafx.com/fxml/1">
<stylesheets>
<URL value="@mainwindow.css"/>
</stylesheets>
<top>
<fx:include fx:id="buttonPanel" source="/com/example/app/chart/buttons/buttonPanel.fxml" />
</top>
<center>
<BorderPane fx:id="chartContainer">
<center>
<fx:include fx:id="chartPanel" source="/com/example/app/chart/chartpanel/chartPanel.fxml" />
</center>
<right>
<fx:include fx:id="rightAxisPanel" source="/com/example/app/chart/rightaxis/rightAxisPanel.fxml" />
</right>
</BorderPane>
</center>
</BorderPane>
Being chartPanel
and rightAxisPanel
:
<AnchorPane fx:id="chartPanel" styleClass="chartPanelClass" xmlns:fx="http://javafx.com/fxml/1">
<stylesheets>
<URL value="@chartpanel.css"/>
</stylesheets>
</AnchorPane>
and
<AnchorPane fx:id="rightAxisPanel" prefWidth="100.0" minWidth="100.0" styleClass="rightAxisPanelClass" xmlns:fx="http://javafx.com/fxml/1">
<stylesheets>
<URL value="@rightaxispanel.css"/>
</stylesheets>
</AnchorPane>
This generates the following figure:
So far, so good.
But if I reduce the size of the window, the right panel is the one that is truncated -see how yellow area which corrsponds to the rigthAxisPanel is truncated-.
How can I do to get the central panel the one being truncated?
The minimal width of the center AnchorPane
prevents it from shrinking. Set the value to 0 to make sure it's allowed to shrink.
Furthermore you should apply a clip
to the AnchorPane
to avoid it's content from showing up to the right of it's right bound. This could happen, if you use (half) transparent background on the right, change the viewOrder
or if you put a right node in the outer BorderPane
.
<AnchorPane fx:id="chartPanel" styleClass="chartPanelClass" xmlns:fx="http://javafx.com/fxml/1" minWidth="0">
<stylesheets>
<URL value="@chartpanel.css"/>
</stylesheets>
<clip>
<Rectangle width="${chartPanel.width}" height="${chartPanel.height}"/>
</clip>
</AnchorPane>