JavaFX: Button's width in custom gridpane

Question

I would like to have buttons with equal(maximum) width in a gridpane.

When I'm trying to set it directly in FXML - it works perfectly.

<?xml version="1.0" encoding="UTF-8"?>
<?import javafx.scene.control.Button?>
<?import javafx.scene.layout.*?>
<AnchorPane xmlns="http://javafx.com/javafx/8" xmlns:fx="http://javafx.com/fxml/1"
            fx:controller="TestController">
    <children>
        <GridPane AnchorPane.leftAnchor="0" AnchorPane.rightAnchor="0" AnchorPane.bottomAnchor="0"
                  AnchorPane.topAnchor="0">
            <columnConstraints>
                <ColumnConstraints hgrow="SOMETIMES" percentWidth="50.0"/>
                <ColumnConstraints hgrow="SOMETIMES" percentWidth="50.0"/>
            </columnConstraints>
            <children>
                <Button maxWidth="Infinity" text="Button1" GridPane.columnIndex="0"/>
                <Button maxWidth="Infinity" text="Button2" GridPane.columnIndex="1"/>
            </children>

        </GridPane>
    </children>
</AnchorPane>

But when I wanted to separate the whole grid into a custom control, the buttons stopped to fill the available width.

Here's a FXML:

<?xml version="1.0" encoding="UTF-8"?>
<?import javafx.scene.layout.*?>
<?import CustomGridPane?>
<AnchorPane xmlns="http://javafx.com/javafx/8" xmlns:fx="http://javafx.com/fxml/1"
            fx:controller="TestController">
    <children>
        <CustomGridPane AnchorPane.leftAnchor="0" AnchorPane.rightAnchor="0" AnchorPane.bottomAnchor="0" AnchorPane.topAnchor="0">
        </CustomGridPane>
    </children>
</AnchorPane>

And an extension:

public class CustomGridPane extends GridPane {

    private Button button1 = new Button("button1");
    private Button button2 = new Button("button2");

    public CustomGridPane() {
        super();
        button1.maxWidth(Double.MAX_VALUE);
        button2.maxWidth(Double.MAX_VALUE);

        getColumnConstraints().add(new ColumnConstraints());
        getColumnConstraints().add(new ColumnConstraints());
        getColumnConstraints().get(0).setPercentWidth(50);
        getColumnConstraints().get(0).setHgrow(Priority.SOMETIMES);
        getColumnConstraints().get(1).setPercentWidth(50);
        getColumnConstraints().get(1).setHgrow(Priority.SOMETIMES);

        add(button1, 0, 0);
        add(button2, 1, 0);
    }
}

Am I missing something?

Answer 1

You are using maxWidth property getter instead of the method setMaxWidth (setter).

Please see the documentation of Button here

public final double maxWidth(double height)

Called during layout to determine the maximum width for this node. Returns the value from computeMaxWidth(forHeight) unless the application overrode the maximum width by setting the maxWidth property.

Replace the two lines with maxWidth(...) by these ones:

    button1.setMaxWidth(Double.MAX_VALUE);
    button2.setMaxWidth(Double.MAX_VALUE);

Answer 2

This can be achieved inside scene builder also...

I required this, while creating a calculator, with the buttons inside gridpane.

Happy Coding (: