JavaFX学习笔记（三）　FXML与控制器(Java代码)

时间：2022-01-14 17:00:36

每个FXML只有一个控制器（一个java类），用以响应页面的各种事件，就像html与js的关系。


引入控制器

在JavaFX Scene Builder设计视图中选中视图的根结点（每个视图只有一个根结点），在右边选择“代码”属性面板，第一个属性为“控制器类”，输入类路径，如t1.T1Controller。


使用控制器中的方法

选中视图树（分层结构）中的任意节点，在右边面板选择“代码”属性面板，有很多事件可供设置，其值为控制器中的方法名前面加上一个#。


以下为控制器的代码


package t1;

/*
 * To change this template, choose Tools | Templates
 * and open the template in the editor.
 */

import java.net.URL;
import java.util.ResourceBundle;

import javafx.event.ActionEvent;
import javafx.fxml.FXML;
import javafx.fxml.Initializable;
import javafx.scene.control.Button;

/**
 * 
 * @author root
 */
public class T1Controller implements Initializable {

	@FXML
	private Button btn1;
	@FXML
	private Button btn2;

	@FXML
	private void btn1Action(ActionEvent event) {
		System.out.println("You clicked btn1!");
	}

	@FXML
	private void btn2Action(ActionEvent event) {
		System.out.println("You clicked btn2!");
	}

	@Override
	public void initialize(URL url, ResourceBundle rb) {
		// TODO
	}
}


以下为FXML源文件中的配置 

<?xml version="1.0" encoding="UTF-8"?>

<?import java.lang.*?>
<?import java.util.*?>
<?import javafx.geometry.*?>
<?import javafx.scene.control.*?>
<?import javafx.scene.layout.*?>
<?import javafx.scene.paint.*?>
<?import javafx.scene.shape.*?>
<?import javafx.scene.web.*?>

<BorderPane id="BorderPane" prefHeight="459.0" prefWidth="600.0" 
stylesheets="T1.css" styleClass="bg" 
 xmlns:fx="http://javafx.com/fxml" fx:controller="t1.T1Controller"> <!--配置控制器-->
 <bottom>
    <HTMLEditor htmlText="<html><head></head><body contenteditable="true"></body></html>" minWidth="485.0" opacity="1.0" prefHeight="153.0" prefWidth="597.0" />
  </bottom>
  <center>
    <TextArea prefHeight="351.0" prefWidth="572.0" text="this is center this is center this is center 
this is center this is center this is center 
this is center this is center this is center 
this is center this is center this is center 
this is center this is center this is center this is center this is center this is center this is center this is center this is center this is center this is center this is center this is center this is center this is center this is center this is center this is center this is center this is center this is center this is center this is center this is center this is center " wrapText="true" />
  </center>
  <left>
    <ListView prefHeight="379.0" prefWidth="116.0" />
  </left>
  <padding>
    <Insets bottom="2.0" left="2.0" right="2.0" top="2.0" />
  </padding>
  <right>
    <TableView prefHeight="291.0" prefWidth="78.0">
      <columns>
        <TableColumn prefWidth="75.0" text="列 X" />
      </columns>
    </TableView>
  </right>
  <top>
    <FlowPane prefHeight="25.0" prefWidth="601.0">
      <children>
        <!--使用函数-->
        <Button fx:id="btn1" mnemonicParsing="false" onAction="#btn1Action" style="-fx-background-color:red;" text="Button1" />
        <Button fx:id="btn2" mnemonicParsing="false" onAction="#btn2Action" text="Button2" styleClass="bg2"  />
        <Line endX="100.0" startX="-100.0" />
      </children>
      <padding>
        <Insets bottom="3.0" left="5.0" right="5.0" top="3.0" />
      </padding>
    </FlowPane>
  </top>
</BorderPane>




标签：

相关文章