Is it possible to make Button over the View?
I have something like
private BorderPane makePane(Node view) {
BorderPane pane = new BorderPane();
Button leftButton = new Button();
Button rightButton = new Button();
Button bottomButton = new Button();
leftButton.setOnAction(e -> goBack(pane));
rightButton.setOnAction(e -> goNext(pane));
bottomButton.setOnAction(e -> play());
pane.setCenter(view);
pane.setLeft(leftButton);
pane.setRight(rightButton);
pane.setBottom(bottomButton);
return pane;
}
Now, I have view on the centter and buttons on the sides. But it crops my Image or Video, depends on which instance of Node I get.
There is crop on the pane from left and right sides for each button. I don't want to see the white/black/other vertical line through whole window only for 1 button.
Related
I have a popup on button press
When I press a button the popup shows up.
public class Main extends Application {
#Override
public void start(Stage primaryStage) throws Exception {
StackPane root = new StackPane();
root.setPrefWidth(200);
root.setPrefHeight(200);
Button btn = new Button("Press");
root.getChildren().add(btn);
root.setOnMouseDragged(e-> System.out.println("draaaag"));
root.setOnMousePressed(e-> System.out.println("PRESSED"));
root.setOnMouseReleased(e-> System.out.println("RELEASED !!!!!!!!!!!!!!!"));
Scene scene = new Scene(root);
Popup popup = new Popup();
popup.getContent().add(new Label("POPUP"));
popup.setAutoHide(true);
popup.setAutoFix(true);
btn.setOnMouseClicked(ev -> {
popup.show(primaryStage);
});
primaryStage.setScene(scene);
primaryStage.show();
}
}
background have mouseDrag, mousePress and mouseRelease events.
When I open the popup and click the on the root, the popup hides as expected, but the root area notifies only mouseRelease and drag actions first, than all other actions act.
IWant to listen on mousePress on root even if the popup is showing...
I got the answer.
the event is consumed on auto hide
so
popup.setConsumeAutoHidingEvent(false)
It does the job.
Popup are managed as different window higher than the one you insert. Therefore you have to insert onMouseRelease event also to popup:
popup.getContent().get(0).setOnMouseReleased(e -> System.out.println("Popup clicked!"));
you can also add a styled Label with a different background to highlight the popup:
Label label = new Label("POPUP");
label.setStyle("-fx-background-color: grey;");
popup.getContent().add(label);
label.setOnMouseReleased(e -> System.out.println("Popup clicked!"));
I'm trying to implement a Gluon Mobile toggle button for a survey page, and when testing, the button jumps to the left a little when I click it. I don't want it to jump at all. You can see it here:
Relevant code is here:
StackPane getToggler() {
ToggleButton toggleButton = new ToggleButton("Yes");
ToggleButtonGroup toggleButtonGroup = new ToggleButtonGroup();
toggleButtonGroup.setSelectionType(SelectionMode.SINGLE);
toggleButtonGroup.setPadding(new Insets(10));
toggleButton = new ToggleButton("Yes");
toggleButton.setStyle("-fx-text-fill:steelblue;");
toggleButton.setUserData("1");
toggleButton.setSelected(false);
toggleButton.selectedProperty().addListener((obv, ov, nv) -> {
if (nv.booleanValue()) {
toggleButtonGroup.setUserData("1");
}
});
toggleButtonGroup.getToggles().add(toggleButton);
toggleButton = new ToggleButton("No");
toggleButton.setStyle("-fx-text-fill:steelblue;");
toggleButton.setSelected(true);
toggleButton.setUserData("0");
toggleButton.setSelected(false);
toggleButton.selectedProperty().addListener((obv, ov, nv) -> {
if (nv.booleanValue()) {
toggleButtonGroup.setUserData("0");
}
});
toggleButtonGroup.getToggles().add(toggleButton);
togglers.add(toggleButtonGroup);
StackPane wrapper = new StackPane();
wrapper.setAlignment(Pos.CENTER);
wrapper.getChildren().add(toggleButtonGroup);
return wrapper;
}
Here's where I get the togglers and their relation to the label to the left:
for (int i = 0; i < this.questions.length; i++) {
HBox row = new HBox();
row.setSpacing(5);
row.setAlignment(Pos.CENTER_LEFT);
Label label = new Label(this.questions[i]);
label.setWrapText(true);
label.setPrefWidth(200);
label.setTextAlignment(TextAlignment.LEFT);
label.setFont(new Font("System", 14));
StackPane wrapper = this.getToggler();
Region region = new Region();
HBox.setHgrow(region, Priority.ALWAYS);
HBox.setHgrow(label, Priority.NEVER);
row.getChildren().addAll(label,region,wrapper);
box.getChildren().add(row);
box.getChildren().add(new Separator());
}
After some debugging, I've realized that the min width value of the toggle buttons is wider than their pref width.
This means that after the user selects one toggle, the min width is applied, and the control is resized with the required min width, shrinking the region as a consequence.
A quick fix (until this gets fixed in the control) can be setting the min width of your toggle buttons:
private StackPane getToggler() {
ToggleButtonGroup toggleButtonGroup = new ToggleButtonGroup();
ToggleButton toggleButtonYes = new ToggleButton("Yes");
toggleButtonYes.minWidthProperty().bind(toggleButtonYes.prefWidthProperty());
toggleButtonGroup.getToggles().add(toggleButtonYes);
ToggleButton toggleButtonNo = new ToggleButton("No");
toggleButtonNo.minWidthProperty().bind(toggleButtonNo.prefWidthProperty());
toggleButtonGroup.getToggles().add(toggleButtonNo);
...;
}
I wanna it will be okay when the number variables is changed, but when the are increased the button goes out from the window. How to fix it? Also how to put the bar down to the level of "10$", so they will be in the same row?
Before :
After :
Here is my code :
VBox vboxBottom = new VBox();
HBox hboxBottomElements = new HBox(15);
HBox hboxBottomMain = new HBox(0);
Region region = new Region();
region.setPrefWidth(500);
hboxBottomElements.getChildren().addAll(visaLabel, separator2, adLabel, separator3, governRelationStatus, separator4, region, next);
hboxBottomElements.setPadding(new Insets(5));
vboxBottom.getChildren().addAll(separator1, new Group(hboxBottomElements));
vboxBottom.setPadding(new Insets(3));
hboxBottomMain.getChildren().addAll(new Group(moneyBox), vboxBottom);
hboxBottomMain.setPadding(new Insets(3));
layout.setBottom(hboxBottomMain);
By using a Group here
vboxBottom.getChildren().addAll(separator1, new Group(hboxBottomElements));
you're creating a layout structure that resizes hboxBottomElements to it's prefered size independent of the space available.
HBox simply moves elements out the right side of it's bounds, if the space available does not suffice. This means if the Group containing moneyBox grows, the Button is moved out of the HBox...
The following simpler example demonstrates the behavior:
#Override
public void start(Stage primaryStage) {
Button btn = new Button("Do something");
HBox.setHgrow(btn, Priority.NEVER);
btn.setMinWidth(Region.USE_PREF_SIZE);
Region filler = new Region();
filler.setPrefWidth(100);
HBox.setHgrow(filler, Priority.ALWAYS);
Rectangle rect = new Rectangle(200, 50);
HBox hBox = new HBox(rect, filler, btn);
Scene scene = new Scene(hBox);
primaryStage.setScene(scene);
primaryStage.show();
}
This will resize filler to make the HBox fit the window.
Now replace
Scene scene = new Scene(hBox);
with
Scene scene = new Scene(new Group(hBox));
and the Button will be moved out of the window...
I am learning Vaadin and I would like to move two buttons to the bottom of pop up window with spacing in between the buttons. I'm pretty sure I would have to override the button css in my theme but how do I change the absolute location of the button in java code?
Here is my code: A simple button with a click listener that calls a pop up method (subwindow). In the below code I'm trying to move the yes button to the bottom of pop up window.
protected void init(VaadinRequest vaadinRequest) {
final VerticalLayout layout = new VerticalLayout();
Button helloButton = new Button("Click Me");
helloButton.addClickListener(e -> helloPopUp());
layout.setMargin(true);
layout.setSpacing(true);
layout.addComponents(helloButton);
setContent(layout);
}
private void helloPopUp() {
Window subWindow = new Window("Pop Up");
HorizontalLayout subContent = new HorizontalLayout();
AbsoluteLayout layout2 = new AbsoluteLayout();
subContent.setMargin(true);
Label text = new Label( "Hello Pop Up" , ContentMode.PREFORMATTED);
subContent.addComponent(text);
Button yes = new Button("Yes");
Button no = new Button("No");
layout2.addComponent(yes, "left: 50px; bottom: 0px;");
subContent.addComponents(layout2);
subContent.addComponent(no);
subWindow.setContent(subContent);
UI.getCurrent().addWindow(subWindow);
}
Here is a way to do this without using AbsoluteLayout
private void helloPopUp() {
Window subWindow = new Window("Pop Up");
VerticalLayout subContent = new VerticalLayout();
subContent.setMargin(true);
Label text = new Label( "Hello Pop Up" , ContentMode.PREFORMATTED);
subContent.addComponent(text);
Button yes = new Button("Yes");
Button no = new Button("No");
HorizontalLayout buttonsLayout = new HorizontalLayout();
buttonsLayout.addComponents(yes, no);
buttonsLayout.setSpacing(true);
subContent.addComponent(buttonsLayout);
subContent.setComponentAlignment(buttonsLayout, Alignment.BOTTOM_LEFT);
subWindow.setContent(subContent);
UI.getCurrent().addWindow(subWindow);
}
I'm learning javafx and I have a problem.
I'm building an interface with a border pane and a menu bar at the top and when I click on the items I want scenes to be loaded on the center of the border pane. That seems to be working alright. I want to add a button to close the scene but I can't make it work.
See below the code.
stage = primaryStage;
stage.setTitle("My Program");
BorderPane pane = new BorderPane();
MenuBar menuBar = new MenuBar();
Menu menuFile = new Menu("File");
MenuItem load = new MenuItem("Load");
MenuItem save = new MenuItem("Save");
....
BorderPane sp = new BorderPane();
sp.setStyle("-fx-background: #FF0000;");
Button btn = new Button("Close");
btn.setPrefSize(200, 20);
btn.setLayoutX(200);
btn.setLayoutY(200);
sp.getChildren().add(btn);
load.setOnAction(e -> pane.setCenter(sp));
btn.setOnAction(e -> ???????????????????);
scene1 = new Scene(sp);
scene = new Scene(pane, 800, 500);
stage.setScene(scene);
stage.show();
I was wondering if it's something that I can do and what code I should put instead of the question marks.
Any help is appreciated. Thanks in advance.
btn.setOnAction(e -> pane.setCenter(null));
to clear the border pane content, or
btn.setOnAction(e -> stage.hide());
to close the entire window