javafx备课

1.下载scenebuild2.0

下载地址

https://www.oracle.com/java/technologies/javafxscenebuilder-1x-archive-downloads.html

下载自己需要的版本

2.在idea里面配置

打开设置=>选择javafx=>设置scenebuilder的安装路径

 3.下载javafx插件

首先，idea下载插件javaFx，安装完插件后fxml可以被识别为可识别文件，且支持fxml相关的语义操作。

同时，该插件还可以内嵌Scene Builder，实时查看fxml效果以及通过Scene Builder拖拽式自动生成fxml结构语言。

4.scenebuilder基础使用

1.模块介绍
主要分为四个区域元素对象选择区（元素库）、预览展示区、控件属性区域、层次结构区。

元素库主要包含：容器、控件、菜单、混合组合、图形形状、图表。在日常使用过程中，容器、控件、菜单就能满足我们绝大部分的需求。其次是图形和图标，然而混合类别使用较少，在一些切换按钮、单选等组合控件中可能会使用到。

属性区域主要包含三部分：元素属性、元素布局、元素动作。

层次结构区域能够清晰的展示容器之间的关系，以及容器与控件之间的父子关系。能够让设计者清楚的找到某一控件的位置，以方便修改。

布局，容器，组件，表单等等

设置样式

设置id和方法

绑定controller，view类

如何导入图片

5.设置view类(设置运行入口

public class DemoView {
    static Stage demoStage;
    public static void start(Stage primaryStage) throws IOException {
        demoStage= primaryStage;
        Parent root = FXMLLoader.load(DemoView.class.getResource("demo.fxml"));
        primaryStage.setTitle("demo");
        primaryStage.setScene(new Scene(root, 503, 349));
        primaryStage.show();
    }
}

运行页面入口类

public class View extends Application {
    public static void main(String[] args) {
        launch(args);
    }

    @Override
    public void start(Stage primaryStage) throws Exception {
        primaryStage.initStyle(StageStyle.TRANSPARENT);
        LoginView.start(primaryStage);
    }
}

设置无顶部栏，设置窗口的长宽，标题

6.如何让页面初始化（实现Initializable接口）重写init方法

public class UsedChatListController implements Initializable {
    public Text chatList;
    public static String chatTimes;

    @Override
    public void initialize(URL location, ResourceBundle resources) {
        chatList.setText(chatTimes);
    }
}

7.实现跳转页面

DemoView.demoStage.close();//关闭当前窗口
TestView.start(new Stage());//打开新的窗口

8.如何实现列表布局（vbox

首先在父页面里设置一个vbox布局，同时给这个vbox设置id为‘list'

再创建子组件，子页面的AnchorPane(也就是子组件的最底层的组件）设置id为’pane'

//拿到子页面的根节点
Parent root = FXMLLoader.load(TestController.class.getResource("test.fxml"));
//获取AnchorPane 实例
AnchorPane anchorPane = (AnchorPane) root.lookup("#pane");
//往vbox布局添加子页面
list.getChildren().add(anchorPane);