在IDEA中使用SceneBuilder打开fxml文件进行编辑。
第一次打开只有一个空的GridPane面板,没有任何其他内容。
接下来将拖拉右边的组件构建页面。
第一步:拖拉一个垂直容器VBox
第二步:设置各种组件的属性
第三步:整个界面设计的结构如下:
第四步:在Properties面板设置组件的基本属性
第五步:设置组件的布局
第六步:设置标识id和事件方法
如上面的文本框的fx:id为resultTextField。
如按钮的点击事件方法moduleButtonEvent
解释说明:
-
id是在Controller中属性的组件名,即为实例化的组件对象。
-
而On Action名即为按钮的点击事件方法名,也在Controller中使用。
第六步:获取组件的属性和事件方法
第七步:覆盖Controller内容。
点击Copy按钮复制面板内容,然后覆盖Controller.java内容即可。
也会发现sample.fxml的内容变了
第八步:点击运行程序
运行界面如上所示,但是会发现界面很小,而且内容没有显示完全。
那么就需要修改一些设置了。
打开Main.java将内容改成如下:
package sample;
import javafx.application.Application;
import javafx.fxml.FXMLLoader;
import javafx.scene.Parent;
import javafx.scene.Scene;
import javafx.stage.Stage;
public class Main extends Application {
@Override
public void start(Stage primaryStage) throws Exception {
// 加载界面资源文件
Parent root = FXMLLoader.load(getClass().getResource("sample.fxml"));
// 设置标题
primaryStage.setTitle("计算器");
// 设置场景到主舞台,场景的高度和宽度
primaryStage.setScene(new Scene(root, 600, 630));
// 展示舞台
primaryStage.show();
}
public static void main(String[] args) {
// 运行程序
launch(args);
}
}
再次运行程序,效果图展示如下:
JavaFX完成的界面比swing要美观得多,而且更容易完成,省了不少时间。
可搜索微信公众号【Java实例程序】或者扫描下方二维码关注公众号获取更多。
注意:在公众号后台回复【20191017】可获取本节源码。