Does anyone know how to programmatically collapse a TitledPane in JavaFX? I know the methods setExpanded and setCollapsible are available but it only enables the property. I want to collapse the pane without any mouse interaction.
Button btn = new Button();
btn.setText("Say 'Hello World'");
btn.setOnAction(new EventHandler<ActionEvent>() {
#Override
public void handle(ActionEvent event) {
System.out.println("Hello World!");
}
});
TitledPane titledPane = new TitledPane();
titledPane.setAnimated(true);
titledPane.setText("This is a test");
titledPane.setContent(btn);
titledPane.setExpanded(true);
Accordion accordion = new Accordion();
accordion.getPanes().add(titledPane);
Button show = new Button("Expand");
show.setOnAction((ActionEvent event) -> {
accordion.setExpandedPane(titledPane); // Expanded Pane works!
});
Button hide = new Button("Collapse");
hide.setOnAction((ActionEvent event) -> {
//???
});
HBox layout = new HBox(10);
layout.setStyle("-fx-background-color: cornsilk; -fx-padding: 10;");
layout.getChildren().addAll(show, hide, accordion);
Scene scene = new Scene(layout, 320, 240);
scene.setFill(Color.GHOSTWHITE);
primaryStage.setTitle("Hello World!");
primaryStage.setScene(scene);
primaryStage.show();
Here is the result I am looking for
Since only one TitledPane in the same Accordion can be expanded at any time, the Accordion (to some extent) manages the expanded state of any TitledPanes it contains.
You can do
accordion.setExpandedPane(titledPane);
to get the accordion to expand titledPane.
Calling titledPane.setExpanded(true); also works, but only if you invoke this after the window has been shown (for reasons I don't fully understand).
Related
So I have to make a Zodiac Sign GUI, and we are tasked with having the following:
a Label in the top left, and a TextField in the top right (both with padding)
an exit Button in the center of the GUI, along with a clear and find my sign on either side
and finally, a Label in the bottom center prompting the sign
I am utterly confused on how to have this come out, as I am a novice in JavaFX. I believe I would need a branch node along with the root node in order to get this kind of layout. I do not need assistance in instantiating the button, labels etc., mainly confused with how this layout can even work. The code I have now is the following:
public class ZodiacGUI extends Application {
public static void main(String args[]) {
Application.launch(args);
}
#Override
public void start(Stage primaryStage) throws Exception {
BorderPane mainPane = new BorderPane();
mainPane.setStyle("-fx-background-color: PINK");
setupControls(mainPane);
Scene scene = new Scene(mainPane);
setStage(primaryStage, scene);
}
public void setStage(Stage primaryStage, Scene scene) {
primaryStage.setWidth(500);
primaryStage.setHeight(200);
primaryStage.setTitle("What is my Zodiac Sign?");
primaryStage.setScene(scene);
primaryStage.show();
}
public void setupControls(BorderPane mainPane) {
Label label = new Label("Enter you birthday formatted as -> mm/dd");
Button exitButton = new Button();
Button findSign = new Button();
Button clear = new Button();
TextField userInput = new TextField();
userInput.setPromptText("Enter birthday");
exitButton.setText("Exit.");
findSign.setText("Find my sign.");
clear.setText("Clear.");
exitButton.setOnAction(e -> System.exit(0));
mainPane.setLeft(label);
mainPane.setRight(userInput);
mainPane.setCenter(exitButton);
mainPane.setCenter(findSign);
mainPane.setCenter(clear);
BorderPane.setAlignment(label, Pos.TOP_LEFT);
BorderPane.setAlignment(userInput, Pos.TOP_RIGHT);
BorderPane.setAlignment(exitButton, Pos.CENTER);
BorderPane.setAlignment(findSign, Pos.CENTER_LEFT);
BorderPane.setAlignment(clear, Pos.CENTER_RIGHT);
}
}
This only outputs one of the buttons out of the three, as I assume it is because the necessary addition of another BorderPane? Here is a drawn out picture of what I would like to come out with:
Just to clarify, I do not need assistance with the handling of finding the zodiac sign, etc. Mainly need assistance on the layout, as it has stumped me for days. Thank you in advance for helping out a novice to JavaFX :).
You have three rows with diffrent number of children. You can use HBox if row have more than one child.
BorderPane mainPane = new BorderPane();
mainPane.setTop(new HBox(topLabel, topField));
mainPane.setCenter(new HBox(centerLabel, centerField, centerButtom));
mainPane.setBottom(bottomCenterButton);
If you need more than 3 rows (top, center, bottom section of BorderPane) you can use VBox, where every child is row like:
HBox row1 new HBox(child1, child2)
HBox row2 new HBox(child1, child2, child3)
HBox row3 new HBox(child1)
HBox row4 new HBox(child1, child2)
VBox pane = new VBox(row1, row2, row3, row4);
You might want to use a GridPane
GridPane grid = new GridPane();
grid.add(label,0,0);
grid.add(userInput,2,0);
grid.add(findSign,0,1);
grid.add(exitButton,1,1);
grid.add(clear,2,1);
or use a VBox with BorderPane to help with the layout/alignment
BorderPane mainPane, centerPane;
mainPane.setLeft(label);
mainPane.setRight(userInput);
centerPane.setLeft(findSign);
centerPane.setRight(clear);
centerPane.setCenter(exitButton);
BorderPane.setAlignment(label, Pos.LEFT);
BorderPane.setAlignment(userInput, Pos.RIGHT);
BorderPane.setAlignment(exitButton, Pos.CENTER);
BorderPane.setAlignment(findSign, Pos.LEFT);
BorderPane.setAlignment(clear, Pos.RIGHT);
VBox items = new VBox();
items.getChildren().addAll(mainPane, centerPane);
I'm currently trying to show a BorderPane inside my AnchorPane (that is also inside my StackPane). I tried to show a new Scene but it show me 2 items in my Windows taskbar, and this is not really what I want.
For exemple, when you open the Preference in Eclipse, u get another window that is not visible in the taskbar.
So basically, the only thing I need is a window that looks like an ImageView, like anchored in the AnchorPane , not resizable and undecorated.
Expected result at end
This is what I tried:
btnDice.setOnAction(new EventHandler<ActionEvent>()
{
#Override
public void handle(ActionEvent arg0) {
Scene newScene = new Scene(new BorderPane(), 230, 100);
Stage newWindow = new Stage();
newWindow.setScene(newScene);
newWindow.show();
}
});
I'm trying to add a ScrollBar to a HBox. The ScrollBar gets added, but I get no scrolling. How can I make it work?
public class ScrollableItems {
public void scrollableItems(HBox content) {
double height = 180;
ScrollBar sc = new ScrollBar();
content.getChildren().add(sc);
sc.setLayoutX(content.getWidth() - sc.getWidth());
sc.setMin(0);
sc.setOrientation(Orientation.VERTICAL);
sc.setPrefHeight(height);
sc.setMax(height * 2);
sc.valueProperty().addListener(new ChangeListener<Number>() {
public void changed(ObservableValue<? extends Number> ov,
Number old_val, Number new_val) {
content.setLayoutY(-new_val.doubleValue());
}
});
}
}
Add children to a HBox then pass it to scrollableItems(HBox content) above to add a SCrollBar
public HBox mainItemsWrapper() {
HBox scrollabelWrapper = new HBox();
scrollabelWrapper.setMaxHeight(180);
HBox entityDetailViewWrapper = new HBox();
entityDetailViewWrapper.getChildren().addAll(.....);
scrollabelWrapper.getChildren().add(entityDetailViewWrapper);
new ScrollableItems().scrollableItems(scrollabelWrapper);
return scrollabelWrapper;
}
Thank you all.....
I do not really get why you are trying to reinvent the wheel.. you should probably use the ScrollPane instead.
This little example shows how to create a horizontally scrollable HBox with the ScrollPane class:
#Override
public void start(Stage primaryStage) {
HBox hbox = new HBox();
Button b = new Button("add");
b.setOnAction(ev -> hbox.getChildren().add(new Label("Test")));
ScrollPane scrollPane = new ScrollPane(hbox);
scrollPane.setFitToHeight(true);
BorderPane root = new BorderPane(scrollPane);
root.setPadding(new Insets(15));
root.setTop(b);
Scene scene = new Scene(root, 400, 400);
primaryStage.setScene(scene);
primaryStage.show();
}
As eckig said, you can wrap you HBox into a ScrollPane.
Additionnaly, you can customize the visual part of the scrollbar in CSS. I found this link useful for the comprehension of the differents parts of a scrollbar: Customize ScrollBar via CSS
I am making a GUI using JavaFx, I want a name field to appear if the check box is checked and disappear if it is not checked.
Here is the code I wrote
test1.setOnAction(new EventHandler<ActionEvent>() {
#Override
public void handle(ActionEvent event) {
Boolean b = test1.isSelected();
log(b);
Label label1 = new Label("Name:");
TextField textField = new TextField();
HBox hb = new HBox();
if (test1.isSelected()) {
hb.getChildren().addAll(label1, textField);
hb.setSpacing(10);
grid.add(hb, 3, 3);
} else {
**hb.getChildren().removeAll(label1 , textField);** <---look at this!
}
}
});
I am removing the node if it is unchecked but it doesn't execute it accordingly. What am I doing wrong?
Incase it is required, here is how I execute my scene.
Scene scene = new Scene(grid, 500, 500);
primaryStage.setScene(scene);
primaryStage.show();
I want to refill an Accordion with a new collection of TitledPane, but I've found a problem expanding nodes in the accordion.
I guess that it's an issue of the JavaFX library. Because it also happen with the sample provided in the manual for Accordion and TitledPane from Oracle. I take the original Example 22-5, and change it like this:
public void start(Stage stage) {
stage.setTitle("TitledPane");
Scene scene = new Scene(new Group(), 800, 250);
scene.setFill(Color.GHOSTWHITE);
final Label label = new Label("Initial");
// --- Accordion
final Accordion accordion = new Accordion ();
for (int i = 0; i < imageNames.length; i++) {
images[i] = new
Image(getClass().getResourceAsStream(imageNames[i] + ".jpg"));
pics[i] = new ImageView(images[i]);
tps[i] = new TitledPane(imageNames[i],pics[i]);
}
accordion.getPanes().addAll(tps);
accordion.expandedPaneProperty().addListener(new
ChangeListener<TitledPane>() {
public void changed(ObservableValue<? extends TitledPane> ov,
TitledPane old_val, TitledPane new_val) {
if (new_val != null) {
label.setText("expanded: " +accordion.getExpandedPane().getText());
}
}
});
HBox hbox = new HBox(10);
Button buttonClear = new Button("Clear and refill");
buttonClear.setOnAction(new EventHandler<ActionEvent>() {
#Override
public void handle(ActionEvent arg0) {
for (int i = 0; i < imageNames.length; i++) {
tps[i] = new TitledPane(imageNames[i]+" refill",pics[i]);
}
accordion.getPanes().clear();
accordion.getPanes().addAll(tps);
accordion.getPanes().get(0).setExpanded(true);
}
});
hbox.setPadding(new Insets(20, 0, 0, 20));
hbox.getChildren().setAll(label, accordion, buttonClear);
Group root = (Group)scene.getRoot();
root.getChildren().add(hbox);
stage.setScene(scene);
stage.show();
}
When I change the expanded TitledPane, the label takes its value. And I also added a button, that clear all the TitledPane in the Accordion, create a new ones and set the first TitledPane as Expanded.
So when I press the button, the accordion it's refilled, the label says that the First TitledPane it's expanded but the last one it's the one who seems selected, but without the image. This occurs the second time we press this button, or if we previously select one of the TitledPane.
And this thing it's precisely what I want to do. Clear all the TitledPane and refill it with new TitledPane, and it's giving the same weird result.
How can I clean all the TitledPane, create a new ones and set as expanded the first TitledPane without this side effects that I explain before?
Thanks for reading!