【问题标题】:Set labels and text field alignment in JavaFX在 JavaFX 中设置标签和文本字段对齐
【发布时间】:2018-04-28 00:25:04
【问题描述】:

我意识到这是一个非常基本的问题,但我才刚刚开始专门学习 GUI 和 JavaFX。我有一个标签列表及其相应的文本输入字段和一个用于计算结果的按钮。我想像这样对齐它们:

标签........文本字段

标签........文本字段

标签........文本字段

标签........文本字段

…………按钮…………

在窗格本身上居中对齐。我尝试将对齐设置为中心,但它仅适用于水平轴。我尝试过使用 VBox 和 HBox,但它们给出了相同的输出。我什至用不同的值尝试了 setPadding(0,0,0,0) 但我没有得到我想要的结果。我发现了类似的问题(没有回答我的问题),甚至去过https://docs.oracle.com/javase/8/javafx/api/javafx/scene/layout/FlowPane.html 但无济于事。我意识到计算按钮只会添加值,但我还没有走那么远,我想我知道该怎么做才能让它做我想做的事,只是在 GUI 布局上遇到了麻烦。任何帮助,将不胜感激。以下是我玩了几个小时后的代码:

 package javafxfincalc;

 import javafx.application.Application;
 import javafx.geometry.Pos;
 import javafx.scene.Scene;
 import javafx.scene.control.Button;
 import javafx.scene.control.Label;
 import javafx.scene.control.TextField;
 import javafx.scene.layout.BorderPane;
 import javafx.scene.layout.FlowPane;
 import javafx.scene.layout.HBox;   // may not need
 import javafx.scene.layout.VBox;
 import javafx.stage.Stage;
 import javafx.geometry.Insets;
 import javafx.geometry.Orientation;
 // a lot of classes must be imported from Java FX to make this all work correctly

 public class JavaFXFinCalc extends Application {
// all applications will be a child class of Application when made with Java FX

 public static void main(String[] args) {

Application.launch(args);
// this allows the program to start
 }@Override

public void start(Stage primaryStage) throws Exception {
// this will use a standard exception handler

FlowPane pane = new FlowPane(Orientation.VERTICAL);
 pane.setHgap(5);
 pane.setAlignment(Pos.CENTER);
 pane.setPadding(new Insets(0,0,0,0)); // set top, right, bottom, left
 // this allows input fields to be placed in the window
 
 TextField tf1 = new TextField("00.00");
 TextField tf2 = new TextField("0");
 TextField tf3 = new TextField("0.00%");
 TextField my_result = new TextField("You cannot type here");
 // these are the individual fields for input, you can set the default text
 
 my_result.setEditable(false);
 // keeps user from changing this text field

 tf1.setPrefColumnCount(14);
 tf2.setPrefColumnCount(14);
 tf3.setPrefColumnCount(14);
 my_result.setPrefColumnCount(14);
 // this sets the number of spaces in the text fields

 Label l1 = new Label("Money used in investment: ");
 Label l2 = new Label("Years: ");
 Label l3 = new Label("Annual Interest Rate: ");
 Label l4 = new Label("Final Financial Worth: ");
 // these labels are set and used before the text fields as show below

 pane.getChildren().addAll(l1, tf1, l2, tf2, l3, tf3, l4, my_result);
 // call on the labels and text fields to be placed into the window

 VBox vBox = new VBox();
 Button calc_button = new Button("Calculate it!");
 // create a box to put the button in and name the button
 
 vBox.setAlignment(Pos.CENTER);
 vBox.getChildren().addAll(calc_button);

 BorderPane borderPane = new BorderPane();
 borderPane.setCenter(pane);
 borderPane.setBottom(vBox);
 BorderPane.setAlignment(vBox,Pos.CENTER);

 Scene scene = new Scene(borderPane, 500, 500);
 primaryStage.setTitle("Financial Calculator");
 primaryStage.setScene(scene);
 primaryStage.show();

 calc_button.setOnAction(e -> {
 my_result.setText(Double.parseDouble(tf1.getText()) +
 Double.parseDouble(tf2.getText()) + "");
 });

 }}

这是当前输出,所有行居中

【问题讨论】:

  • 使用GridPane 会有所帮助
  • 下载 scenebuilder 并使用它来更好地理解 JavaFX 布局工作。即使您不使用 FXML 也不打算使用它,该工具也可用于学习布局。
  • 感谢 Sedrick 和 Jewel。现在看看这两个,会让你知道的!
  • Sedrick,这正是我所需要的,谢谢! Jewel,我想我会在不久的将来使用那个场景构建器,它看起来非常棒!

标签: javafx alignment


【解决方案1】:

这是最终结果!再次感谢塞德里克! https://docs.oracle.com/javafx/2/get_started/form.htm

public void start(Stage primaryStage) throws Exception {
// this will use a standard exception handler

GridPane pane = new GridPane();
 pane.setAlignment(Pos.CENTER);
 pane.setHgap(5);
 pane.setVgap(5);
 pane.setPadding(new Insets(25,25,25,25)); // set top, right, bottom, left
 // this allows input fields to be placed in the window

 TextField tf1 = new TextField("00.00");
 TextField tf2 = new TextField("0");
 TextField tf3 = new TextField("0.00%");
 TextField my_result = new TextField("You cannot type here");
 // these are the individual fields for input, you can set the default text

 my_result.setEditable(false);
 // keeps user from changing this text field

 tf1.setPrefColumnCount(14);
 tf2.setPrefColumnCount(14);
 tf3.setPrefColumnCount(14);
 my_result.setPrefColumnCount(14);
 // this sets the number of spaces in the text fields

 Label l1 = new Label("Money used in investment: ");
 Label l2 = new Label("Years: ");
 Label l3 = new Label("Annual Interest Rate: ");
 Label l4 = new Label("Final Financial Worth: ");
 // these labels are set and used before the text fields as show below

 pane.add(l1, 0, 1);
 pane.add(tf1, 1, 1);
 pane.add(l2, 0, 2);
 pane.add(tf2, 1, 2);
 pane.add(l3, 0, 3);
 pane.add(tf3, 1, 3);
 pane.add(l4, 0, 4);
 pane.add(my_result, 1, 4);
 // call on the labels and text fields to be placed into the window
 // must be done individually so that location and order can be set by column/row

 Button calc_button = new Button("Calculate it!");
 pane.add(calc_button, 1, 5);
 // make a button and put it in the Gridpane

 BorderPane borderPane = new BorderPane();
 borderPane.setCenter(pane);

 Scene scene = new Scene(borderPane, 500, 500);
 primaryStage.setTitle("Financial Calculator");
 primaryStage.setScene(scene);
 primaryStage.show();

 calc_button.setOnAction(e -> {
 my_result.setText("");
 });

}

【讨论】:

    猜你喜欢
    • 2020-03-12
    • 2020-01-27
    • 1970-01-01
    • 2014-01-10
    • 2018-05-22
    • 1970-01-01
    • 1970-01-01
    • 2021-08-08
    • 1970-01-01
    相关资源
    最近更新 更多