javafx可视化界面的切换和菜单栏

一. 可视化界面之间的切换
首先程序执行会生成一个界面,然后你点击一个按钮转换到另外的界面
这个问题困扰了我很长时间,我搜索了很多资料,差不多都是wndows()方法来实现的。
我采用了另外一种方法:
(1)把你想要显示的界面全部定义成普通类;
(2)定义一个可存放各个普通类的主类,通过调用普通类生成可视化界面;
(3)设定你想要显示的界面的普通类的stage为可见,设定其他为不可见;
(4)设定普通类中的触发事件里面的普通类的stage可见或者不可见(界面转换);

这个方法主要是将各个可视化界面的面板设定为类,初始化对象为不可见或者可见(显示第一个面板),并放入主类的数组中,然后在触发事件中设定普通类的可见性。

具体过程如下:
(1)先创建一个主类

package EmployeeInformationSystem;

import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.ResultSet;
import java.sql.SQLException;
import java.sql.Statement;
import java.util.Collection;
...
// 导入模块

public class MainStackPane extends Application {
	
	public static void main(String[] args)  {
		try {
			Application.launch(args);
		}
		catch(Exception ex)
		{
			ex.printStackTrace();
		}
		
	}
	
	@Override
	public void start(Stage primaryStage) throws Exception
	{
		
		Object[] functionList = new Object[7];//数组中存放普通类返回的面板,数组指针指向各个面板,方便触发事件设定可见或者不可见
		
		GridPane LogInPanel = new LogIn().createLogInPanel(functionList,primaryStage);  //登陆界面
		VBox MainInterfacePanel = new MainInterface().creatMainInterfacePanel(functionList,primaryStage);//主界面
		VBox InformationEntryPanel = new InformationEntry().creatInformationEntryPanel(functionList,primaryStage);//录入信息界面
		VBox SelectAndUpdatePanel = new SelectAndUpdate().creatSelectAndUpdatePanel( functionList,primaryStage);//查询和修改界面
		VBox DistributionPanel = new Distribution().creatDistributionPanel(functionList,primaryStage);//分布概况界面
		VBox RegisterPanel = new Register().creatRegisterPanel(functionList,primaryStage);//系统管理员注册界面
		VBox CompanyProfilePanel = new CompanyProfile().creatCompanyProfilePanel(functionList,primaryStage);//系统管理员注册界面
		
		//各个面板赋值给数组元素
		functionList[0] = LogInPanel;
		functionList[1] = MainInterfacePanel;
		functionList[2] = InformationEntryPanel;
		functionList[3] = SelectAndUpdatePanel ;
		functionList[4] = DistributionPanel;
		functionList[5] = RegisterPanel;
		functionList[6] = CompanyProfilePanel;
		
        //栈面板依次放入普通类返回的面板,但是可以设定某一个面板为可见,其余的不可见,那么可视化界面最后显示的就是一个界面
		StackPane mainStackPane = new StackPane();
		mainStackPane.getChildren().add(LogInPanel);//登陆面板,可见
		mainStackPane.getChildren().add(MainInterfacePanel);//主页,不可见
		mainStackPane.getChildren().add(InformationEntryPanel);//不可见
		......
		
		Scene scene = new Scene(mainStackPane,600,400);
		//primaryStage.setResizable(false);
		primaryStage.setTitle("登陆");
		primaryStage.setScene(scene);
		primaryStage.show();
	}
}

(2)创建普通类

登陆面板(重要代码在触发事件和本类的最后两行)

package EmployeeInformationSystem;


import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.PreparedStatement;
......

import javafx.application.Application;
import javafx.event.ActionEvent;
import javafx.scene.Scene;
import javafx.stage.Stage;
//空白格
import javafx.scene.control.*;//字标签
//网格面板
import javafx.scene.layout.*;//水平面板
import javafx.scene.image.Image;
import javafx.scene.image.ImageView;
import javafx.scene.text.FontWeight;
...

public class LogIn {
	
	SQLServer sqlserver = new SQLServer();
	//返回网格面板
	public GridPane createLogInPanel(Object[] functionList,Stage primaryStage) 
	{
		GridPane gridpane = new GridPane();
		gridpane.setAlignment(Pos.CENTER);//设置节点水平对齐
		gridpane.setVgap(20);//节点间的垂直间隔
		gridpane.setHgap(20);//节点间的水平间隔
		
		Label label1 = new Label("职工信息管理系统");
		Font font = Font.font("Times New Romes",FontWeight.BOLD,FontPosture.ITALIC,30);//设置字体
		label1.setFont(font);
		gridpane.setColumnSpan(label1,5);//设置跨行
		gridpane.add(label1, 0, 0);
		......
		
		Label label3 = new Label("密码:");
		label3.setFont(font1);//设置字体
		label3.setTextFill(Color.BLACK);//设置字的颜色
		......
		
		//登录功能的实现
		button1.setOnAction((ActionEvent e)->{
		//当然登陆成功还得实现匹配用户名和密码,这里就不展示了
		                        gridpane.setVisible(false);//点击登陆按钮,就设定本类面板不可见
								((VBox)functionList[1]).setVisible(true);//设定将要显示的面板为可见
								primaryStage.setWidth(645);
								primaryStage.setHeight(480);
								primaryStage.setTitle("主页");
		);
			
		Button button2 = new Button("注册");
		button2.setOnAction((ActionEvent e)->{
			gridpane.setVisible(false);
			((VBox)functionList[5]).setVisible(true);
			primaryStage.setTitle("系统管理员注册");
		});
		
		gridpane.add(button1, 1, 4);
		gridpane.add(button2, 2, 4);
		Image loginImage = new Image("loginImage.jpg");//加载图片
		gridpane.setBackground(new Background(new BackgroundImage(loginImage,BackgroundRepeat.REPEAT,
				BackgroundRepeat.NO_REPEAT,BackgroundPosition.DEFAULT,BackgroundSize.DEFAULT)));
		
		//这里没有设定本类的面板为不可见,那么就是返回就是可见的
		return gridpane;
				
	}
}

主面板(重要代码在触发事件和本类的最后两行)

package EmployeeInformationSystem;


import javafx.application.*;
import javafx.event.ActionEvent;
import javafx.geometry.Insets;
import javafx.geometry.Pos;
import javafx.scene.Scene;
import javafx.stage.Stage;
import javafx.scene.control.Button;
......

public class MainInterface {
	
	GridPane gridpane = new GridPane();
	VBox finalVBox = new VBox();//垂直面板

	public VBox creatMainInterfacePanel(Object[] functionList,Stage primaryStage)
	{   //普通方法,从主类传递过来数组引用和舞台引用,返回面板
		
		Button button1 = new Button("", new ImageView(new Image("informationEntry.png", 300, 200, false, false)));
		Button button2 = new Button("", new ImageView(new Image("selectAndUpdate.png", 300, 200, false, false)));
		Button button3 = new Button("", new ImageView(new Image("distribution.png", 300, 200, false, false)));
		Button button4 = new Button("", new ImageView(new Image("companyProfile.png", 300, 200, false, false)));
		
		Image mainInterfaceImage = new Image("mainInterfaceImage.png");//加载图片
		finalVBox.setBackground(new Background(new BackgroundImage(mainInterfaceImage,BackgroundRepeat.REPEAT,
				BackgroundRepeat.NO_REPEAT,BackgroundPosition.DEFAULT,BackgroundSize.DEFAULT)));

         //在触发事件中实现面板的切换
		button1.setOnAction((ActionEvent e)->{       //信息录入
			finalVBox.setVisible(false);//设定本类的面板不可见
			((VBox)functionList[2]).setVisible(true);//设定将要显示的类的面板可见
			primaryStage.setWidth(645);
			primaryStage.setHeight(430);
			primaryStage.setTitle("信息录入");
		});
		
		button2.setOnAction((ActionEvent e)->{     //查询和修改
			finalVBox.setVisible(false);   //设定本类中的面板不可见
			((VBox)functionList[3]).setVisible(true);//设定将要显示的类的面板可见
			primaryStage.setWidth(640);
			primaryStage.setHeight(480);
			primaryStage.setTitle("查询和修改");
		});
		......

		
		VBox vbox = new VBox();//垂直
		MenuChoose a = new MenuChoose();
		vbox = a.createMenuChoose(functionList,primaryStage);
		
		//gridpane.setColumnSpan(label,3);//设置跨行
		finalVBox.setAlignment(Pos.CENTER);//设置节点水平对齐
		
		gridpane.add(button1, 0, 0);
		gridpane.add(button2, 1, 0);
		......
		
		finalVBox.getChildren().addAll(vbox);
		finalVBox.getChildren().addAll(gridpane);
		
		//设定返回的面板为不可见
		finalVBox.setVisible(false);
		return finalVBox;
	}}

页面展示:
在这里插入图片描述

二. 菜单栏
个人认为菜单栏还是挺好用的,现在的很多可视化界面实现的切换功能少不了菜单栏。
照道理菜单栏最后的容器应该是水平面板,但是我定义的是垂直面板,正好可以实现可视化界面菜单栏填充整个界面的效果。

package EmployeeInformationSystem;
//菜单栏

import javafx.event.ActionEvent;
import javafx.scene.control.Menu;
import javafx.scene.control.MenuBar;
import javafx.scene.control.MenuItem;
......

public class MenuChoose {

	public VBox createMenuChoose(Object[] functionList,Stage primaryStage) {

		// 定义菜单条和功能选择界面容器
		VBox menuBox = new VBox(); // 菜单条容器,垂直面板,小技巧
		
		// 创建菜单栏,存放各类菜单选项
		MenuBar menubar = new MenuBar();
		Menu menu1 = new Menu("开始");
		MenuItem returnLoginPanel = new MenuItem("返回登陆界面");
		MenuItem returnFunctionPanel = new MenuItem("返回主页");
		menu1.getItems().addAll(returnFunctionPanel,returnLoginPanel );
		Menu menu2 = new Menu("帮助");
		Menu menu3 = new Menu("测试");
		Menu menu4 = new Menu("退出");
		MenuItem exitMenu = new MenuItem("退出系统");
		
		menu4.setOnAction((e) -> {
			System.exit(0);
		});
		
		returnFunctionPanel.setOnAction((ActionEvent e)->{
			((VBox) functionList[1]).setVisible(true);    //主界面
			((VBox) functionList[2]).setVisible(false);
			((VBox) functionList[3]).setVisible(false);
			((VBox) functionList[4]).setVisible(false);
			((VBox) functionList[5]).setVisible(false);
			((VBox) functionList[6]).setVisible(false);
			((GridPane) functionList[0]).setVisible(false);
			primaryStage.setWidth(645);
			primaryStage.setHeight(480);
			primaryStage.setTitle("主页");
		});
		......
		
		//menu4.getItems().add(exitMenu);
		menubar.getMenus().addAll(menu1, menu2, menu3, menu4);

		// 定义功能选择界面
		menuBox.getChildren().add(menubar);

        //通过调用方法返回给需要菜单栏的对象
		return menuBox;
	}

系统界面展示:

登陆界面:

在这里插入图片描述

主界面:

在这里插入图片描述

职员录入信息界面:

在这里插入图片描述

管理员录入信息界面:

在这里插入图片描述

查询和修改界面:

在这里插入图片描述

分布概况界面:

在这里插入图片描述

  • 46
    点赞
  • 191
    收藏
    觉得还不错? 一键收藏
  • 34
    评论
JavaFX实现界面切换,可以通过以下步骤实现: 1. 创建多个FXML文件,每个文件对应一个界面。例如,可以创建一个Login.fxml,一个Dashboard.fxml等等。 2. 在每个FXML文件中定义一个根节点,例如AnchorPane。 3. 在Controller类中,使用注解@FXML注入FXML文件中定义的控件。 4. 在主界面中定义一个容器,例如StackPane,用于存放所有的界面。 5. 在主界面的Controller类中,使用FXMLLoader加载所有的FXML文件,并将它们添加到容器中。例如,可以在initialize()方法中加载所有的FXML文件,并将它们添加到StackPane中。 6. 在Controller类中,使用FXMLLoader加载要切换到的界面,并将它添加到容器中。例如,可以在登录按钮的事件处理程序中加载Dashboard.fxml文件,并将它添加到StackPane中。 7. 使用容器的toFront()方法将要切换到的界面显示在最前面。 下面是一个简单的示例代码: Main.fxml文件: ``` <?xml version="1.0" encoding="UTF-8"?> <?import javafx.scene.layout.StackPane?> <StackPane fx:id="container" xmlns="http://javafx.com/javafx/8" xmlns:fx="http://javafx.com/fxml/1"> </StackPane> ``` MainController.java文件: ``` public class MainController { @FXML private StackPane container; @FXML private void initialize() throws IOException { // 加载Login.fxml FXMLLoader loginLoader = new FXMLLoader(getClass().getResource("Login.fxml")); AnchorPane loginPane = loginLoader.load(); // 将Login界面添加到容器中 container.getChildren().add(loginPane); } @FXML private void onLoginButtonClicked() throws IOException { // 加载Dashboard.fxml FXMLLoader dashboardLoader = new FXMLLoader(getClass().getResource("Dashboard.fxml")); AnchorPane dashboardPane = dashboardLoader.load(); // 将Dashboard界面添加到容器中 container.getChildren().add(dashboardPane); // 显示Dashboard界面 dashboardPane.toFront(); } } ``` Login.fxml文件: ``` <?xml version="1.0" encoding="UTF-8"?> <?import javafx.scene.layout.AnchorPane?> <?import javafx.scene.control.Button?> <AnchorPane xmlns="http://javafx.com/javafx/8" xmlns:fx="http://javafx.com/fxml/1" fx:controller="com.example.LoginController"> <Button text="Login" onAction="#onLoginButtonClicked" /> </AnchorPane> ``` LoginController.java文件: ``` public class LoginController { @FXML private void onLoginButtonClicked() throws IOException { // 切换到Dashboard界面 FXMLLoader loader = new FXMLLoader(getClass().getResource("Dashboard.fxml")); AnchorPane pane = loader.load(); container.getChildren().add(pane); pane.toFront(); } } ``` Dashboard.fxml文件: ``` <?xml version="1.0" encoding="UTF-8"?> <?import javafx.scene.layout.AnchorPane?> <?import javafx.scene.control.Label?> <AnchorPane xmlns="http://javafx.com/javafx/8" xmlns:fx="http://javafx.com/fxml/1" fx:controller="com.example.DashboardController"> <Label text="Dashboard" /> </AnchorPane> ``` DashboardController.java文件: ``` public class DashboardController { } ```

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 34
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值