JavaFX之FXController详解

  在JavaFX的UI开发中,FXController是个很重要的东西,主要是用于UI层和事件层分离。

 事实上,JavaFX使用FXML来开发UI界面,有多种形式来监听我们的事件,下面我们来细看。

 1.通过Controller Class来处理事件

 首先我们创建一个简单的界面,包含一个Button和一个Label。

 如下图:

 

  Label的fx:id设置为mLabel,Button的fx:id设置为mButton,同时将Button的onAction设置为onButtonClick。

  如下图所示:


  然后我们创建一个MainController类,写下如下代码:

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

public class MainLayoutController {
	@FXML
	private Button mButton;
	@FXML
	private Label mLabel;
	
	@FXML
	public void onButtonClick(ActionEvent event) {
		mLabel.setText("HelloWorld");
	}
}

  记住,我们需要在FXML的最上层添加fx:controller = "" 指向自己的MainController类(带包名)。

  我们的Main类如下:

import javafx.application.Application;
import javafx.fxml.FXMLLoader;
import javafx.stage.Stage;
import javafx.scene.Parent;
import javafx.scene.Scene;


public class Main extends Application {
	@Override
	public void start(Stage primaryStage) {
		try {
			Parent parent = FXMLLoader.load(getClass().getResource("MainLayout.fxml"));
			Scene scene = new Scene(parent,300,200);
			scene.getStylesheets().add(getClass().getResource("application.css").toExternalForm());
			primaryStage.setScene(scene);
			primaryStage.show();
		} catch(Exception e) {
			e.printStackTrace();
		}
	}
	
	public static void main(String[] args) {
		launch(args);
	}
}

  通过FXMLLoader加载FXML,并添加到Scene里面。

  运行效果如下:


  当我们点击按钮的时候,文本内容变成HelloWorld。

  这个就是我之前的文章中曾经讲过的事件方式。


  2.像Android一样处理事件

  接下来,我们来看看另外一种处理事件的方式。

  事实上,JavaFX提供类似于Android的一些方法,我们可以通过fx:id来查找指定的控件,并通过代码实现我们的事件。

  我们将上面的Main方法改动一下如下:

import javafx.application.Application;
import javafx.fxml.FXMLLoader;
import javafx.stage.Stage;
import javafx.scene.Parent;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.control.Label;


public class Main extends Application {
	@Override
	public void start(Stage primaryStage) {
		try {
			Parent parent = FXMLLoader.load(getClass().getResource("MainLayout.fxml"));
			Label label = (Label)parent.lookup("#mLabel");
			Button button = (Button)parent.lookup("#mButton");
			button.setOnAction(e ->{
				label.setText("HelloWorld JavaFX");
			});
			Scene scene = new Scene(parent,300,200);
			scene.getStylesheets().add(getClass().getResource("application.css").toExternalForm());
			primaryStage.setScene(scene);
			primaryStage.show();
		} catch(Exception e) {
			e.printStackTrace();
		}
	}
	
	public static void main(String[] args) {
		launch(args);
	}
}

  我们通过lookup根据fx:id来查找控件,并添加事件处理。

  运行效果如下:


  大家可以明显看见,我们通过lookup查找到控件后,添加的事件覆盖了FXController中的事件。

  这就是另外一种类似Android的查找控件-添加事件的模式,可以根据自己的需要酌情处理。


  另外在e(fx)clipse 1.1版本里面,已经可以像Nebeans一样,通过fxml自动生成FXController了,还是非常的方便的。


  本文章为个人原创,版权所有,转载请注明出处:http://blog.csdn.net/ml3947。另外我的个人博客:http://www.wjfxgame.com. 


JavaFX是一个用于构建富客户端应用程序的框架,它提供了许多组件和工具,用于创建漂亮的用户界面。在JavaFX中,可以使用CSS样式来控制组件的外观和布局,在这里我们可以使用CSS样式来设置背景。 以下是JavaFX背景设置的详细步骤: 1. 选择一个容器:JavaFX中的容器包括Pane、StackPane、BorderPane、GridPane等,你可以选择任何一个容器来设置背景。 2. 创建CSS样式表:在你的JavaFX应用程序中,可以使用CSS样式来设置容器的背景。你可以在应用程序的任何位置创建一个CSS样式表,例如在src目录下创建一个名为styles.css的文件。 3. 设置容器的ID:为了设置容器的背景,你需要为容器设置一个唯一的ID,这样CSS样式表才能找到它并应用样式。 4. 在CSS样式表中设置背景:打开样式表,并添加以下代码来设置背景: ``` #container-id { -fx-background-image: url("background.jpg"); // 设置背景图片 -fx-background-size: cover; // 设置背景图片的尺寸 -fx-background-position: center; // 设置背景图片的位置 } ``` 其中,#container-id是容器的ID,background.jpg是背景图片的文件名,cover是背景图片的尺寸,center是背景图片的位置。 5. 将CSS样式表应用到场景:在JavaFX中,可以通过Scene类将CSS样式表应用到场景中。可以在应用程序的主类中使用以下代码将样式表应用到场景中: ``` Scene scene = new Scene(root); scene.getStylesheets().add("styles.css"); // 将样式表添加到场景中 ``` 其中,root是容器的根节点。 6. 运行应用程序:运行你的JavaFX应用程序,你应该能够看到设置的背景。如果没有看到背景,请确保样式表中的ID和容器的ID匹配,并且背景图片的文件名正确。 以上就是JavaFX背景设置的详细步骤。希望能对你有所帮助!
评论 5
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值