JAVAFX界面跳转和加载不同的界面

最新推荐文章于 2024-05-31 17:11:21 发布
最新推荐文章于 2024-05-31 17:11:21 发布
阅读量1.6w 收藏 165
点赞数 27
分类专栏： javafx 文章标签： javafx
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/baidu_30325009/article/details/93321504
版权

主要分为两种情况

  1. 从一个界面跳转到另外一个新的界面
  2. 在原有界面上加载其他页面。类似iframe

先从第一个情况的实现说起。

页面跳转

1. 创建一个登录界面

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

<?import javafx.geometry.*?>
<?import javafx.scene.control.*?>
<?import java.lang.*?>
<?import javafx.scene.layout.*?>

<AnchorPane fx:id="login" maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="400.0" prefWidth="600.0" xmlns="http://javafx.com/javafx/8" xmlns:fx="http://javafx.com/fxml/1" fx:controller="app.view.login.LoginController">
	<children>
		<BorderPane prefHeight="20.0" prefWidth="600.0" />
		<Label layoutX="99.0" layoutY="96.0" text="用户名：" />
		<Label layoutX="99.0" layoutY="146.0" text="密  码：" />
		<TextField fx:id="login_username" layoutX="174.0" layoutY="91.0" promptText="用户名" />
		<TextField fx:id="login_password" layoutX="174.0" layoutY="141.0" promptText="8位密码" />
		<Button fx:id="login_button" layoutX="140.0" layoutY="206.0" mnemonicParsing="false" onAction="#loginButtonClick" text="登  录" />
	</children>
</AnchorPane>

在这里插入图片描述

2. 创建登录页面对应的组件实现

package app.view.login;

import java.net.URL;
import java.util.ResourceBundle;
import java.util.logging.Level;
import java.util.logging.Logger;

import app.alterview.ViewAlter;
import javafx.fxml.FXML;
import javafx.fxml.Initializable;
import javafx.scene.control.Button;
import javafx.scene.control.TextField;

public class LoginController extends LoginView implements Initializable {
	private static final Logger logger = Logger.getLogger(LoginController.class.getName());
	private ViewAlter viewAlter;
	
	@FXML
	private Button login_button;
	
	@FXML
	private TextField login_username;

	@FXML
	private TextField login_password;
	
	public void loginButtonClick() {
		logger.log(Level.INFO, "输入用户名为：" + login_username.getText());
		logger.log(Level.INFO, "输入密    码为：" + login_password.getText());
		if("nikolazhang".equalsIgnoreCase(login_username.getText())
				&& "123654".equalsIgnoreCase(login_password.getText())) {
			logger.log(Level.INFO, "登录成功！");
			viewAlter.gotoMain();
		} else {
			logger.log(Level.WARNING, "用户名或密码错误！");			
		}
	}

	@Override
	public void initialize(URL location, ResourceBundle resources) {
	}

	public void setApp(ViewAlter viewAlter) {
		this.viewAlter = viewAlter;
	}
}

3. 创建一个主页面

登录进去之后显示该界面

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

<?import javafx.scene.web.*?>
<?import javafx.scene.text.*?>
<?import javafx.geometry.*?>
<?import javafx.scene.control.*?>
<?import java.lang.*?>
<?import javafx.scene.layout.*?>

<AnchorPane fx:id="main" maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="400.0" prefWidth="600.0" xmlns="http://javafx.com/javafx/8" xmlns:fx="http://javafx.com/fxml/1" fx:controller="app.view.main.MainController">
	<children>
      <BorderPane prefHeight="640.0" prefWidth="590.0">
         <top>
            <Text strokeType="OUTSIDE" strokeWidth="0.0" text="欢迎进入系统" BorderPane.alignment="CENTER_LEFT" />
         </top>
         <left>
            <TreeView fx:id="main_treeview" onMouseClicked="#mainTreeViewClick" prefHeight="360.0" prefWidth="126.0" BorderPane.alignment="TOP_LEFT" />
         </left>
         <center>
            <ScrollPane prefHeight="600.0" BorderPane.alignment="CENTER">
               <content>
                  <AnchorPane fx:id="main_pane_under_scroll" maxHeight="-Infinity" maxWidth="-Infinity" prefHeight="593.0" prefWidth="480.0" />
               </content>
            </ScrollPane>
         </center>
         <bottom>
            <Text strokeType="OUTSIDE" strokeWidth="0.0" text="this system is created by NikolaZhang!" BorderPane.alignment="CENTER" />
         </bottom>
      </BorderPane>
	</children>
</AnchorPane>

在这里插入图片描述

4. 创建ViewAlter类用于跳转页面

package app.alterview;

import java.io.InputStream;
import java.util.logging.Level;
import java.util.logging.Logger;

import app.resource.StaticResourcesConfig;
import app.view.login.LoginController;
import app.view.main.MainController;
import javafx.application.Application;
import javafx.fxml.FXMLLoader;
import javafx.fxml.Initializable;
import javafx.fxml.JavaFXBuilderFactory;
import javafx.scene.Scene;
import javafx.scene.layout.AnchorPane;
import javafx.stage.Stage;

public class ViewAlter extends Application {

	private static final Logger logger = Logger.getLogger(ViewAlter.class.getName());
	private Stage stage;

	@Override
	public void start(Stage primaryStage) throws Exception {
		stage = primaryStage;
		stage.setTitle("XXXX系统");
		gotoLogin();
		stage.show();

	}

	/**
	 * 跳转到登录界面
	 */
	public void gotoLogin() {
		try {
			LoginController login = (LoginController) replaceSceneContent(StaticResourcesConfig.LOGIN_VIEW_PATH);
			login.setApp(this);
		} catch (Exception ex) {
			logger.log(Level.SEVERE, null, ex);
		}
	}

	/**
	 * 跳转到主界面
	 */
	public void gotoMain() {
		try {
			MainController main = (MainController) replaceSceneContent(StaticResourcesConfig.MAIN_VIEW_PATH);
			main.setApp(this);
		} catch (Exception ex) {
			logger.log(Level.SEVERE, null, ex);
		}
	}

	/**
	 * 替换场景
	 * @param fxml
	 * @return
	 * @throws Exception
	 */
	private Initializable replaceSceneContent(String fxml) throws Exception {

		FXMLLoader loader = new FXMLLoader();
		InputStream in = ViewAlter.class.getResourceAsStream(fxml);
		loader.setBuilderFactory(new JavaFXBuilderFactory());
		loader.setLocation(ViewAlter.class.getResource(fxml));
		try {
			AnchorPane page = (AnchorPane) loader.load(in);
			Scene scene = new Scene(page, StaticResourcesConfig.STAGE_WIDTH, StaticResourcesConfig.STAGE_HEIGHT);
			stage.setScene(scene);
			stage.sizeToScene();
		} catch (Exception e) {
			logger.log(Level.SEVERE, "页面加载异常！");
		} finally {
			in.close();
		}
		return (Initializable) loader.getController();
	}

	
	
	public static void main(String[] args) {
		launch(args);
	}

}

这个类是应用的启动类。页面跳转主要使用了自定义的replaceSceneContent方法，该方法的输入参数为界面的fxml的路径。
应用启动后，执行start方法初始加载登录界面。点击登录按钮，调用LoginController 的loginButtonClick方法，进行登录验证。验证通过调用gotoMain方法，页面跳转到主界面。

同一个布局中加载不同的界面

这里主要是实现了主界面中的TreeView。主界面的控制组件实现如下：

package app.view.main;

import java.io.IOException;
import java.net.URL;
import java.util.ResourceBundle;
import java.util.logging.Level;
import java.util.logging.Logger;

import app.alterview.ViewAlter;
import app.resource.StaticResourcesConfig;
import javafx.collections.ObservableList;
import javafx.fxml.FXML;
import javafx.fxml.FXMLLoader;
import javafx.fxml.Initializable;
import javafx.scene.Node;
import javafx.scene.control.ScrollPane;
import javafx.scene.control.TreeItem;
import javafx.scene.control.TreeView;
import javafx.scene.layout.AnchorPane;

public class MainController implements Initializable {
	private static final Logger logger = Logger.getLogger(MainController.class.getName());
	private ViewAlter viewAlter;

	@FXML
	private TreeView<String> main_treeview;

	@FXML
	private ScrollPane main_scroll_pane;

	@FXML
	private AnchorPane main_pane_under_scroll;

	public void setApp(ViewAlter viewAlter) {
		this.viewAlter = viewAlter;
	}

	@Override
	public void initialize(URL location, ResourceBundle resources) {
		setTreeView();
	}

	/**
	 * 设置TreeView
	 */
	@SuppressWarnings("unchecked")
	public void setTreeView() {
		TreeItem<String> root = new TreeItem<String>(StaticResourcesConfig.MAIN_TREE_HEADER);
		root.setExpanded(true);
		root.getChildren().addAll(new TreeItem<String>(StaticResourcesConfig.MAIN_TREE_HEADER_ITEM1),
				new TreeItem<String>(StaticResourcesConfig.MAIN_TREE_HEADER_ITEM2),
				new TreeItem<String>(StaticResourcesConfig.MAIN_TREE_HEADER_ITEM3),
				new TreeItem<String>(StaticResourcesConfig.MAIN_TREE_HEADER_ITEM4),
				new TreeItem<String>(StaticResourcesConfig.MAIN_TREE_HEADER_ITEM5));
		main_treeview.setRoot(root);

	}

	/**
	 * TreeView 点击事件
	 * @throws IOException 
	 */
	public void mainTreeViewClick() throws IOException {
		logger.log(Level.INFO, "点击TreeView");
		// 获取鼠标当前点击的Item
		TreeItem<String> selectedItem = main_treeview.getSelectionModel().getSelectedItem();
		logger.log(Level.INFO, selectedItem.getValue());

		String pagePath = "";
		switch (selectedItem.getValue()) {
		case StaticResourcesConfig.MAIN_TREE_HEADER:
			pagePath = StaticResourcesConfig.DEFAULT_VIEW_PATH;
			break;
		case StaticResourcesConfig.MAIN_TREE_HEADER_ITEM1:
			pagePath = StaticResourcesConfig.NOTE_VIEW_PATH;
			break;
		case StaticResourcesConfig.MAIN_TREE_HEADER_ITEM2:
			pagePath = StaticResourcesConfig.CLIP_VIEW_PATH;
			break;
		case StaticResourcesConfig.MAIN_TREE_HEADER_ITEM3:
			pagePath = StaticResourcesConfig.USER_VIEW_PATH;
			break;
		case StaticResourcesConfig.MAIN_TREE_HEADER_ITEM4:
			pagePath = StaticResourcesConfig.DATA_VIEW_PATH;
			break;
		case StaticResourcesConfig.MAIN_TREE_HEADER_ITEM5:
			pagePath = StaticResourcesConfig.LANGUAGE_VIEW_PATH;
			break;
		}
		
		skipView(pagePath);
	}

	/**
	 * 改变右侧scroll的界面
	 * @param pagePath
	 * @throws IOException
	 */
	private void skipView(String pagePath) throws IOException {
		logger.info("显示剪切板界面");
		ObservableList<Node> scrolChildren = main_pane_under_scroll.getChildren();
		scrolChildren.clear();
		scrolChildren.add(FXMLLoader.load(getClass().getResource(pagePath)));
	}

}

main_treeview.getSelectionModel().getSelectedItem();获取鼠标点击的是哪个项目。根据点击加载不同的界面。加载界面时调用的方法为skipView，该方法首先清空之前布局中存在的元素，并通过FXMLLoader重新加载我们需要的页面。
效果如下：
在这里插入图片描述

在这里插入图片描述

补充

StaticResourcesConfig定义如下

package app.resource;

public final class StaticResourcesConfig {
	public final static int STAGE_WIDTH = 800;
	public final static int STAGE_HEIGHT = 600;
	
	public final static String LOGIN_VIEW_PATH = "/app/view/login/LoginView.fxml";
	public final static String MAIN_VIEW_PATH = "/app/view/main/MainView.fxml";
	public final static String CLIP_VIEW_PATH = "/app/view/panel/clip/ClipView.fxml";
	public final static String NOTE_VIEW_PATH = "/app/view/panel/note/NoteView.fxml";
	public static final String DEFAULT_VIEW_PATH = "/app/view/panel/note/NoteView.fxml";
	public static final String LANGUAGE_VIEW_PATH = "/app/view/panel/note/NoteView.fxml";
	public static final String DATA_VIEW_PATH = "/app/view/panel/datanaly/DataView.fxml";
	public static final String USER_VIEW_PATH = "/app/view/panel/usermanage/UserView.fxml";
	
	// WWWWWWWWWWWWWWWWWWWWWWWWWWWWWWWWWWWWWWWW
	// WWW   界面字段显示 				    WWW
	// WWWWWWWWWWWWWWWWWWWWWWWWWWWWWWWWWWWWWWWW
	public final static String MAIN_TREE_HEADER = "首页";
	public final static String MAIN_TREE_HEADER_ITEM1 = "记事本";
	public final static String MAIN_TREE_HEADER_ITEM2 = "剪贴板";
	public final static String MAIN_TREE_HEADER_ITEM3 = "用户管理";
	public final static String MAIN_TREE_HEADER_ITEM4 = "数据分析";
	public final static String MAIN_TREE_HEADER_ITEM5 = "语言";

	
}
NikolaZhang
关注
  • 27
    点赞
  • 踩
  • 165
    收藏
    觉得还不错? 一键收藏
  • 17
    评论
专栏目录
JavaFX的页面跳转
lidancsdn的博客
01-25 6693
序言：在做项目时，我们通常会设置点击某个按钮或者文字实现页面跳转，例如： 我们点击上图的Sign to now可以跳转到注册界面，那我们应该如何实现？ 注册页面的MainClass package load.sign; import javafx.application.Application; import javafx.fxml.FXMLLoader; import javafx.scene.Parent; import javafx.scene.Scene; import javafx.stage
使用Javafx建立窗口并通过按钮实现窗口跳转
ECHONnn的博客
01-07 6918
目录前言环境搭建代码运行视图结语 前言 前几天，基友找我让我帮他做个超市收银系统桌面应用（java）。也是为了试试手，我就答应了，看到以前用的是swing。现在换个方法，用javafx做一个按钮跳转界面的功能。也算是对这一年多桌面应用学习的进步总结。 环境搭建 使用的是IntelliJ IDEA，直接搭建springboot。 搭建完之后，视图： porn.xml中主要是配置这两块 <dependency> <groupId>org.springfram
JavaFx基础学习【五】：FXML布局文件使用
最新发布
weixin_53618357的博客
05-31 901
JavaFx基础学习【一】：基本认识_TTc_的博客-CSDN博客JavaFx基础学习【二】：Stage_TTc_的博客-CSDN博客JavaFx基础学习【三】：Scene_TTc_的博客-CSDN博客JavaFx基础学习【四】：UI控件的通用属性_TTc_的博客-CSDN博客FXML是一种在JavaFX应用程序中定义用户界面的，基于XML的声明性标记语言。FXML非常适用来静态布局，如表单、控件和表格。
JavaFx在同一个Scence/Window加载新的fxml,以及在Controller中获取Stage
cdc的博客
06-16 5555
有这样的一种场景:在一个界面A中有一个按钮，点击这个按钮后，会弹出界面B,此时界面A已经不存在了。 //这是界面A的Controller public class HBoxMainController { @FXML private VBox rootVBox;//这是界面A的根布局的id @FXML private Button getPath;//这是界面...
JavaFX各个界面跳转的超野路子实现
violet_ever_garden的博客
06-19 1189
本方法由于的确是本人想出来的，还没搜到有人的讨论，感觉可能会导致不安全，未证实谨慎在大项目中使用，但是作为学生对付作业处理窗口跳转真是十分方便。 跳转时关闭窗口 这个不论有没有用fxml都可以用 由于这个程序是自动调用的，在程序入口类重写start的时候系统给的primaryStage，我们无法在建立时就把它放到特定地方，于是本方法： 制造一个公共的空间（类），里面都是static的数据与方法，全局可调用。 public class Common { public static Stage curr
JavaFX 窗口的 模态 父窗口 弹出子窗口 父窗口不可以编辑
jialan75的博客
01-09 1892
package fx.com; import javafx.application.Application; import javafx.stage.Modality; import javafx.stage.Stage; public class Main extends Application { public static void main(String[] args) { launch(Main.class,args); } @Override .
JavaFx小案例，实现了登录和窗口跳转以及列表显示
12-07
JavaFx小案例，实现了登录和窗口跳转以及列表显示
JavaFx登录跳转完整教程含源码
09-03
FXML文件可以被JavaFx的FXMLLoader加载和解析，以生成用户界面组件。 知识点3：JavaFx项目结构 一个JavaFx项目通常包含以下几个文件： * 主类（MainApplication）：负责启动JavaFx应用程序 * 视图文件（*.fxml）...
JavaFx的的简单音乐播放器.zip
04-26
JavaFX是一种用于构建桌面、移动和嵌入式设备上的富客户端应用程序的开源框架，它提供了丰富的用户界面组件和强大的图形库。在这个“JavaFX的的简单音乐播放器”项目中，我们将探讨如何利用JavaFX来创建一个基础的...
javafx-mediaplayer
07-03
JavaFX 是一个用于构建桌面、移动和Web应用的富客户端平台，它提供了丰富的图形用户界面（GUI）组件和媒体处理能力。在JavaFX中，我们可以创建一个媒体播放器来播放音频和视频文件。这个"javafx-mediaplayer"项目很...
宠物店-UI窗口-宠物图片展示.rar
10-14
Java提供了多种库来创建GUI，例如JavaFX和Swing。Swing是Java标准版（Java SE）的一部分，包含了丰富的组件库，如JFrame（主窗口）、JButton（按钮）、JLabel（标签）和JPanel（面板）等，可以构建出复杂的窗口应用...
javafx显示多个窗口以及javafx多窗口之间数据交互传输项目原文件
05-05
显示多窗口管理文章http://blog.csdn.net/miniduhua/article/details/71190747
java启动界面
05-29
Java 启动界面，通常指的是Java应用程序启动时显示的欢迎屏幕或者加载页面，它可以是定制化的，例如在描述中提到的加载图片为个人头像。这个特性使得开发者能够为自己的应用添加个性化元素，提高用户体验。在Java中...
JavaFX- 1.2 JavaFX起步:简单示例应用（四）使用FXML创建UI界面
zhoukun915684080的博客
03-12 1372
使用FXML创建UI界面 本教程展示了使用JavaFX FXML的好处，JavaFX FXML是一种基于XML的语言，它提供了用于构建与代码的应用程序逻辑分离的用户界面的结构。 如果从头开始阅读本系列文档，那么已经了解了如何仅使用JavaFX创建登录应用程序。 在这里，将使用FXML创建相同的登录用户界面，将应用程序设计与应用程序逻辑分开，从而使代码更易于维护。 本小节教程同样创建一个跟上一个教程...
javaFX实现登录界面并跳转
HRothschild的博客
09-16 4791
登录界面效果： 编写“用户名、密码、IP、端口”输入框和“重新输入、登录”按钮： Text name = new Text("用户名："); Text password = new Text("密码："); Text ip = new Text("IP: "); Text port = new Text("port: "); TextField e_name = new TextField(); e_name.setPrefWidth(150); TextField e_ip = new Te
java fx 多个窗口_使用JavaFX打开多个窗口
weixin_35926446的博客
02-28 992
推荐的方法是为每个FXML定义一个控制器.由于控制器非常轻巧,因此不会增加太多开销.您的main.fxml文件的控制器可能很简单import javafx.fxml.FXML ;public class MainController {@FXMLprivate void sendChat() {// ...}}我已经在单个项目中将这种方法用于大量的FXML文件和相应的控制器,并且在代码管理等方面没...
JavaFX文档(6)开始JavaFX之旅——4 使用FXML来创建用户界面
originer的专栏
08-03 4652
声明：如需转载，请注明出处:http://blog.csdn.net/originer 原文地址：http://docs.oracle.com/javase/8/javafx/get-started-tutorial/fxml_tutorial.htm 本文介绍
javafx的fx-falsework学习,java桌面程序框架，fx-falsewor初学习，问题及解决
シ❤゛甜虾的个人博客
04-24 1007
GitHub下载地址 https://github.com/sshahine/JFoenix 使用界面 登录界面，非常炫酷啊 下载源码，用IDEA社区版打开 第一步、修改服数据库为mysql，如果使用达梦数据库就不用改了，和端口 修改密码，和server的port，改为8000 第二步、修改客户端连接端口 ＃初始服务器列表，可以在运行时通过Archaius动态属性进行更改， sample-client.ribbon.listOfServers =localhost:800.
JavaFX多个界面中的数据传递
xizi1103的博客
04-20 5621
JavaFX多个界面中的数据传递 经常遇到多个界面的数据传递问题，其实这个问题的解决方法很多，但是刚学JavaFX的可能不太熟悉，我在想这里简单介绍几种方法。 getController() public class SourceDataController { public TextField name; public TextField age; public v...
SpringBoot整合JavaFX实现界面跳转
09-02
SpringBoot整合JavaFX可以实现界面跳转。可以通过使用一个控制器类来管理多个窗口的加载和切换。在这个控制器类中，可以使用Stage对象来管理不同的窗口。 首先，需要创建一个启动类，例如App.java。在这个类中，可以设置默认的主窗口，并加载所有需要的窗口。然后，通过控制器类来实现窗口的切换。 引用中的代码展示了一个启动类的示例。在这个类中，使用StageController控制器来管理窗口。首先，加载登录窗口和主窗口。然后，通过change方法来切换到登录窗口。 接下来，需要编写一个窗口控制器类，例如StageController。在这个类中，可以使用HashMap来存储窗口的ID和对应的FXML文件路径。通过loadStage方法来加载窗口，并使用change方法来切换窗口。 最后，需要在SpringBoot项目中配置JavaFX的启动类。可以在Application类上添加注解@JavaFxApplication，并在main方法中使用SpringApplication类的launch方法来启动JavaFX应用程序。 通过以上的步骤，就可以实现SpringBoot整合JavaFX并实现界面跳转。<span class="em">1</span><span class="em">2</span><span class="em">3</span> #### 引用[.reference_title] - *1* *2* [JavaFX 实现windows版简易的登录软件 | 整合 MyBatis 查询数据库账号 | 窗口切换 | 使用SceneBuilder进行...](https://blog.csdn.net/Unirithe/article/details/123172566)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_1"}}] [.reference_item style="max-width: 50%"] - *3* [深入Spring源码系列--Spring/Springboot 注解失效原因解析](https://blog.csdn.net/qq_38758009/article/details/105019773)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_1"}}] [.reference_item style="max-width: 50%"] [ .reference_list ]
评论 17
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值