JavaFX文档(12)掌握FXML——4使用FXML来创建自定义控件

声明:如需转载,请注明出处:http://blog.csdn.net/originer

原文地址:http://docs.oracle.com/javase/8/javafx/fxml-tutorial/custom_control.htm

在本教程中,你将会创建一个由文本框和按钮组成的自定义控件。如下图:


在开始之前,你需要确保自己的IDE支持JavaFX8。另外你需要对FXML工程的基本结构(.java,.fxml和Controller文件)已经了解了。

创建工程

在IDE中创建CustomControlExample工程,创建CustomControlExample.java,CustomControl.java、custom_control.fxml文件。

创建基本的用户界面

定义一个简单的自定义控件,其中包括一个TextField和一个Button实例。根容器是一个javafx.scene.layout.VBox类。

1. 编辑custom_control.fxml文件

2.将代码改成如下所示:

<?import javafx.scene.*?>
<?import javafx.scene.control.*?>
<?import javafx.scene.layout.*?>

<fx:root type="javafx.scene.layout.VBox" xmlns:fx="http://javafx.com/fxml"> 
    <TextField fx:id="textField"/>
    <Button text="Click Me" onAction="#doSomething"/>
</fx:root>

创建一个控制器

在本例中CustomControl类继承了VBox类(由<fx:root>元素所定义的类型),并且在其构造方法中设置其自身既是root、也是FXML的Controller。当文档被加载时,CustomControl实例将会由文档内容所填充而成。

将CustomControl类的代码改成如下所示:

package customcontrolexample;

import java.io.IOException;

import javafx.beans.property.StringProperty;
import javafx.fxml.FXML;
import javafx.fxml.FXMLLoader;
import javafx.scene.control.TextField;
import javafx.scene.layout.VBox;

public class CustomControl extends VBox {
    @FXML private TextField textField;

    public CustomControl() {
        FXMLLoader fxmlLoader = new FXMLLoader(getClass().getResource(
"custom_control.fxml"));
        fxmlLoader.setRoot(this);
        fxmlLoader.setController(this);

        try {
            fxmlLoader.load();
        } catch (IOException exception) {
            throw new RuntimeException(exception);
        }
    }

    public String getText() {
        return textProperty().get();
    }

    public void setText(String value) {
        textProperty().set(value);
    }

    public StringProperty textProperty() {
        return textField.textProperty();
    }

    @FXML
    protected void doSomething() {
        System.out.println("The button was clicked!");
    }
}

加载FXML源文件、定义Stage和Scene

CustomControlExample.java文件包括了main入口,其中定义了stage和scene,并且加载FXML源文件。此类通过CustomControl类来加载FXML源文件。

将CustomControlExample类代码修改为:

package customcontrolexample;
import javafx.application.Application;
import javafx.scene.Scene;
import javafx.stage.Stage;
public class CustomControlExample extends Application{

	@Override
	public void start(Stage stage) throws Exception {
		CustomControl customControl = new CustomControl();
		customControl.setText("Hello!");
		stage.setScene(new Scene(customControl));
		stage.setTitle("Custom Control");
		stage.setWidth(300);
		stage.setHeight(200);
		stage.show();
	}
	public static void main(String[] args) {
		launch(args);
	}

}

运行界面如下:


控件创建完毕后,可以在代码或FXML中像使用标准控件一样来使用它,样例如下:

代码样例:

HBox hbox = new HBox();
CustomControl customControl = new CustomControl();
customControl.setText("Hello World!");
hbox.getChildren().add(customControl);


FXML样例:

<HBox>
    <CustomControl text="Hello World!"/>
</HBox>
可以下载 CustomControlExample.zip来查看完整的源码。

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值