Java Swing 之 WindowBuilder 插件的使用（带实现登录和跳转）
WindowBuilder插件最近在学GUI，无意间发现了eclipse中的一个插件WindowBuilder，简单记一下直接在eclipse商店中的安装。打开eclipse，在工具栏的帮助(help)选项中选择Eclipse MarketPlace，进入商店。2.在搜索栏输入插件名WindowBuilder，点击install下载安装(我肯定选下载最多的…)3.一路默认，完成后会跳到后台安装，在
·
最近接触到GUI图形界面设计，需要自学，无意间发现了eclipse中的一个插件WindowBuilder，使用起来方便而且效率很高，果断抛弃了自己敲代码的念头。下面简单记一下我在eclipse商店中的安装，然后是我目前学到的一些使用方法，很多都是按着我自己的想法说的，说的可能不专业有错误还请指正。
一、安装
- 打开eclipse，在工具栏的帮助(help)选项中选择Eclipse MarketPlace，进入商店。
2.在搜索栏输入插件名WindowBuilder，点击install下载安装(我肯定选下载最多的…)
3.一路默认，完成后会跳到后台安装，在进度中可以看到进度。大概需要十分钟装好，询问是否重启。
4.重启后顺便见到了久违的欢迎。
5.然后可以找到装好的WindowBuilder，依次选择文件-新建-其他。
6.可以看到新添加了一个WindowBuilder选项。
二、使用
1.创建过程
- 依次创建一个Java项目 WindowBuilderUse，包 view
- 选中 view 包，右键依次选择 新建 > 其他 > WindowBuilder > Swing Designer > JFrame,在弹出的框里填写类型名称 LoginView 。
- 创建成功后会自动生成一段代码，在左下角可以看到两个模式 Source 和 Design。Sourse为源代码，Design为界面设计。
有时候可能会遇到下面这种情况
我是遇到过这种情况，解决方法是在自动生成的 module-info.java 类中添加一行代码。
module WindowBuilderUse {
requires java.desktop;
}
2.常规选项认识
我是把它分了五个部分，具体的菜单栏我就暂时只写一些我目前用过的，后续会再添加或改正。
- Part 1 (构造) 对应着你设计的结构，当你点击的时候会互相响应。比如你在部分1点击（java.swing.JFrame）, 部分5的窗体就会凸显，反之亦然.
- Part2 (属性) 对应着你选中的某一结构的具体细节
比如当我们选中窗体
最常用到的是
background 设置窗体的背景颜色
defaultCloseOperaion 设置用户在此窗体上发起 “close” 时默认执行的操作
iconImage 设置窗体的图标
resizable 设置大小可调
title 设置窗体的标题
当我们选中内容面板
Layout 设置布局，默认是 BorderLayout 布局，但是在这里我用的最多的是 GroupLayout 布局。
- Part3
我就用到了下面带三角的这一个，点击后可以快速测试，看看做的怎么样不需要你运行代码。
- Part4(组件)里面都是可以根据你的需要塞进去的组件。我用的最多的是Components和Menu
JLabel 标签
JTextField 文本框
JComboBox 下拉列表
JButton 按钮
JRadioButton 单选按钮
JTextArea 文本区域
JPasswordField 密码框
JList 列表
JTable 表格
JMenu 菜单
JMenuBar 菜单条
JMenuItem 菜单项
- Part5 就是你手动设计的图形界面
你可以直接点中你要添加的组件，再换到界面上直接塞进去（在此之前先选择好你希望的面板的布局），下面就紧接着写几个组件的属性，基本上大同小异，捡几个常用的。
这是标签LTabel的属性
font可以设置文字字体，字形，字号
icon同样也是图标
text是显示在外面的文本，类似于窗体的标题
这是下拉列表的属性，主要是 model 属性，点击后弹出来一个框，如下图输入，可以添加多个选项，用回车隔开就可以，点击确认后关闭，可以点击上面讲的快速测试按钮看看效果如何。
关于菜单栏的设置
（1）首先是选中窗体，在窗体上添加菜单条 JMenuBar，当你的鼠标移动到窗体里面，就会自动提示你应该放在绿色区域的位置。
放好后显示下图
（2）然后添加菜单JMenu，同样的当你鼠标移动到窗体内会有一条红线自动提示你放在哪里，如下图：
放好后如下图所示：
你可以继续横向或竖向添加菜单JMenu,你也可以选择菜单项JMenuItem，两者区别在于JMenu可再分，而JMenuItem不可再分。观察下图可以很明显的看出来 “文件” “新建”“保存”都是可再分的JMenu，“word文档”“excel表格”则是不可再分的最后一级JMenuItem。
3.规范
每个组件都有一个名字，要习惯规范的命名，最起码自己看的懂，一看名字知道是哪个组件，特别是塞了很多个同样的组件，比如添加了很多个标签，你可以在右边的图形上直接选中后右键 （或者在Part1构造部分选中后再右键），选择Rename重命名，最简单的你可以把账号标签由默认的 lblNewabel 重命名为 zhanghaolblNewLabel ，密码标签由默认的 lblNewabel_1 重命名为 mimalblNewLabel_1。
可以看到结果如下图：
4.图标1
图标是我觉得必不可少的部分，因为好看…特别是至少可以替代咖啡
图标的存放位置最好是塞到项目里作为相对路径，我理解的是使用绝对路径的话当你换了地方就没办法调用了，比如没办法在另一台电脑上调用你这台电脑的图片，相对路径就可以一直跟着你。
我们可以在这个项目下新建一个文件夹，命名为images,把我们用到的图标放进去。
可以自行在网上下载需要的图标，直接复制粘贴到上文中新建的文件夹里即可。
添加也很简单，先选中一个需要的
比如说窗体，我们选中属性 iconImage ,勾选第一个 Classpath resource ,依次选择你需要的图标然后选择确定。同样的可以给所有可以添加图标的组件添加图标（其他就可能是 icon 属性）。
可能会遇到大小不合适的情况，我开始的时候总是很大，后来调整了大小都是 16 x 16，我在下面推荐了一个图标库很好用，可以直接下载需要的大小。
三、登陆及跳转
1.数据库
我目前用的都是SQL Server ，建个表存点数据都大差不差。
关于 eclipse和SQL Server 的连接请戳这里
1.创建一个数据库，然后新建一张用户表，存入你的账号密码，简单就好。记住你的数据库名和用户表名，我这里分别是 TEXT 和 hl_admin 。
2.eclipse
1.新建一个 dao 包，再建一个 Database 类，专门来装数据库方面的操作。
/**
* 数据库连接类
* @author zhangsan
*
*/
public class Database {
String driverName="com.microsoft.sqlserver.jdbc.SQLServerDriver";
//首先要在数据库中新建一个叫 TEXT 的数据库
String conStr = "jdbc:sqlserver://127.0.0.1:1433;DatabaseName=TEXT";
// 数据库连接用户名
String dbUserName = "sa";
// 数据库连接密码
String dbPassword = "991230";
private static Connection con = null;
public Database() {
try {
Class.forName(driverName);
System.out.println("[加载驱动成功]");
}
catch (Exception sqlEx) {
sqlEx.printStackTrace();
System.out.println("[加载驱动失败]");
}
try{
con=DriverManager.getConnection(conStr,dbUserName,dbPassword);
System.out.println("SQL Server连接成功！");
}
catch(Exception ex){
ex.printStackTrace();
System.out.print("SQL Server连接失败！");
}
}
public static Connection getCon() {
return con;
}
/**
* 关闭数据库连接
* @throws SQLException
*
*/
public void closeCon(Connection con) throws SQLException{
if(con!= null) {
con.close();
}
}
/**
* 管理员登录
*
* @param username
* @param password
* @return
*/
public static boolean adminLogin(String username, String password) {
String sql = "select Username from hl_admin where Username=? and Password=?";
boolean flag = false;
try {
PreparedStatement ps = con.prepareStatement(sql);
ps.setString(1, username);
ps.setString(2, password);
ResultSet rs = ps.executeQuery();
if (rs.next()) {
flag = true;
}
rs.close();
ps.close();
} catch (SQLException e) {
e.printStackTrace();
}
return flag;
}
}
2.在LoginView类添加一个登录按钮
-
右键选择 Add event handler > action > actionPerformed 会自动跳到代码区
-
创建一个方法 LoginAvt ，实现登录功能
btnNewButton.addActionListener(new ActionListener() {
public void actionPerformed(ActionEvent ae) {
LoginAvt(ae);
}
});
-
直接在提示里选择 在类型LoginView中创建方法...
-
在下面找到生成的代码，敲进去
protected void LoginAvt(ActionEvent ae) {
// TODO 自动生成的方法存根
String username = zhanghaotextField.getText().toString();
String password = mimapasswordField.getText().toString();
//判断字符串是否为空，这里是如果不为空，继续。
if(!zhanghaotextField.getText().isEmpty() && !mimapasswordField.getText().isEmpty())
{
//当点击登录按钮时，首先与数据库建立连接
Database.getCon();
boolean result = Database.adminLogin(zhanghaotextField.getText().trim(), mimapasswordField.getText().trim());
if(result){
//登录成功
new MainMenu().setVisible(true); //打开新界面MainMenu
this.setVisible(false);//关闭本界面
}else{
//登录失败
JOptionPane.showMessageDialog(null, "登录名或密码错误，请重新登录!", "提示", JOptionPane.ERROR_MESSAGE);
}
}else if(zhanghaotextField.getText().isEmpty())
{
JOptionPane.showMessageDialog(null,"请输入用户名","提示消息",JOptionPane.WARNING_MESSAGE);
}else if(mimapasswordField.getText().isEmpty())
{
JOptionPane.showMessageDialog(null,"请输入密码","提示消息",JOptionPane.WARNING_MESSAGE);
}
}
事件处理机制摘要：
监听器对象是一个实现了特定监听器接口（listener interface）的类的实例。
事件源是一个能够注册监听器对象并发送事件对象的对象。
当事件发生时，事件源将事件对象传递给所有注册的监听器。
监听器对象将利用事件对象中的信息决定如何对事件做出回应。
现在，只要按钮产生了一个“动作事件”，listener 对象就会得到通告。对于按钮来说，这个“动作事件”就是我们点击按钮。
为了实现 ActionListener 接口，监听器类必须有一个被称为 actionPerformed 的方法，该方法接受一个 ActionEvent 对象参数。
只要用户点击按钮，JButton 对象就会创建一个ActionEvent 对象，然后调用listener.action Performed(event) 传递事件对象。可以将多个监听器对象添加到一个像按钮这样的事件源中。这样一来，只要用户点击按钮，按钮就会调用所有监听器的 actionPerformed 方法。
3.在 view 包里再以同样的方法做一个主界面 MainMenu类 作为登陆后的跳转界面
4.运行代码，弹出登陆界面，正确输入账号密码，弹出主界面。
四、源代码
/**
* 登陆界面
* @author zhangsan
*
*/
public class LoginView extends JFrame {
private JPanel contentPane;
private JTextField zhanghaotextField;
private JPasswordField mimapasswordField;
/**
* Launch the application.
*/
public static void main(String[] args) {
EventQueue.invokeLater(new Runnable() {
public void run() {
try {
new LoginView().setVisible(true);
} catch (Exception e) {
e.printStackTrace();
}
}
});
}
/**
* Create the frame.
*/
public LoginView() {
setIconImage(Toolkit.getDefaultToolkit().getImage(LoginView.class.getResource("/images/\u7BA1\u7406.png")));
setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
setBounds(100, 100, 292, 241);
//居中显示
this.setLocationRelativeTo(null);
init();
//初始化数据库
new Database();
//判断数据库是否连接成功
if(Database.getCon() == null){
JOptionPane.showMessageDialog(null, "数据库连接失败!", "提示", JOptionPane.ERROR_MESSAGE);
System.exit(0);
}
}
private void init() {
JMenuBar menuBar = new JMenuBar();
setJMenuBar(menuBar);
JMenu mnNewMenu = new JMenu("\u6587\u4EF6");
menuBar.add(mnNewMenu);
JMenu mnNewMenu_2 = new JMenu("\u65B0\u5EFA");
mnNewMenu.add(mnNewMenu_2);
JMenuItem mntmNewMenuItem_1 = new JMenuItem("word\u6587\u6863");
mnNewMenu_2.add(mntmNewMenuItem_1);
JMenuItem mntmNewMenuItem_2 = new JMenuItem("excel\u8868\u683C");
mnNewMenu_2.add(mntmNewMenuItem_2);
JMenu mnNewMenu_3 = new JMenu("\u4FDD\u5B58");
mnNewMenu.add(mnNewMenu_3);
JMenuItem mntmNewMenuItem = new JMenuItem("\u4FDD\u5B58\u540E\u9000\u51FA");
mnNewMenu_3.add(mntmNewMenuItem);
JMenu mnNewMenu_1 = new JMenu("\u7F16\u8F91");
menuBar.add(mnNewMenu_1);
JMenuItem mntmNewMenuItem_3 = new JMenuItem("\u7C98\u8D34");
mnNewMenu_1.add(mntmNewMenuItem_3);
contentPane = new JPanel();
contentPane.setBorder(new EmptyBorder(5, 5, 5, 5));
setContentPane(contentPane);
zhanghaotextField = new JTextField();
zhanghaotextField.setColumns(10);
JLabel zhanghaolblNewLabel = new JLabel("\u8D26\u53F7:");
zhanghaolblNewLabel.setIcon(new ImageIcon(LoginView.class.getResource("/images/\u8D26\u53F7.png")));
zhanghaolblNewLabel.setFont(new Font("宋体", Font.BOLD, 14));
JLabel mimalblNewLabel_1 = new JLabel("\u5BC6\u7801:");
mimalblNewLabel_1.setIcon(new ImageIcon(LoginView.class.getResource("/images/\u5BC6\u7801.png")));
mimalblNewLabel_1.setFont(new Font("宋体", Font.BOLD, 14));
JButton btnNewButton = new JButton("\u767B\u5F55");
btnNewButton.addActionListener(new ActionListener() {
public void actionPerformed(ActionEvent ae) {
LoginAvt(ae);
}
});
btnNewButton.setIcon(new ImageIcon(LoginView.class.getResource("/images/\u767B\u5F55.png")));
mimapasswordField = new JPasswordField();
GroupLayout gl_contentPane = new GroupLayout(contentPane);
gl_contentPane.setHorizontalGroup(
gl_contentPane.createParallelGroup(Alignment.LEADING)
.addGroup(gl_contentPane.createSequentialGroup()
.addGroup(gl_contentPane.createParallelGroup(Alignment.LEADING)
.addGroup(gl_contentPane.createSequentialGroup()
.addGap(28)
.addGroup(gl_contentPane.createParallelGroup(Alignment.LEADING)
.addComponent(zhanghaolblNewLabel, GroupLayout.PREFERRED_SIZE, 58, GroupLayout.PREFERRED_SIZE)
.addComponent(mimalblNewLabel_1, GroupLayout.PREFERRED_SIZE, 58, GroupLayout.PREFERRED_SIZE))
.addPreferredGap(ComponentPlacement.UNRELATED)
.addGroup(gl_contentPane.createParallelGroup(Alignment.LEADING, false)
.addComponent(zhanghaotextField)
.addComponent(mimapasswordField, GroupLayout.DEFAULT_SIZE, 103, Short.MAX_VALUE)))
.addGroup(gl_contentPane.createSequentialGroup()
.addGap(64)
.addComponent(btnNewButton, GroupLayout.PREFERRED_SIZE, 97, GroupLayout.PREFERRED_SIZE)))
.addContainerGap(69, Short.MAX_VALUE))
);
gl_contentPane.setVerticalGroup(
gl_contentPane.createParallelGroup(Alignment.LEADING)
.addGroup(gl_contentPane.createSequentialGroup()
.addGap(28)
.addGroup(gl_contentPane.createParallelGroup(Alignment.TRAILING)
.addComponent(zhanghaolblNewLabel)
.addComponent(zhanghaotextField, GroupLayout.PREFERRED_SIZE, GroupLayout.DEFAULT_SIZE, GroupLayout.PREFERRED_SIZE))
.addGap(18)
.addGroup(gl_contentPane.createParallelGroup(Alignment.BASELINE)
.addComponent(mimalblNewLabel_1)
.addComponent(mimapasswordField, GroupLayout.PREFERRED_SIZE, 20, GroupLayout.PREFERRED_SIZE))
.addGap(28)
.addComponent(btnNewButton)
.addContainerGap(31, Short.MAX_VALUE))
);
contentPane.setLayout(gl_contentPane);
}
protected void LoginAvt(ActionEvent ae) {
// TODO 自动生成的方法存根
String username = zhanghaotextField.getText().toString();
String password = mimapasswordField.getText().toString();
//判断字符串是否为空，这里是如果不为空，继续。
if(!zhanghaotextField.getText().isEmpty() && !mimapasswordField.getText().isEmpty())
{
//当点击登录按钮时，首先与数据库建立连接
Database.getCon();
boolean result = Database.adminLogin(zhanghaotextField.getText().trim(), mimapasswordField.getText().trim());
if(result){
//登录成功
new MainMenu().setVisible(true); //打开新界面MainMenu
this.setVisible(false);//关闭本界面
}else{
//登录失败
JOptionPane.showMessageDialog(null, "登录名或密码错误，请重新登录!", "提示", JOptionPane.ERROR_MESSAGE);
}
}else if(zhanghaotextField.getText().isEmpty())
{
JOptionPane.showMessageDialog(null,"请输入用户名","提示消息",JOptionPane.WARNING_MESSAGE);
}else if(mimapasswordField.getText().isEmpty())
{
JOptionPane.showMessageDialog(null,"请输入密码","提示消息",JOptionPane.WARNING_MESSAGE);
}
}
}
/**
* 主界面
* @author zhangsan
*
*/
public class MainMenu extends JFrame {
private JPanel contentPane;
/**
* Launch the application.
*/
public static void main(String[] args) {
EventQueue.invokeLater(new Runnable() {
public void run() {
try {
MainMenu frame = new MainMenu();
frame.setVisible(true);
} catch (Exception e) {
e.printStackTrace();
}
}
});
}
/**
* Create the frame.
*/
public MainMenu() {
setIconImage(Toolkit.getDefaultToolkit().getImage(MainMenu.class.getResource("/images/\u4FE1\u7528\u4FE1\u606F\u7BA1\u7406\u3001\u4FE1\u606F\u7BA1\u7406\u7C7B.png")));
setTitle("\u4E3B\u754C\u9762");
setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
setBounds(100, 100, 300, 246);
this.setLocationRelativeTo(null);
contentPane = new JPanel();
contentPane.setBorder(new EmptyBorder(5, 5, 5, 5));
setContentPane(contentPane);
JLabel lblNewLabel = new JLabel("\u4F60\u597D\u5440\uFF01");
lblNewLabel.setFont(new Font("宋体", Font.BOLD, 26));
lblNewLabel.setIcon(new ImageIcon(MainMenu.class.getResource("/images/\u5F00\u5FC3.png")));
GroupLayout gl_contentPane = new GroupLayout(contentPane);
gl_contentPane.setHorizontalGroup(
gl_contentPane.createParallelGroup(Alignment.LEADING)
.addGroup(gl_contentPane.createSequentialGroup()
.addGap(76)
.addComponent(lblNewLabel, GroupLayout.PREFERRED_SIZE, 140, GroupLayout.PREFERRED_SIZE)
.addContainerGap(210, Short.MAX_VALUE))
);
gl_contentPane.setVerticalGroup(
gl_contentPane.createParallelGroup(Alignment.LEADING)
.addGroup(gl_contentPane.createSequentialGroup()
.addGap(57)
.addComponent(lblNewLabel, GroupLayout.PREFERRED_SIZE, 40, GroupLayout.PREFERRED_SIZE)
.addContainerGap(156, Short.MAX_VALUE))
);
contentPane.setLayout(gl_contentPane);
}
}
/**
* 数据库连接类
* @author zhangsan
*
*/
public class Database {
String driverName="com.microsoft.sqlserver.jdbc.SQLServerDriver";
//首先要在数据库中新建一个叫 TEXT 的数据库
String conStr = "jdbc:sqlserver://127.0.0.1:1433;DatabaseName=TEXT";
// 数据库连接用户名
String dbUserName = "sa";
// 数据库连接密码
String dbPassword = "991230";
private static Connection con = null;
public Database() {
try {
Class.forName(driverName);
System.out.println("[加载驱动成功]");
}
catch (Exception sqlEx) {
sqlEx.printStackTrace();
System.out.println("[加载驱动失败]");
}
try{
con=DriverManager.getConnection(conStr,dbUserName,dbPassword);
System.out.println("SQL Server连接成功！");
}
catch(Exception ex){
ex.printStackTrace();
System.out.print("SQL Server连接失败！");
}
}
public static Connection getCon() {
return con;
}
/**
* 关闭数据库连接
* @throws SQLException
*
*/
public void closeCon(Connection con) throws SQLException{
if(con!= null) {
con.close();
}
}
/**
* @param username
* @param password
* @return
*/
public static boolean adminLogin(String username, String password) {
String sql = "select Username from hl_admin where Username=? and Password=?";
boolean flag = false;
try {
PreparedStatement ps = con.prepareStatement(sql);
ps.setString(1, username);
ps.setString(2, password);
ResultSet rs = ps.executeQuery();
if (rs.next()) {
flag = true;
}
rs.close();
ps.close();
} catch (SQLException e) {
e.printStackTrace();
}
return flag;
}
}
以上就是我目前的一些收获，文字看起来可能难理解，最好是去搜一些网课，看一些动态的视频会更容易上手。代码可能和按照步骤得来的有点出入，是有改动，已经给出了注释，比如让界面居中显示，手动在代码区加了一句 this.setLocationRelativeTo(null);
新手上路，很期待各路大佬对我的指正。
为开发者提供学习成长、分享交流、生态实践、资源工具等服务，帮助开发者快速成长。
更多推荐
149
1- 0
已为社区贡献1条内容
所有评论(0)