I would like to fit the gridbox accross the whole scene as per attached picture and code below, however i cannot whatever I do!!
I have tried generating empty rows and columns but still does not fill, unless i add a lot.
I would like to specify a number of rows and columns and then let the program divide these equally along the screen, please help
how can I also locate the text inside the table the the right of the cell?
#Override public void start(Stage stage) {
timer.start();
buildData_timer.start();
Group root = new Group();
Scene scene = new Scene(root, 1180, 650);
stage.setScene(scene);
stage.setTitle("Separator Sample");
scene.getStylesheets().addAll(this.getClass().getResource("style.css").toExternalForm());
GridPane Mainpane = new GridPane();
scene.setRoot(Mainpane);
Mainpane.setGridLinesVisible(true);
Mainpane.setId("Mainpane");
GridPane prayertime_pane = new GridPane();
prayertime_pane.setId("prayertime_pane");
prayertime_pane.setGridLinesVisible(true);
prayertime_pane.setPadding(new Insets(20, 20, 20, 20));
prayertime_pane.setVgap(20);
prayertime_pane.setHgap(35);
HBox clock1Box = new HBox();
clock1Box.setSpacing(0);
clock1Box.getChildren().addAll(clock);
HBox fajrBox = new HBox();
fajrBox.setSpacing(0);
fajrBox.setMaxSize(155, 54);
fajrBox.getChildren().addAll(fajr_hourLeft, fajr_hourRight, time_Separator1, fajr_minLeft, fajr_minRight);
prayertime_pane.setConstraints(fajrBox, 0, 1);
prayertime_pane.getChildren().add(fajrBox);
HBox zuhrBox = new HBox();
zuhrBox.setSpacing(0);
zuhrBox.setMaxSize(155, 54);
zuhrBox.getChildren().addAll(zuhr_hourLeft, zuhr_hourRight, time_Separator2, zuhr_minLeft, zuhr_minRight);
prayertime_pane.setConstraints(zuhrBox, 0, 2);
prayertime_pane.getChildren().add(zuhrBox);
HBox asrBox = new HBox();
asrBox.setSpacing(0);
asrBox.setMaxSize(155, 54);
asrBox.getChildren().addAll(asr_hourLeft, asr_hourRight, time_Separator3, asr_minLeft, asr_minRight);
prayertime_pane.setConstraints(asrBox, 0, 3);
prayertime_pane.getChildren().add(asrBox);
HBox maghribBox = new HBox();
maghribBox.setSpacing(0);
maghribBox.setMaxSize(155, 54);
maghribBox.getChildren().addAll(maghrib_hourLeft, maghrib_hourRight, time_Separator4, maghrib_minLeft, maghrib_minRight);
prayertime_pane.setConstraints(maghribBox, 0, 4);
prayertime_pane.getChildren().add(maghribBox);
HBox ishaBox = new HBox();
ishaBox.setSpacing(0);
ishaBox.setMaxSize(155, 54);
ishaBox.getChildren().addAll(isha_hourLeft, isha_hourRight, time_Separator5, isha_minLeft, isha_minRight);
prayertime_pane.setConstraints(ishaBox, 0, 5);
prayertime_pane.getChildren().add(ishaBox);
TextFlow fajrtextFlow = new TextFlow();
Text text1 = new Text("الفجر\n");
text1.setId("prayer-text-arabic");
Text text10 = new Text("Fajr");
text10.setId("prayer-text-english");
fajrtextFlow.getChildren().addAll(text1, text10);
prayertime_pane.setConstraints(fajrtextFlow, 1, 1);
prayertime_pane.getChildren().add(fajrtextFlow);
TextFlow duhrtextFlow = new TextFlow();
Text text2 = new Text("الظهر\n");
text2.setId("prayer-text-arabic");
Text text20 = new Text("Duhr");
text20.setId("prayer-text-english");
duhrtextFlow.getChildren().addAll(text2,text20);
prayertime_pane.setConstraints(duhrtextFlow, 1, 2);
prayertime_pane.getChildren().add(duhrtextFlow);
TextFlow asrFlow = new TextFlow();
Text text3 = new Text("العصر\n");
text3.setId("prayer-text-arabic");
Text text30 = new Text("Asr");
text30.setId("prayer-text-english");
asrFlow.getChildren().addAll(text3,text30);
prayertime_pane.setConstraints(asrFlow, 1, 3);
prayertime_pane.getChildren().add(asrFlow);
TextFlow maghribFlow = new TextFlow();
Text text4 = new Text("المغرب\n");
text4.setId("prayer-text-arabic");
Text text40 = new Text("Maghrib");
text40.setId("prayer-text-english");
maghribFlow.getChildren().addAll(text4,text40);
prayertime_pane.setConstraints(maghribFlow, 1, 4);
prayertime_pane.getChildren().add(maghribFlow);
TextFlow ishaFlow = new TextFlow();
Text text5 = new Text("العشاء\n");
text5.setId("prayer-text-arabic");
Text text50 = new Text("Isha");
text50.setId("prayer-text-english");
ishaFlow.getChildren().addAll(text5,text50);
prayertime_pane.setConstraints(ishaFlow, 1, 5);
prayertime_pane.getChildren().add(ishaFlow);
final Separator sepHor = new Separator();
// sepHor.setAlignment(Pos.CENTER_LEFT);
// sepHor.setOrientation(Orientation.HORIZONTAL);
prayertime_pane.setConstraints(sepHor, 0, 1);
prayertime_pane.setColumnSpan(sepHor, 2);
prayertime_pane.getChildren().add(sepHor);
Mainpane.setConstraints(prayertime_pane, 2, 3);
Mainpane.getChildren().add(prayertime_pane);
Mainpane.setConstraints(clock1Box, 7, 1);
Mainpane.getChildren().add(clock1Box);
stage.show();
// stage.setFullScreen(true);
}
Try
ColumnConstraints c1 = new ColumnConstraints();
c1.setHgrow(Priority.ALWAYS);
ColumnConstraints c2 = new ColumnConstraints();
c2.setHgrow(Priority.NEVER);
Mainpane.getColumnConstraints().addAll(c1, c2);
RowConstraints r1 = new RowConstraints();
r1.setVgrow(Priority.NEVER);
RowConstraints r2 = new RowConstraints();
r2.setVgrow(Priority.ALWAYS);
Mainpane.getRowConstraints().addAll(r1, r2);
For more row/column/cell settings investigate GridPane, RowConstraints and ColumnConstraints.
However I suggest you to use AnchorPane or BorderPane here.
Related
I am trying to place the "Registration form" text at the top but when I do pane.add it separates the spacing between the labels and textfield boxes. How do I add it to the top without it affecting everything below it?
public class RegistrationForm extends Application {
public void start(Stage primaryStage) {
GridPane pane = new GridPane();
pane.setAlignment(Pos.CENTER);
pane.setPadding(new Insets(11.5, 12.5, 13.5, 14.5));
pane.setHgap(5.5);
pane.setVgap(5.5);
Text text = new Text ("Registration Form");
text.setFont(Font.font("Times New Roman", FontWeight.BOLD,
FontPosture.ITALIC, 20));
pane.getChildren().add(text);
pane.add(new Label("User Name: "), 0, 1);
pane.add(new TextField(), 1, 1);
pane.add(new Label("Password: "), 0, 2);
pane.add(new TextField(), 1, 2);
pane.add(new Label("Email: "), 0, 3);
pane.add(new TextField(), 1, 3);
pane.add(new Label("Phone: "), 0, 4);
pane.add(new TextField(), 1, 4);
Button btReg = new Button("Register");
pane.add(btReg, 0, 5);
GridPane.setHalignment(btReg, HPos.LEFT);
Button btCan = new Button("Cancel");
pane.add(btCan, 1, 5);
GridPane.setHalignment(btCan, HPos.LEFT);
Scene scene = new Scene(pane);
primaryStage.setTitle("Registration Form");
primaryStage.setScene(scene);
primaryStage.show();
}
}
In the Docs
add(Node child, int columnIndex, int rowIndex, int colspan, int
rowspan) Adds a child to the gridpane at the specified column,row
position and spans.
You should use:
pane.add(label, 0, 0, 2, 1);
I'm trying to make a calculator like GUI with JavaFX.
The problem is that I don't know the way to add button to "take" two cells. See the photo bellow.
In that empty space i want to add a button
I tried adding it to the position 0, 3 but it spaces all the buttons
Here's my code
Main:
public class Test extends Application {
#Override
public void start(Stage primaryStage) {
BorderPane borderPane = new BorderPane();
borderPane.setPadding(new Insets(5, 35, 5, 35));
TextField txf = new TextField("6.333");
txf.setAlignment(Pos.TOP_RIGHT);
txf.setPrefHeight(35);
GridPane grid = new GridPane();
grid.setHgap(5);
grid.setVgap(5);
grid.setPadding(new Insets(10, 5, 10, 5));
String[] signs = new String[]{"7", "8", "9", "+",
"4", "5", "6", "-",
"3", "2", "1", "*"};
int signIndex = 0;
for(int i = 0; i<3; i++) {
for(int j = 0; j<4; j++) {
CustomButton btnTemp = new CustomButton(signs[signIndex]);
grid.add(btnTemp, j, i);
signIndex++;
}
}
CustomButton btnZero = new CustomButton("0", 100, 20);
//grid.add(btnZero, 0, 3);
CustomButton btnDot = new CustomButton(".");
grid.add(btnDot, 2, 3);
CustomButton btnSlash = new CustomButton("/");
grid.add(btnSlash, 3, 3);
CustomButton btnC = new CustomButton("C", 100, 20);
grid.add(btnC, 4, 0);
CustomButton btnSqrt = new CustomButton("√", 100, 20);
grid.add(btnSqrt, 4, 1);
CustomButton btnPlusMinus = new CustomButton("+/-", 100, 20);
grid.add(btnPlusMinus, 4, 2);
CustomButton btnEqu = new CustomButton("=", 100, 20);
grid.add(btnEqu, 4, 3);
borderPane.setTop(txf);
borderPane.setCenter(grid);
Scene scene = new Scene(borderPane, 400, 200);
primaryStage.setTitle("Calculator");
primaryStage.setScene(scene);
primaryStage.setResizable(false);
primaryStage.show();
}
}
Use setColumnSpan:
GridPane.setColumnSpan(btnC, 2);
(Assuming you meant btnC, I can't understand which button you want to span 2 columns... )
I am having some issues with sizing a listbox using a gridpane. Is it possible?? I need an actual rectangular box that is bigger than a single line. I am really hoping this is possible if it is not could you please give me some pointers. I am new to this and have been working at this for some time. Any help would be greatly appreciated. Thank you!!
What I have tried that didn't work--
list.setPrefWidth(100);
list.setPrefHeight(200);
package application;
import javafx.application.Application;
import javafx.collections.FXCollections;
import javafx.collections.ObservableList;
import javafx.geometry.Insets;
import javafx.geometry.Pos;
import javafx.stage.Stage;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.control.ComboBox;
import javafx.scene.control.Label;
import javafx.scene.control.ListView;
import javafx.scene.control.TextField;
import javafx.scene.image.Image;
import javafx.scene.image.ImageView;
import javafx.scene.layout.GridPane;
import javafx.scene.text.Font;
import javafx.scene.text.FontWeight;
public class Main extends Application {
#Override
public void start(Stage primaryStage) {
// Pane pane = new Pane();
GridPane pane = new GridPane();
pane.setAlignment(Pos.TOP_LEFT);
pane.setPadding(new Insets(20, 20, 20, 20));
pane.setHgap(5.5);
pane.setVgap(5.5);
final ComboBox<String> beverageComboBox = new ComboBox<String>();
beverageComboBox.getItems().addAll("Soda ", "Tea", "Coffee", "Mineral Water", "Juice",
"Milk");
final ComboBox<String> appetizerComboBox = new ComboBox<String>();
appetizerComboBox.getItems().addAll("Buffalo Wings ", "Buffalo Fingers", "Potato Skins", "Nachos",
"Mushroom Caps", "Shrimp Cocktail");
final ComboBox<String> maincourseComboBox = new ComboBox<String>();
maincourseComboBox.getItems().addAll("Seafood Alfredo ", "Chicken Alfredo", "Chicken Picatta", "Turkey Club",
"Lobster Pie", "Prime Rib", "Shrimp Scampi", "Turkey Dinner", "Stuffed Chicken");
final ComboBox<String> dessertComboBox = new ComboBox<String>();
dessertComboBox.getItems().addAll("Apple Pie ", "Sundae", "Carrot Cake", "Mud Pie", "Apple Crisp");
/*
* beverageComboBox.setValue("Soda"); appetizerComboB(ox.setValue(
* "Buffalo Wings"); maincourseComboBox.setValue("Seafood Alfredo");
* dessertComboBox.setValue("Apple Pie");
*/
Image image = new Image("fd.jpg");
pane.getChildren().add(new ImageView(image));
// -----------------------------------------------------------------------------------------------------------
Label tit = new Label("John's");
tit.setFont(Font.font("Tahoma", FontWeight.BOLD, 32));
pane.add(tit, 1, 0);
// ---------------------------------------------------------------------------------------------------------------
Label wi = new Label("Waiter Information");
wi.setFont(Font.font("Tahoma", FontWeight.NORMAL, 20));
pane.add(wi, 0, 5);
Label tn = new Label("Table Number:");
pane.add(tn, 0, 6);
TextField tnf = new TextField();
pane.add(tnf, 1, 6);
Label wn = new Label("Waiter's Name:");
pane.add(wn, 0, 7);
TextField twn = new TextField();
pane.add(twn, 1, 7);
// ---------------------------------------------------------------------------------------------------------
Label mi = new Label("Menu Items");
mi.setFont(Font.font("Tahoma", FontWeight.NORMAL, 20));
pane.add(mi, 0, 10);
Label b = new Label("Beverage:");
pane.add(b, 0, 11);
pane.add(beverageComboBox, 1, 11);
Label a = new Label("Appetizer:");
pane.add(a, 0, 12);
pane.add(appetizerComboBox, 1, 12);
Label mc = new Label("Main Course:");
pane.add(mc, 0, 13);
pane.add(maincourseComboBox, 1, 13);
Label d = new Label("Dessert:");
pane.add(d, 0, 14);
pane.add(dessertComboBox, 1, 14);
// ----------------------------------------------------------------------------------------------------------
Label bi = new Label("Bill");
bi.setFont(Font.font("Tahoma", FontWeight.NORMAL, 20));
pane.add(bi, 0, 17);
Label st = new Label("Subtotal:");
pane.add(st, 0, 18);
TextField tst = new TextField();
pane.add(tst, 1, 18);
Label t = new Label("Tax:");
pane.add(t, 0, 19);
TextField tt = new TextField();
pane.add(tt, 1, 19);
Label to = new Label("Total:");
pane.add(to, 0, 20);
TextField tto = new TextField();
pane.add(tto, 1, 20);
// -----------------------------------------------------------------------------------------------------------
Label w = new Label("Waiter:");
pane.add(w, 0, 23);
TextField tw = new TextField();
pane.add(tw, 1, 23);
Label tn2 = new Label("Table Num:");
pane.add(tn2, 0, 24);
TextField ttn = new TextField();
pane.add(ttn, 1, 24);
// ------------------------------------------------------------------------------------------------------------
Button btn = new Button(" Clear Bill ");
pane.add(btn, 1, 30);
// -------------------------------------------------------------------------------------------------------------
Label io = new Label("Items Ordered");
io.setFont(Font.font("Tahoma", FontWeight.NORMAL, 20));
pane.add(io, 2, 3);
// -----------------------------------------------------------------------------------------------------------------------
Label bo = new Label("Beverage Ordered");
pane.add(bo, 2, 5);
ListView<String> list = new ListView<>();
ObservableList<String> items = FXCollections.observableArrayList();
list.setItems(items);
pane.add(list, 3, 5);
// ---------------------------------------------------------------------------------------------------------------
Label ao = new Label("Appetizer Ordered");
pane.add(ao, 2, 7);
ListView<String> list2 = new ListView<>();
ObservableList<String> items2 = FXCollections.observableArrayList();
list2.setItems(items2);
pane.add(list2, 3, 7);
// ----------------------------------------------------------------------------------------------------------------
Label mco = new Label("Main Course Ordered");
pane.add(mco, 2, 11);
ListView<String> list3 = new ListView<>();
ObservableList<String> items3 = FXCollections.observableArrayList();
list3.setItems(items3);
pane.add(list3, 3, 11);
// -------------------------------------------------------------------------------------------------------------------
Label od = new Label("Dessert Ordered");
pane.add(od, 2, 13);
ListView<String> list4 = new ListView<>();
ObservableList<String> items4 = FXCollections.observableArrayList();
list4.setItems(items4);
pane.add(list4, 3, 13);
// Create a new scene and place it in the stage
Scene scene = new Scene(pane, 800, 800);
primaryStage.setTitle("Restaurant Bill Calculator");
primaryStage.setScene(scene);
primaryStage.show();
}
}
please help to test this code using junit
#Override
public void start(Stage primaryStage) {
primaryStage.setTitle("JavaFX Welcome");
GridPane grid = new GridPane();
grid.setAlignment(Pos.CENTER);
grid.setHgap(10);
grid.setVgap(10);
grid.setPadding(new Insets(25, 25, 25, 25));
Text scenetitle = new Text("Welcome");
scenetitle.setFont(Font.font("Tahoma", FontWeight.NORMAL, 20));
grid.add(scenetitle, 0, 0, 2, 1);
Label userName = new Label("User Name:");
grid.add(userName, 0, 1);
TextField userTextField = new TextField();
grid.add(userTextField, 1, 1);
Label pw = new Label("Password:");
grid.add(pw, 0, 2);
PasswordField pwBox = new PasswordField();
grid.add(pwBox, 1, 2);
Label status = new Label();
status.setId( "status-label" );
Button btn = new Button("Sign in");
btn.setId("btn");
HBox hbBtn = new HBox(10);
hbBtn.setAlignment(Pos.BOTTOM_RIGHT);
hbBtn.getChildren().add(btn);
grid.add(hbBtn, 1, 4);
grid.add(status, 1, 8);
final Text actiontarget = new Text();
grid.add(actiontarget, 1, 6);
// ImageView imageView = new ImageView(new Image(getClass().getResourceAsStream("person.png"), 0, 65, true, true));
//grid.add(imageView, 0, 0,2,2);
//btn.setOnAction( ( e ) -> status.setText( computeStatus() ) );
//private String computeStatus() {
// return "Name: " + userTextField.getText() + ", Password: " + pwBox.getText();
//}
btn.setOnAction(new EventHandler<ActionEvent>() {
#Override
public void handle(ActionEvent e) {
actiontarget.setFill(Color.CORNFLOWERBLUE);
actiontarget.setText("Name: " + userTextField.getText() + ", Password: " + pwBox.getText());
}
});
Scene scene = new Scene(grid, 300, 275);
primaryStage.setScene(scene);
primaryStage.show();
}
public static void main(String[] args) {
launch(args);
}
I'm trying to show a 4-column grid in a javaFX program. This is how I setup the grid.
GridPane gridPane = new GridPane();
gridPane.setHgap(10);
gridPane.setVgap(10);
ColumnConstraints c1 = new ColumnConstraints();
c1.setPercentWidth(25);
ColumnConstraints c2 = new ColumnConstraints();
c2.setPercentWidth(25);
ColumnConstraints c3 = new ColumnConstraints();
c3.setPercentWidth(25);
ColumnConstraints c4 = new ColumnConstraints();
c4.setPercentWidth(25);
gridPane.getColumnConstraints().addAll(c1,c2,c3,c4);
I have placed the label and textfields in columns 1,3 and columns 2,4 respectively. Problem is there is a gap between the textfield and the next label and hence the width of the second textfield is reduced.
How can I solve this?
Here a very simple Application using GridPane. It uses the same gridPane column constraints and has Label's and TextField's as used by your example.
If you are worried about the gap between the Label and TextField, you must remember that the total width of the gridpane is divided into 4 parts (25% each). The TextField fills the space, Label fills the space too, but we see only the Text.
MVCE Code :
public class GridPaneExample extends Application {
#Override
public void start(Stage primaryStage) throws Exception {
GridPane gridPane = new GridPane();
gridPane.setHgap(10);
gridPane.setVgap(10);
gridPane.setPadding(new Insets(10));
ColumnConstraints c1 = new ColumnConstraints();
c1.setPercentWidth(25);
ColumnConstraints c2 = new ColumnConstraints();
c2.setPercentWidth(25);
ColumnConstraints c3 = new ColumnConstraints();
c3.setPercentWidth(25);
ColumnConstraints c4 = new ColumnConstraints();
c4.setPercentWidth(25);
gridPane.getColumnConstraints().addAll(c1, c2, c3, c4);
gridPane.add(new Label("Profile ID"), 0, 0);
gridPane.add(new TextField(), 1, 0);
gridPane.add(new Label("Profile Name"), 2, 0);
gridPane.add(new TextField(), 3, 0);
gridPane.add(new Label("Transfer Object"), 0, 1);
gridPane.add(new TextField(), 1, 1);
gridPane.add(new Label("Class Name"), 2, 1);
gridPane.add(new TextField(), 3, 1);
primaryStage.setScene(new Scene(gridPane, 500, 500));
primaryStage.show();
}
public static void main(String[] args) {
launch(args);
}
}
If you are still not able to tweak your code and fix it, consider editing your code and adding a MCVE
There are plenty of other properties in the ColumnConstraints class that you can use. You probably want the labels aligned right; you probably also want the text fields to grow and fill the space, while the labels need only enough space to hold their text. So I would do something like:
GridPane gridPane = new GridPane();
gridPane.setHgap(10);
gridPane.setVgap(10);
ColumnConstraints c1 = new ColumnConstraints();
c1.setHalignment(HPos.RIGHT);
c1.setHgrow(Priority.NEVER);
ColumnConstraints c2 = new ColumnConstraints();
c2.setHgrow(Priority.ALWAYS);
c2.setFillWidth(true);
ColumnConstraints c3 = new ColumnConstraints();
c3.setHalignment(HPos.RIGHT);
c3.setHgrow(Priority.NEVER);
ColumnConstraints c4 = new ColumnConstraints();
c4.setHgrow(Priority.ALWAYS);
c4.setFillWidth(true);
gridPane.getColumnConstraints().addAll(c1,c2,c3,c4);