Java FX 学习

声明：参考视频

一. Stage与Scene

• 舞台与场景：JavaFX应用程序将Ul容器定义为舞台（Stage）与场景（Scene）Stage类是顶级容器，它对应于窗体，其内容由Scene决定。Scene类是所有可视化内容的容器（container），可以把它看成是一张画布，上面绘制了用户可以看到的内容。
• Scene Graph 其实就是一颗多叉树，各种控件都是树中的节点。
• 控件树的节点支持事件响应。
• 最底层节点通常都是诸如按钮之类的控件也可以是Circle之类的图形。
• 拥有子树节点称为容器，在JavaFX中成为“布局（Layout）”.
• 这样做以后可以在窗口Stage中切换Scene从而实现随时切换页面，同时也可以新建Stage从而实现打开多个窗口。

二. Java FX MVC架构

• 多窗体通信
  

核心点：在MainClass初始化窗口时，将MainClass的引用传给相应窗口的控制器。之后在每个窗口的控制器中通过MainClass的引用完成从窗口的打开以及主从窗口的通信。
     在主窗口中打开新的窗口： 在MainClass初始化主窗口时，可以将MainClass的引用传给相应从窗口的控制器，然后在主窗口的控制器中通过MainClass的引用调用打开的窗口的函数，从而打开新的窗口。
    在从窗口中关闭从窗口： 在MainClass初始化从窗口时，将从窗口的stage传给从窗口的控制器，在从窗口的控制器中调用stage.close(),从而关闭从窗口。
    主窗口接收从窗口的信息：在MainClass初始化从窗口时，将主窗口的控制器的引用传给从窗口的控制器，在从窗口的控制器中调用主窗口控制器的相应方法,从而在主窗口中显示信息。
    从窗口接收主窗口的信息：在MainClass初始化从窗口时，将MainCLass的引用传给从窗口的控制器，在主窗口的控制器中通过MainCLass的引用的调用相应方法,从而在从窗口中显示信息。

demo下载

注意：在项目中加入资源时，将资源放在与包名同名的resources路径下，以此来方便使用资源文件。如下图所示在项目编译时，会将resources下的资源放到同名的包中。

三. 事件处理机制

• 事件响应模式：
  • 传统的事件响应模式
  • Lamda事件响应模式
  • 声明式事件响应模式

//传统的事件响应模式
this.btn.setOnAction(new EventHandler<ActionEvent>() {
      @Override
    public void handle(ActionEvent actionEvent) {
        welcomeText.setText("Hello World!");
    }
    });
//Lamda事件响应模式
private void getRandomInt(ActionEvent actionEvent){
    Random random = new Random();
    int i = random.nextInt();
    welcomeText.setText(String.valueOf(i));
 }
this.btn2.setOnAction(this::getRandomInt);

// 声明式事件响应模式
//fxml文件中 onAction="#事件名" <Button fx:id="btn3" layoutX="229.0" layoutY="287.0" mnemonicParsing="false" onAction="#handleRandowm" text="声明式事件响应" />
@FXML
public void handleRandowm(ActionEvent actionEvent) {
   Random random = new Random();
   int i = random.nextInt();
   welcomeText.setText(String.valueOf(i));
   }

• 事件派发链
  事件在控件树的传播流程成为事件派发连
  

（1）事件派发链，实际上是一个双向链表，由事件目标对象负责创建。
（2）事件触发时，事件对象在链中传送
（3）事件响应方法（分为EventFilter和EventHandler两类）接收事件对象作为参数。

如下图所示，

    //统一事件处理方法，输出event对象相关属性值
   //有参数决定是否消费此事件
   private void handleAndConsumd(Event event,boolean isConsumd,String msg) {
       if (isConsumd) {
           event.consume();
       }
       String info =String.format("Type:%s,source:%s,target:%s,consume:%s,msg:%s",
               event.getEventType(), event.getSource(),event.getTarget(),event.isConsumed(), msg);
       System.out.println(info);
   }

   void initListener(){
       borderpane.addEventFilter(MouseEvent.MOUSE_PRESSED,
               event -> handleAndConsumd(event, true, "borderpane filter mouse pressed"));
       borderpane.addEventHandler(MouseEvent.MOUSE_PRESSED, event -> handleAndConsumd(event, false, "borderpane handler mouse pressed"));

       vbox.addEventFilter(MouseEvent.MOUSE_PRESSED, event -> handleAndConsumd(event, false, "vbox filter mouse pressed"));
       vbox.addEventHandler(MouseEvent.MOUSE_PRESSED, event -> handleAndConsumd(event, false, "vbox handler mouse pressed"));

       circle.addEventFilter(MouseEvent.MOUSE_PRESSED, event -> handleAndConsumd(event, false, "circle filter mouse pressed"));
       circle.addEventHandler(MouseEvent.MOUSE_PRESSED, event -> handleAndConsumd(event, false, "circle handler mouse pressed"));

   }
   @Override
   public void initialize(URL url, ResourceBundle resourceBundle) {
       initListener();

   }

三. JavaFX数据绑定机制及应用

• JavaFX Bean Property: 包括get, set,以及property方法，JAVA FX Property具有动态监听property.addListner()和数据绑定property.bind()等特性。

• JavaFX数据绑定的编程模式：
  

• 应用
  
  分析：可以将变化的数据统一抽象为IntegerProperty,进行数据绑定，然后add 和sub只管更改IntergerProperty（）（控件上有property属性的直接进行绑定，没有的话可以通过addListner()进行绑定）

    IntegerProperty integerProperty = new SimpleIntegerProperty(0);


    @Override
    public void initialize(URL url, ResourceBundle resourceBundle) {
        arc.setStartAngle(90);
        arc.setLength(-0);
		#绑定数据
        numLabel.textProperty().bind(integerProperty.asString());
        addBtn.disableProperty().bind(integerProperty.greaterThanOrEqualTo(100));
        subBtn.disableProperty().bind(integerProperty.lessThanOrEqualTo(0));

        integerProperty.addListener((observableValue, number, t1) -> {
            arc.setStartAngle(90);
            arc.setLength(-t1.intValue() * 3.6);
            bar.setProgress(t1.intValue() / 100.0);
        });
    }
    @FXML
    public void sub(ActionEvent actionEvent) {
        integerProperty.set(integerProperty.get() - 10);
    }
    @FXML
    public void add(ActionEvent actionEvent) {
        integerProperty.set(integerProperty.get() + 10);
    }

demo下载

四.Java FX实现MVVM架构

• 业务逻辑代码单独抽离抽离出来，
• view与ViewModel进行数据绑定
• 控制器调用业务逻辑代码进行相应。
  demo下载

五.多线程

• Runnable 对象

对于比较耗时的任务，需要使用多线程技术，但对UI控件的修改必须在JavaFX application thread中执行，因此可以使用 Platform.runLater() 推送到JavaFx application thread中执行修改UI控件的任务。

 Runnable task =()-> {
     try {
     	 //TODO: 执行耗时任务的代码
         Thread.sleep(1000);
         //Lambda表达式执行的任务，将会被推送到JavaFx application thread中执行
         //因此，里面可以有直接访问UI控件的代码
         Platform.runLater(()->{
           //TODO: 执行修改UI控件的代码
         });

        } catch (InterruptedException e) {
         // TODO Auto-generated catch block
           
        } };

• Task对象（有返回值）里面封装了updateMessage(),updateProgress()修改UI控件的函数。