Add custom component to FXML scene builder in intelliJ
Asked Answered
A

1

2

I want to add a custom component / custom components to the javafx scene builder in intelliJ. I'm currently using java 8.1. I heard that adding components to the scene builder is possible with java 10 because it has java 2.0. I have java 10 installed, but I don't know how to switch to that version of java. So if you know how to solve this problem, I'd love to hear it.

Thanks in advance,

Lenardjee

Edit: I see why this problem is simular to other posts, for the direct problem is directly adding the custom component to the scene builder. However, that problem has an underlying reason for existing, being the fact that I use the editor in intelliJ and that editor is for javafx 1.0 or so, and the function of adding custom components is supported by the editor for javafx 2.0, which is in java 10. Now the real problem is: how do I update the scene builder in intelliJ? I have java 10 already installed but my project is still using java 8.1 and I don't know how to change it. I hope this explains why my question is relevant and so not a duplicate. Thanks for reading this explanation that is longer than the initial question ;p

Ancell answered 27/6, 2018 at 13:44 Comment(3)
Possible duplicate of Adding a custom component to SceneBuilder 2.0Buckman
#50875403Hamish
@mrmcwolf thanks for your answer, I can now add custom components to the scene builder, but it wasn't completely what I meant. What I meant is that I want to be able to add my own custom components to the scene builder. I want to be able to make a java class, extending Pane or so, then assign children and actions to it, such as a slidebar with a textfield next to it, showing the value. I know that in the scene builder app, that is possible by importing a jar file with the class and dependencies straight into the scene builder, but I don't know how to do that in the scene builder in intelliJ.Ancell
H
3

I want to be able to make a java class, extending Pane or so, then assign children and actions to it, such as a slidebar with a textfield next to it, showing the value. I know that in the scene builder app, that is possible by importing a jar file with the class and dependencies straight into the scene builder, but I don't know how to do that in the scene builder in intelliJ.

There is no difference in how you use Scene Builder. You just add properties in user control (with getters and setters if the property is not read only). In this case, the properties will appear in the Scene Builder inspector, and you will be able to manipulate them either by them or by directly editing the FXML file.

Here's an example (java 8, but this is irrelevant)

mycontrol.fxml

<fx:root type="javafx.scene.layout.HBox" xmlns="http://javafx.com/javafx" xmlns:fx="http://javafx.com/fxml">
    <Label fx:id="label"/>
    <Slider fx:id="slider" HBox.hgrow="ALWAYS"/>
</fx:root>

public class MyControl extends HBox {

    @FXML
    private Label label;

    @FXML
    private Slider slider;

    private StringProperty labelName = new SimpleStringProperty();
    private DoubleProperty sliderPos = new SimpleDoubleProperty();

    public MyControl() {
        try {
            FXMLLoader l = new FXMLLoader(getClass().getResource("mycontrol.fxml"));
            l.setController(this);
            l.setRoot(this);
            l.load();
        }
        catch (IOException e) {
            e.printStackTrace();
        }
    }

    @FXML
    private void initialize() {
        slider.setMin(0.0);
        slider.setMax(100.0);

        label.textProperty().bindBidirectional(labelName);
        slider.valueProperty().bindBidirectional(sliderPos);
    }

    public String getLabelName() {
        return labelName.get();
    }

    public StringProperty labelNameProperty() {
        return labelName;
    }

    public void setLabelName(String labelName) {
        this.labelName.set(labelName);
    }

    public double getSliderPos() {
        return sliderPos.get();
    }

    public DoubleProperty sliderPosProperty() {
        return sliderPos;
    }

    public void setSliderPos(double sliderPos) {
        this.sliderPos.set(sliderPos);
    }
}

And this is the scene in which this user control is used

sample.fxml

<AnchorPane xmlns:fx="http://javafx.com/fxml/1" xmlns="http://javafx.com/javafx/8.0.121" fx:controller="sample.Controller">
    <MyControl labelName="Test name" sliderPos="25.0" />
</AnchorPane>

And this is the working view in IntelliJ

Hamish answered 28/6, 2018 at 11:24 Comment(1)
Ok, first, this makes things a lot more clear. Thing is: this means that I can only add my component via the FXML file, and not directely in the scene builder, for there is no custom components tab. Now I figured out that I can add custom components to the scene builder app. I would like to add these custom parts to the app, but therefore, I would need a jar file to import. I'll try to get that to work, and then I'll see if I can do the same for the editor in the IDE. Thank you very much for the answer, it helped me out!Ancell

© 2022 - 2024 — McMap. All rights reserved.