I have a problem with my custom component in JavaFX.
My custom component contains split pane that contains TableView and TabPane:
MasterDetail.fxml
<fx:root type="javafx.scene.layout.VBox" xmlns="http://javafx.com/javafx/8" xmlns:fx="http://javafx.com/fxml/1">
<children>
<SplitPane dividerPositions="0.5" orientation="VERTICAL">
<items>
<AnchorPane>
<children>
<TableView fx:id="table"/>
</children>
</AnchorPane>
<AnchorPane>
<children>
<TabPane fx:id="tabPane"/>
</children>
</AnchorPane>
</items>
</SplitPane>
</children>
</fx:root>
I want to use my custom control in another fxml so I created it and how I can declare columns for TableView in my MasterDetail component?
For example I want to do something like this:
<MasterDetail fx:id="masterDetail">
<table>
<columns>
<TableColumn fx:id="nameColumn" prefWidth="75.0" text="Name"/>
<TableColumn fx:id="createDateColumn" prefWidth="75.0" text="Create date"/>
</columns>
</table>
</MasterDetail>
It is ever possible to do this in fxml?
It is possible to define the number of table columns in the 'masterDetail' component. But to happen we have to define custom properties which reads the table columns.
Example :
<CustomeTable>
<children>
<TableView fx:id="table"/>
</children>
</CustomeTable>
Define CustomeTable which extends AnchorPane.
public class CustomeTable extends AnchorPane{
private ObjectProperty<Integer> noOfColumns = new SimpleObjectProperty<Integer>();
public void setNoOfColumns(Integer noOfColumns){
noOfColumns.set(noOfColumns);
}
public Integer getNoOfColumns(){
return noOfColumns.get();
}
public CustomeTable(){
// add the listener to the ObjectProperty
// which updates the noOfColumns into table
noOfCoulmns.addListener();
}
}
Related
I have an issue since I do how know, how to add new components to fx:root container child.
This is what I have at the moment.
Root element called PopupContainer
<fx:root type="StackPane" alignment="CENTER" xmlns:fx="http://javafx.com/fxml"
styleClass="popup">
<VBox alignment="CENTER">
<HBox alignment="CENTER">
<VBox fx:id="content" alignment="CENTER" spacing="5" styleClass="whiteBackground, blackborder"
fillWidth="false" StackPane.alignment="CENTER">
<!-- this is where I would like to add components -->
</VBox>
</HBox>
</VBox>
</fx:root>
I have controller for it as well.
Now, I would like to use it like this in some other fxml:
<PopupContainer xmlns="http://javafx.com/javafx"
xmlns:fx="http://javafx.com/fxml"
fx:controller="com.example.bank.editbank.EditBankPresenter"
styleClass="popup"
fx:id="container">
<!-- those components should go to VBOX up there -->
<ViewTitle label="%editBankUC"/>
<Button fx:id="someButton" text="Click me"/>
</PopupContainer>
Of course, when I add components they go directly under StackPane since it is root of the layout. I tried to override getChildren() method to return VBox children but I got children cycle detected. I do not want to add them programatically since it is more then 300 such cases in application but I can add new tag (instead of for example something else). Thanks!
Answering my own question because I think someone else would like to know this too.
So, as I already had before, this is PopupContainer.fxml:
<?xml version="1.0" encoding="UTF-8"?>
<?import javafx.scene.layout.StackPane?>
<?import javafx.scene.layout.VBox?>
<?import javafx.scene.layout.HBox?>
<?import javafx.geometry.Insets?>
<fx:root type="StackPane" alignment="CENTER" xmlns:fx="http://javafx.com/fxml"
styleClass="popup">
<VBox fx:id="child1" alignment="CENTER">
<HBox alignment="CENTER">
<VBox fx:id="content" alignment="CENTER" spacing="5" styleClass="whiteBackground, blackborder"
fillWidth="false" StackPane.alignment="CENTER">
<padding>
<Insets topRightBottomLeft="10.0" />
</padding>
</VBox>
</HBox>
</VBox>
</fx:root>
And controller PopupContainer.java:
import javafx.collections.ObservableList;
import javafx.fxml.FXML;
import javafx.fxml.FXMLLoader;
import javafx.scene.Node;
import javafx.scene.layout.StackPane;
import javafx.scene.layout.VBox;
import java.io.IOException;
public class PopupContainer extends StackPane {
//refference to VBox from layout
#FXML private VBox content;
public PopupContainer() {
FXMLLoader fxmlLoader = new FXMLLoader(getClass().getResource("PopupContainer.fxml"));
fxmlLoader.setRoot(this);
fxmlLoader.setController(this);
try {
fxmlLoader.load();
} catch (IOException exception) {
throw new RuntimeException(exception);
}
}
//note this getter, this is the key that allow you to add childred to child of this component
public ObservableList<Node> getItems() {
return content.getChildren();
}
}
And at the end usage goes like this:
<PopupContainer xmlns="http://javafx.com/javafx"
xmlns:fx="http://javafx.com/fxml"
fx:controller="com.example.bank.editbank.EditBankPresenter"
styleClass="popup"
fx:id="container"
>
<!-- this is what was acceptable to do in question so instead of children I am using items (setter in PopupContainer.java) -->
<items>
<ViewTitle label="%editBankUC"/>
<HBox VBox.vgrow="ALWAYS">
<Pane minWidth="20"/>
<VBox alignment="CENTER" spacing="5">
<HorizontalTextInput fx:id="name" label="%nameUC" alignment="CENTER_RIGHT" />
<HorizontalTextInput fx:id="bic" label="%bicUC" alignment="CENTER_RIGHT" />
<AddressInput fx:id="address" />
<HorizontalCheckboxInput fx:id="active" label="%activeUC" />
</VBox>
<Pane minWidth="20"/>
</HBox>
<HBox alignment="CENTER" spacing="5">
<JFXButton fx:id="close" onAction="#closeView" text="%closeUC" />
<JFXButton fx:id="edit" onAction="#editClicked" />
<padding>
<Insets top="10.0" bottom="10.0" />
</padding>
</HBox>
</items>
</PopupContainer>
I hope it is clear, how to add it. I did not find nothing familiar to this elsewhere but looking at the source of BorderPane can give you a hint how to do it. Cheers
I am trying to solve an issue with a calculator project I am working on with javafx 11 and java11 using Scene Builder. I am trying to figure out a way to make the buttons on the calculator change color when typing the corresponding value from the keyboard. Is there a method, or onKeyPressed etc type solution to this issue?
I was able to make the button change colors when the a user clicks on it with a mouse (changes to green). This was accomplished in my css style sheet. I tried to add a method to my onKeyReleased method in my controller class, and could change the background that way, but could not determine a way to have the color change back in a timely manner without causing a lag on the UI. I want the UI to change colors similar to most calculators such as the standard windows calculator. This is where a user holds the key down and it changes color, and when releasing the key it changes back.
//main.java
import javafx.application.Application;
import javafx.fxml.FXMLLoader;
import javafx.scene.Parent;
import javafx.scene.Scene;
import javafx.scene.image.Image;
import javafx.stage.Stage;
public class Main extends Application {
#Override
public void start(Stage primaryStage) throws Exception {
Parent root =
FXMLLoader.load(getClass().getResource("calculator.fxml"));
primaryStage.getIcons().add(new Image("CALC.png"));
primaryStage.setTitle(" TS Calculator");
primaryStage.setScene(new Scene(root, 250, 375));
primaryStage.setResizable(true);
primaryStage.setMinHeight(375);
primaryStage.setMinWidth(250);
primaryStage.show();
}
public static void main(String[] args) {
launch(args);
}
/CSS
Button{
-fx-background-color: black;
-fx-text-align: center;
-fx-text-fill: white;
-fx-border-color: green;
-fx-font-size: 1em;
-fx-border-radius: 10 10 10 10;
-fx-background-radius: 10 10 10 10;
}
Button:pressed{
-fx-background-color: green;
}
TextField{
-fx-font-size: 1.5em;
}
//FXML (Only showing 1 button)
<?xml version="1.0" encoding="UTF-8"?>
<?import javafx.scene.control.Button?>
<?import javafx.scene.control.TextField?>
<?import javafx.scene.layout.AnchorPane?>
<?import javafx.scene.layout.ColumnConstraints?>
<?import javafx.scene.layout.GridPane?>
<?import javafx.scene.layout.RowConstraints?>
<GridPane maxHeight="1.7976931348623157E308"
maxWidth="1.7976931348623157E308" minHeight="306.00" minWidth="204.0"
prefHeight="288.0" prefWidth="208.0" style="-fx-background-color:
DARKSLATEGREY; -fx-border-color: green;"
stylesheets="#styles.css" xmlns="http://javafx.com/javafx/11.0.1"
xmlns:fx="http://javafx.com/fxml/1"
fx:controller="com.trevorsmith.Controller"
onKeyReleased="#acceptKeyboardInput">
<AnchorPane prefHeight="200.0" prefWidth="200.0" GridPane.columnSpan="4"
GridPane.hgrow="ALWAYS" GridPane.vgrow="ALWAYS"
onKeyPressed="#acceptKeyboardInput">
<children>
<TextField fx:id="textFieldDisplay" editable="false"
alignment="CENTER_RIGHT" maxHeight="1.7976931348623157E308"
maxWidth="1.7976931348623157E308" prefWidth="196.0"
AnchorPane.bottomAnchor="2.0" AnchorPane.leftAnchor="2.0"
AnchorPane.rightAnchor="2.0" AnchorPane.topAnchor="2.0" />
</children>
</AnchorPane>
<AnchorPane maxHeight="1.7976931348623157E308"
maxWidth="1.7976931348623157E308" prefHeight="200.0" prefWidth="200.0"
GridPane.hgrow="ALWAYS" GridPane.rowIndex="1" GridPane.vgrow="ALWAYS">
<children>
<Button maxHeight="1.7976931348623157E308"
maxWidth="1.7976931348623157E308" text="0" AnchorPane.bottomAnchor="0.0"
AnchorPane.leftAnchor="2.0" AnchorPane.rightAnchor="0.0"
AnchorPane.topAnchor="0.0" />
</children>
I am unable to make the background color change on click, and when I release my key it change back.
You'll want to register a couple of listeners on your Scene to listen to the pressed keys.
Once you have the key, you can use JavaFX's PseudoClass selectors to update the pressed style of each Button.
There could be a more streamlined way to do this, but this is my implementation. Here is a complete sample you can try out to see it in action.
Note that I did not implement the actual functionality of the calculator.
Final result/screenshot at the end.
Main.java:
import javafx.application.Application;
import javafx.fxml.FXMLLoader;
import javafx.scene.Scene;
import javafx.stage.Stage;
import java.io.IOException;
public class Main extends Application {
public static void main(String[] args) {
launch(args);
}
#Override
public void start(Stage primaryStage) {
try {
FXMLLoader loader = new FXMLLoader(getClass().getResource("MainLayout.fxml"));
Scene scene = new Scene(loader.load());
scene.getStylesheets().add("style.css");
primaryStage.setScene(scene);
primaryStage.setTitle("Calculator");
primaryStage.show();
} catch (IOException e) {
e.printStackTrace();
}
}
}
MainLayout.fxml:
<?xml version="1.0" encoding="UTF-8"?>
<?import javafx.geometry.Insets?>
<?import javafx.scene.control.*?>
<?import javafx.scene.layout.*?>
<VBox alignment="TOP_CENTER" spacing="10.0" xmlns="http://javafx.com/javafx/11.0.1" xmlns:fx="http://javafx.com/fxml/1"
fx:controller="UI.BaseApps.Calculator.MainController">
<padding>
<Insets bottom="10.0" left="10.0" right="10.0" top="10.0"/>
</padding>
<children>
<TextField fx:id="txtDisplay" disable="true" alignment="CENTER_RIGHT" editable="false" minHeight="-Infinity"
prefHeight="50.0" text="0"/>
<GridPane hgap="10.0" vgap="10.0" VBox.vgrow="ALWAYS">
<columnConstraints>
<ColumnConstraints hgrow="SOMETIMES" minWidth="-Infinity"/>
<ColumnConstraints hgrow="SOMETIMES" minWidth="-Infinity"/>
<ColumnConstraints hgrow="SOMETIMES" minWidth="-Infinity"/>
<ColumnConstraints hgrow="NEVER" minWidth="-Infinity"/>
<ColumnConstraints hgrow="SOMETIMES" minWidth="-Infinity"/>
<ColumnConstraints hgrow="SOMETIMES" minWidth="-Infinity"/>
</columnConstraints>
<rowConstraints>
<RowConstraints minHeight="-Infinity" vgrow="SOMETIMES"/>
<RowConstraints minHeight="-Infinity" vgrow="SOMETIMES"/>
<RowConstraints minHeight="-Infinity" vgrow="SOMETIMES"/>
<RowConstraints minHeight="-Infinity" vgrow="SOMETIMES"/>
</rowConstraints>
<children>
<Button fx:id="btn7" maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308"
mnemonicParsing="false" prefHeight="50.0" prefWidth="50.0" text="7"/>
<Button fx:id="btn8" maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308"
mnemonicParsing="false" prefHeight="50.0" prefWidth="50.0" text="8" GridPane.columnIndex="1"/>
<Button fx:id="btn9" maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308"
mnemonicParsing="false" prefHeight="50.0" prefWidth="50.0" text="9" GridPane.columnIndex="2"/>
<Separator orientation="VERTICAL" prefHeight="200.0" GridPane.columnIndex="3" GridPane.rowSpan="4"/>
<Button fx:id="btnDivide" maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308"
mnemonicParsing="false" prefHeight="50.0" prefWidth="50.0" text="÷" GridPane.columnIndex="4"/>
<Button fx:id="btnClear" maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308"
mnemonicParsing="false" prefHeight="50.0" prefWidth="50.0" text="C" GridPane.columnIndex="5"/>
<Button fx:id="btn4" maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308"
mnemonicParsing="false" prefHeight="50.0" prefWidth="50.0" text="4" GridPane.rowIndex="1"/>
<Button fx:id="btn5" maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308"
mnemonicParsing="false" prefHeight="50.0" prefWidth="50.0" text="5" GridPane.columnIndex="1"
GridPane.rowIndex="1"/>
<Button fx:id="btn6" maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308"
mnemonicParsing="false" prefHeight="50.0" prefWidth="50.0" text="6" GridPane.columnIndex="2"
GridPane.rowIndex="1"/>
<Button fx:id="btnMultiply" maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308"
mnemonicParsing="false" prefHeight="50.0" prefWidth="50.0" text="x" GridPane.columnIndex="4"
GridPane.rowIndex="1"/>
<Button fx:id="btn1" maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308"
mnemonicParsing="false" prefHeight="50.0" prefWidth="50.0" text="1" GridPane.rowIndex="2"/>
<Button fx:id="btn2" maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308"
mnemonicParsing="false" prefHeight="50.0" prefWidth="50.0" text="2" GridPane.columnIndex="1"
GridPane.rowIndex="2"/>
<Button fx:id="btn3" maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308"
mnemonicParsing="false" prefHeight="50.0" prefWidth="50.0" text="3" GridPane.columnIndex="2"
GridPane.rowIndex="2"/>
<Button fx:id="btn0" maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308"
mnemonicParsing="false" text="0" GridPane.columnSpan="2"
GridPane.rowIndex="3"/>
<Button fx:id="btnDecimal" maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308"
mnemonicParsing="false" prefHeight="50.0" prefWidth="50.0" text="." GridPane.columnIndex="2"
GridPane.rowIndex="3"/>
<Button fx:id="btnSubtract" maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308"
mnemonicParsing="false" prefHeight="50.0" prefWidth="50.0" text="-" GridPane.columnIndex="4"
GridPane.rowIndex="2"/>
<Button fx:id="btnAdd" maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308"
mnemonicParsing="false" prefHeight="50.0" prefWidth="50.0" text="+" GridPane.columnIndex="4"
GridPane.rowIndex="3"/>
<Button fx:id="btnEquals" maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308"
mnemonicParsing="false" prefHeight="50.0" prefWidth="50.0" text="="
GridPane.columnIndex="5" GridPane.rowIndex="2" GridPane.rowSpan="2"/>
<Button fx:id="btnBackspace" maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308"
mnemonicParsing="false" prefHeight="50.0" prefWidth="50.0" text="←" GridPane.columnIndex="5"
GridPane.rowIndex="1"/>
</children>
</GridPane>
</children>
</VBox>
MainController.java:
import javafx.application.Platform;
import javafx.css.PseudoClass;
import javafx.fxml.FXML;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.control.TextField;
import javafx.scene.input.KeyCode;
public class MainController {
// Here we'll define our PseudoClass needed to set the style for each pressed Button
private static final PseudoClass PRESSED = PseudoClass.getPseudoClass("pressed");
// Define FXML controls
#FXML
private TextField txtDisplay;
#FXML
private Button btn7, btn8, btn9;
#FXML
private Button btn4, btn5, btn6;
#FXML
private Button btn1, btn2, btn3;
#FXML
private Button btn0, btnDecimal;
#FXML
private Button btnMultiply, btnSubtract, btnAdd, btnDivide;
#FXML
private Button btnClear, btnEquals, btnBackspace;
#FXML
private void initialize() {
// We need access to the Scene to register our key listeners, so we need to wrap the code in a Platform.runLater(). If we try to do this without Platform.runLater(), we'll get a NullPointerException because txtDisplay hasn't been rendered yet.
Platform.runLater(() -> {
Scene scene = txtDisplay.getScene();
// Add a listener to capture any key that is pressed. We add this to the entire scene and we can then change the style of the corresponding button accordingly.
scene.setOnKeyPressed(event -> {
// We need to know which Button we're working with
Button button = getButton(event.getCode());
// Add our "pressed" style to the Button
if (button != null) button.pseudoClassStateChanged(PRESSED, true);
});
// Once the user releases the key, remove our custom style and trigger whatever onAction() code has been applied to the corresponding Button.
scene.setOnKeyReleased(event -> {
Button button = getButton(event.getCode());
if (button != null) {
button.pseudoClassStateChanged(PRESSED, false);
// Fire the button's onAction()
button.fire();
}
});
});
}
// Helper method to get the Button that corresponds to the pressed key. The Scene.setOnKeyPressed() listener provides the KeyCode for the pressed key. We can use that to determine which of our Buttons to trigger.
private Button getButton(KeyCode keyCode) {
switch (keyCode) {
case NUMPAD0: return btn0;
case NUMPAD1: return btn1;
case NUMPAD2: return btn2;
case NUMPAD3: return btn3;
case NUMPAD4: return btn4;
case NUMPAD5: return btn5;
case NUMPAD6: return btn6;
case NUMPAD7: return btn7;
case NUMPAD8: return btn8;
case NUMPAD9: return btn9;
case DECIMAL: return btnDecimal;
case DIVIDE: return btnDivide;
case ADD: return btnAdd;
case MULTIPLY: return btnMultiply;
case SUBTRACT: return btnSubtract;
case ENTER: return btnEquals;
case BACK_SPACE: return btnBackspace;
case ESCAPE: return btnClear;
}
return null;
}
}
style.css:
.text-field {
-fx-opacity: 1.0;
-fx-font-family: Consolas;
-fx-font-size: 200%;
}
.button {
-fx-font-family: Consolas;
-fx-font-size: 150%;
-fx-background-radius: 25px;
-fx-border-radius: 25px;
/* Remove focus highlighting */
-fx-focus-traversable: false;
}
.button:pressed {
-fx-background-color: lightgreen;
-fx-border-color: green;
}
And here is the result:
I have followed tutorials and created my own custom element. It is an AnchorPane containing 6 overlapped canvases to create a graphing framework.
Below is the magnitudeGraph.fxml
<?xml version="1.0" encoding="UTF-8"?>
<?import javafx.scene.canvas.Canvas?>
<?import javafx.scene.layout.AnchorPane?>
<fx:root type="javafx.scene.layout.AnchorPane" minHeight="200.0" minWidth="700.0" prefHeight="300.0" prefWidth="900.0" xmlns="http://javafx.com/javafx/9" xmlns:fx="http://javafx.com/fxml/1">
<children>
<Canvas fx:id="backgroundCanvas" height="300.0" width="900.0" AnchorPane.bottomAnchor="0.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="0.0" />
<Canvas fx:id="series1Canvas" height="300.0" width="900.0" AnchorPane.bottomAnchor="0.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="0.0" />
<Canvas fx:id="series2Canvas" height="300.0" width="900.0" AnchorPane.bottomAnchor="0.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="0.0" />
<Canvas fx:id="series3Canvas" height="300.0" layoutX="7.0" width="900.0" AnchorPane.bottomAnchor="0.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="0.0" />
<Canvas fx:id="series4Canvas" height="300.0" width="900.0" AnchorPane.bottomAnchor="0.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="0.0" />
<Canvas fx:id="savedSeriesCanvas" height="300.0" layoutY="-1.0" width="900.0" AnchorPane.bottomAnchor="0.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="0.0" />
</children>
</fx:root>
Fairly Simple. I then have a custom controller which loads this framework, called magnitudeGraphController
public class magnitudeGraphController extends AnchorPane implements Initializable {
#FXML
public Canvas backgroundCanvas;
#FXML
public Canvas series1Canvas;
#FXML
public Canvas series2Canvas;
#FXML
public Canvas series3Canvas;
#FXML
public Canvas series4Canvas;
#FXML
public Canvas savedSeriesCanvas;
public magnitudeGraphController(){
System.out.println("Graph Initialised");
FXMLLoader fxmlLoader = new FXMLLoader(getClass().getResource("magnitudeGraph.fxml"));
fxmlLoader.setRoot(this);
fxmlLoader.setController(this);
try {
fxmlLoader.load();
} catch (IOException exception) {
throw new RuntimeException(exception);
}
Nice and easy. So then on my main application controller I can call an instance of magnitudeGraph and the controller will load the fxml file with the root element being the anchorPane.
This is called with the following method in the main app:
public magnitudeGraphController spectrumgraph = new magnitudeGraphController();
Now the difficult thing comes when writing the fxml for my main app. I wrote the import for the controller:
<?import myApp.magnitudeGraphController?>
<AnchorPane minHeight="0.0" minWidth="0.0" prefHeight="160.0" prefWidth="100.0">
<children>
<magnitudeGraphController fx:id="spectrumgraph" layoutX="38.0" layoutY="33.0" minHeight="200.0" minWidth="700.0" prefHeight="300.0" prefWidth="944.0">
</AnchorPane>
What I get is an error on the fxml editor stating 'Class javafx.scene.layout.AnchorPane' does not support property MagnitudeGraphController'.
What is confusing me is that this was working perfectly. All I have done is changed the name of the fxml file and controller to a more identifiable name and have refactored the file to reflect this. I have gone back through my archived backup of when this was working and cannot find any difference except the file names. If I try and compile the error throws classnotfoundexception when trying to load magnitudeGraphController.
I have been tearing my hair out for ages and cannot find what has brought the whole thing down.
I have a SplitPane that is behaving strangely. It is "spontaneously" moving without interaction from the user.
Here is the sample FXML layout:
<AnchorPane maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="400.0" prefWidth="600.0" xmlns="http://javafx.com/javafx/8.0.60" xmlns:fx="http://javafx.com/fxml/1" fx:controller="sample.Controller">
<children>
<SplitPane fx:id="splitPane" dividerPositions="0.29797979797979796" layoutX="100.0" layoutY="67.0" prefHeight="160.0" prefWidth="200.0" AnchorPane.bottomAnchor="0.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="0.0">
<items>
<AnchorPane minHeight="0.0" minWidth="0.0" prefHeight="160.0" prefWidth="100.0" />
<AnchorPane minHeight="0.0" minWidth="0.0" prefHeight="160.0" prefWidth="100.0" />
</items>
</SplitPane>
</children>
</AnchorPane>
And the controller:
public class Controller {
#FXML
private SplitPane splitPane;
#FXML
private void initialize() {
// Add Listener to the divider value
splitPane.getDividers().get(0).positionProperty().addListener((observable, oldValue, newValue) -> {
System.out.println("newValue = " + newValue);
});
splitPane.getDividers().get(0).setPosition(0.80);
}
}
Here I set the listener on the only divider to output it's current value when it changes. Just below, I set it to 0.80.
Here is the output:
newValue = 0.8
newValue = 0.7986577181208053
You see it does change after initially setting it. While this change is minimal in the example, the problem is exacerbated in my main application.
I am trying to save the divider's position between runs of my program, but with the position value changing on its own every time, the minor issue becomes a major one.
What is happening here and how can I prevent it from changing? Per the FXML, you can see there are no other controls that should be forcing a change due to minimum width, etc.
I have a simple project that has a fxml with a splitter.
So the fxml is this:
<AnchorPane id="AnchorPane" prefHeight="200" prefWidth="320" xmlns:fx="http://javafx.com/fxml/1" xmlns="http://javafx.com/javafx/8" fx:controller="accordionproject.FXMLDocumentController">
<children>
<SplitPane fx:id="splitPane" dividerPositions="0.29797979797979796" focusTraversable="true" layoutX="60.0" layoutY="14.0" prefHeight="200.0" prefWidth="320.0" AnchorPane.bottomAnchor="0.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="0.0" xmlns:fx="http://javafx.com/fxml">
<items>
<AnchorPane minHeight="0.0" minWidth="0.0" prefHeight="160.0" prefWidth="100.0" />
<AnchorPane minHeight="0.0" minWidth="0.0" prefHeight="160.0" prefWidth="100.0" />
</items>
</SplitPane>
</children>
</AnchorPane>
What i would want is to insert a vbox in the left anchor pane from the splitter using only java code.
Can this be done?
I am new to fxml so any help would be apreciated.
Thank you in advance.
Add an fx:id to the AnchorPane you want to manipulate:
<AnchorPane fx:id="leftAnchorPane" minHeight="0.0" minWidth="0.0"
prefHeight="160.0" prefWidth="100.0" />
Get it in your controller as a #FXML member field:
public class FXMLDocumentController
{
#FXML private AnchorPane leftAnchorPane;
...
}
And manipulate it in the desired place (initialize() shown here, can be -almost- anywhere else):
public void initialize() {
VBox vbox = new VBox();
...
AnchorPane.setTopAnchor(vbox, 10.0); // obviously provide your own constraints
leftAnchorPane.getChildren().add(vbox);
}