I'm trying to stop the users from being able to move an alert that pops up. I have found one option is to set the style to UNDECORATED to remove the border which they would click on to move the alert, but I personally think this looks very ugly.
Are there any other options?
I suggest going with StageStyle.UNDECORATED and adding any decoration you want inside.
Not having system decoration, in this case, is a benefit. Because people are used to standard controls (close button, moving by dragging title, etc) and by removing them you give a clear sign that you don't want this windows to be movable.
Small example:
Stage alert = new Stage(StageStyle.UNDECORATED);
alert.initModality(Modality.APPLICATION_MODAL);
VBox root = new VBox(30);
root.setStyle("-fx-background-color: antiquewhite");
root.setAlignment(Pos.CENTER);
root.setPadding(new Insets(25));
root.setBorder(new Border(new BorderStroke(Color.BLACK,
BorderStrokeStyle.SOLID, CornerRadii.EMPTY, BorderWidths.DEFAULT)));
Button btn = new Button("Got it!");
btn.setOnAction((e)-> {alert.close();});
Label label = new Label("Alert!");
label.setFont(Font.font("Verdana", 20));
root.getChildren().addAll(label, btn);
alert.setScene(new Scene(root, 200, 150));
which gives you next window:
Related
The problem I'm having is adding a button to the scene and still maintain the original color of the scene. I have created the scene originally black but when adding the button it becomes white. Do any of you know how to fix this issue?
#Override
public void start(Stage teater) {
teater.setTitle("Adventure Game");
Circle circle = new Circle(200, 100, 30);
circle.setFill(Color.WHITE);
Text text = new Text(Integer.toString(resultat));
text.setFont(Font.font("Calibri", 25));
text.setFill(Color.BLACK);
StackPane root = new StackPane(circle, text);
root.setLayoutX(165);
root.setLayoutY(90);
Text text1 = new Text(50, 40, "Adventure Game");
text1.setFont(Font.font("Edwardian Script ITC", 50));
text1.setFill(Color.WHITE);
Button button = new Button("Avslutt");
button.setTextFill(Color.WHITE);
button.setLayoutX(10);
VBox vBox = new VBox(text1, root);
Pane pane = new Pane(vBox);
pane.setLayoutX(50);
pane.setLayoutY(0);
Scene scene = new Scene(pane, 400, 200, Color.BLACK);
Without button:
With button:
It's not the scene that is changing its background color, but the root of the scene, which is having the styles defined in the default modena.css style sheet applied.
Note that CSS is not applied unless an instance of Control (or one of its subclasses, like Button) is created: the idea here is that styles are mainly defined only for controls, so it's not worth the performance hit for applications that use no controls (purely graphical applications, etc). There is no need to even add the control to the scene graph: as soon as Control's constructor is called, the stylesheet will be applied.
A quick fix is
pane.setStyle("-fx-background-color: transparent ;");
or
pane.setStyle("-fx-background-color: black ;");
but it's probably better to define an external stylesheet:
.root {
-fx-background: black ;
}
as you'll likely find there are other styles you want to control (in fact, with a little work, you can move all the font and color definitions to the CSS file giving your code better separation).
I'm trying to increase the height of my HtmlEditior in a JavaFX application. If I change it with the preferedSize() Methode, the node rescales to the desired height but I can't enter text into the new space. Does anyone know where I've made a mistake?
Code:
VBox root = new VBox();
HTMLEditor editor = new HTMLEditor();
editor.setPrefHeight(1000);
root.getChildren().add(editor);
Scene scene = new Scene(root, 1200, 800);
primaryStage.setScene(scene);
primaryStage.show();
My current gui (external link to imgur)
In this picture, you can see a large white space. This is the area where I want to write text.
VBox theBox = new VBox();
Label theLabel = new Label ();
theBox.setAlignment(Pos.TOP_RIGHT);
VBox.getChildren().add(theLabel);
scene = new Scene(VBox, 1000, 1000);
stage.setScene(scene);
stage.show();
Having this in my class the vbox appears but the weird thing is it only centers vertically not in the x axis.
So if I do:
CENTER_RIGHT it will do the first but ignore the second. So unless I wrap my VBox in a HBox, I figured I cant achieve what I want.
Is there a reason why I cant position my VBox or what am I doing wrong?
I googled like crazy and couldnt find anything. I even went through the entire documentation.
I have a project that has a 2 text areas and few buttons. The root pane is a AnchorPane. when resizing the window to smaller window, all the elements start overlap. What methods can fix this? (IGNORE THE NAME OF MY anchorpane, i got lazy)
AnchorPane borderpane = new AnchorPane ();
TextArea user_list = new TextArea();
user_list.setPrefSize(150, 400);
TextArea messages = new TextArea();
messages.setPrefSize(350, 400);
TextField typebox = new TextField();
typebox.setPrefSize(425, 100);
// put a shape over a text, over a shape
StackPane send_container = new StackPane();
Rectangle send_box = new Rectangle(75, 25);
Label send_text = new Label("Send");
send_container.getChildren().add(send_box);
send_container.getChildren().add(send_text);
AnchorPane.setLeftAnchor(messages, 25.0);
AnchorPane.setTopAnchor(messages, 10.0);
AnchorPane.setRightAnchor(user_list, 25.0);
AnchorPane.setTopAnchor(user_list, 10.0);
AnchorPane.setBottomAnchor(typebox, 25.0);
AnchorPane.setLeftAnchor(typebox, 25.0);
AnchorPane.setBottomAnchor(send_container, 25.0);
AnchorPane.setRightAnchor(send_container, 25.0);
borderpane.getChildren().addAll(messages, user_list, typebox,send_container );
Scene scene = new Scene(borderpane, 600, 600);
primaryStage.setMaxHeight(600);
primaryStage.setMaxWidth(600);
primaryStage.setScene(scene);
primaryStage.setTitle("Welcome");
scene.getStylesheets().add(LoginWindow.class.getResource("Login.css").toExternalForm());
primaryStage.show();
You are hard-coding the locations and sizes of your controls. This means the controls cannot respond to changes in the size of their parent nodes.
Usually, you should not specify any heights or widths. Controls all have default preferred sizes, and all layouts respect those. Layouts also decide how child nodes will be resized in response to the user's resizing of a window.
Often, the layout of a window needs to be broken down into sub-layouts. In your case, you want one section that always resizes to fill the window (the user list and message section), with another section at the bottom (the typebox and Send button). A BorderPane is the ideal choice, since its center node always fills it. So the center of this main BorderPane would contain the user list and message area, while the bottom of this BorderPane would contain the typebox and the Send button.
You probably want the user to be able to horizontally resize both the user list and the messages, so I'd put them in a SplitPane, and make that SpiltPane the center of the main BorderPane.
You probably want the typebox and Send button to be in a separate child BorderPane, with the typebox as the center node, since you want the typebox to stretch and shrink, horizontally, when the user resizes the window.
So, to summarize:
user list and message area in a SplitPane
typebox and Send button in a BorderPane
parent BorderPane with user list/message section in the center, typebox/Send section on the bottom
The code for this is actually pretty short:
ListView user_list = new ListView();
TextArea messages = new TextArea();
messages.setPrefRowCount(12);
messages.setPrefColumnCount(30);
TextField typebox = new TextField();
typebox.setPrefColumnCount(30);
Button send_text = new Button("Send");
send_text.disableProperty().bind(
typebox.lengthProperty().lessThan(1));
SplitPane top = new SplitPane(user_list, messages);
top.setDividerPosition(0, 1/3.0);
BorderPane bottom = new BorderPane();
bottom.setCenter(typebox);
bottom.setRight(send_text);
BorderPane.setMargin(typebox, new Insets(0, 12, 0, 0));
BorderPane main = new BorderPane();
main.setCenter(top);
main.setBottom(bottom);
BorderPane.setMargin(bottom, new Insets(12));
Scene scene = new Scene(main);
primaryStage.setScene(scene);
primaryStage.setTitle("Welcome");
scene.getStylesheets().add(LoginWindow.class.getResource("Login.css").toExternalForm());
primaryStage.show();
Notice that there are no hard-coded dimensions or coordinates (except the margins defined by the Insets objects). Every control has a preferred size based on its properties, such as a TextField's preferred column count.
The workings of the various layouts are well documented. I suggest reading about them in the javafx.scene.layout package.
(I'm guessing the user list should be a ListView, not a TextArea, since typical chat programs allow selection of one or more users. And I suspect your black Rectangle and send_text Label were intended to represent a disabled Button.)
Use a pane other than a Anchor Pane. It's for absolute positioning. Try a stack pane or simple VBox.
I have been playing around with JavaFX and I really like it. But I can't seem to get my content where I want it. Even if I place a vbox on the CENTER and a label on the TOP, they're still in the center and almost touching each other.
I want to have (Centered in the screen of course):
My Title
SubLabel
Button1
Button2
Button3
BottomLabel
But it shows up as:
My Title
SubLabel
Button1
Button2
Button3
BottomLabel
If I settranslateX my vbox or top label, it moves the label, but also moves everything else with it.
How can I get it to align correctly?
Here is my pseudo-code:
private Node PreMenu()
{
Group group2 = new Group();
BorderPane pane = new BorderPane();
Text label = new Text("Please Choose a Option");
label.setFont(Font.font("Kozuka Gothic Pro", 30));
label.setEffect(addEffect(Color.web("#FF6600"), .85, 20));
label.setTextAlignment(TextAlignment.CENTER);
label.setTranslateY(-300); //This moves my label, but it also moves the vbox under it DOWN.
VBox vbox = new VBox();
Button option1= new Button("Firstbutton");
Button option2= new Button("Secondbutton");
Button option3= new Button("HelpButton");
option1.setEffect(addEffect(Color.web("#FF6600"), .8, 10));
option2.setEffect(addEffect(Color.web("#FF6600"), .8, 10));
option3.setEffect(addEffect(Color.web("#FF6600"), .8, 10));
option1.setTextAlignment(TextAlignment.CENTER);
option1.setMinWidth(400);
option2.setTextAlignment(TextAlignment.CENTER);
option2.setMinWidth(400);
option3.setTextAlignment(TextAlignment.CENTER);
option3.setMinWidth(400);
vbox.setSpacing(20);
vbox.getChildren().add(option1);
vbox.getChildren().add(option2);
vbox.getChildren().add(option3);
pane.setTop(label);
pane.setCenter(vbox);
group2.getChildren().add(pane);
return group2;
}
Another Node I have in my program with the same issue:
Easiest way with your code would be to set top and bottom padding for your Vbox with buttons:
vbox.setPadding(new Insets(50,0,50,0));
This line adds spacing of 50 pixels above and below vbox.
Don't put it in a Group. Just return the BorderPane directly. If you can post a fully working example (with a main()) I'll take a look at it, but I suspect the problem is the Group you are unnecessarily wrapping around the BorderPane.
Groups have a special function in JavaFX, read the documentation on the difference between Groups and Regions.