首先要清楚一个界面由哪些部分组成:
1、可视化部分: 窗体、标签、菜单、选项卡、按钮......
2、元素规则部分: 颜色、尺寸、字体、布局
3、内容部分: 文字、图片
其次是所需代码库(java类库): java.awt(元素规则类比较多)
javax.swing(可视化组件较多)
所需要使用的类有以下几种( 使用这些类时需要在class前导入):
javax.siwng.JFrame; //窗体类
javax.swing.JButton; //按钮类
javax.swing.JLabel; //标签类
javax.swing.JTextField; //文本框类
javax.swing.JPasswordField; //密码框类
javax.swing.ImageIcon; //图标类
java.awt.Dimension; //尺寸类
java.awt.FlowLayout; //流式布局类
开发步骤:定义类,创建对象,调用方法
1:创建一个类UserUI
2:在类中创建一个方法initUI()
2.1: 创建一个窗体对象 JFrame jf=new JFrame("用户入口界面");
2.2: 设置窗体相关属性:
2.2.1: 设置窗体大小: jf.setSize(400, 400);
2.2.2: 设置窗体位置: jf.setLocation(300, 200);
2.2.3: 设置窗体关闭方式: jf.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
2.2.4: 设置窗体不可改变大小: jf.setResizable(false);
2.2.5: 设置窗体内的布局方式为流式布局: jf.setLayout(new FlowLayout());
2.2.6: 设置窗体可视化: jf.setVisible(true);
2.3: 创建组件对象:图标、图标标签、账号标签、账号输入框、密码标签、密码文本输入框、登录按钮、注册按钮
2.3.1: 创建图标对象: ImageIcon icon=new ImageIcon("src/login/111.png");
2.3.2: 创建图标标签对象: JLabel iconLabel=new JLabel(icon);
2.3.3: 创建账号标签对象: JLabel accountLabel=new JLabel("账号:");
2.3.4: 创建账号输入框对象: JTextField accountField=new JTextField(33);
2.3.5: 创建密码标签对象: JLabel passwordLabel=new JLabel("密码:");
2.3.6: 创建密码输入框对象: JPasswordField passwordField=new JPasswordField(33);
2.3.7: 创建登录按钮对象: JButton loginButton=new JButton("登录");
2.3.8: 创建注册按钮对象: JButton registerButton=new JButton("注册");
2.4: 组件创建完成后,通过 jf.add (); 语句添加组件
jf.add (imgjla);
jf.add (accountjla);
jf.add (accountjtf);
jf.add (passwordjla);
jf.add (passwordjpf);
jf.add (loginjbt);
jf.add (registjbt);
3: 在类中创建一个主函数,创建UserUI对象,调用initUI()方法
代码实现如下:
package login; import java.awt.*; import javax.swing.*; public class UserUI { public void initUI(){ System.out.println ("UserUI"); //界面 JFrame jf = new JFrame ("用户界面"); jf.setSize (400, 400);//窗体大小 jf.setDefaultCloseOperation (JFrame.EXIT_ON_CLOSE);//窗体关闭方式 jf.setLocationRelativeTo (null);// 居中 jf.setLayout (new FlowLayout ()); // 创建组件对象 //在界面中显示一张图片: ImageIcon imgIcon = new ImageIcon ("src/login/111.png");//图标对象 JLabel imgjla = new JLabel (imgIcon);//把图片显示在一个标签里面 JLabel accountjla = new JLabel ("账号: "); JTextField accountjtf = new JTextField (33);// 33个字符宽度 JLabel passwordjla = new JLabel ("密码: "); JPasswordField passwordjpf = new JPasswordField (33);// 33个字符宽度 JButton loginjbt = new JButton ("登录"); JButton registjbt = new JButton ("注册"); // 添加组件 按顺序添加 jf.add (imgjla); jf.add (accountjla); jf.add (accountjtf); jf.add (passwordjla); jf.add (passwordjpf); jf.add (loginjbt); jf.add (registjbt); jf.setVisible (true); // 创建监听器对象 并添加给登录注册按钮 UIListener uiListener = new UIListener (); loginjbt.addActionListener (uiListener); registjbt.addActionListener (uiListener); // 将界面上的输入框对象变量名 中存储的输入框对象地址 复制一份给监听器对象中输入框对象变量名 uiListener.accountjtf = accountjtf; uiListener.passwordjpf = passwordjpf; } public static void main(String[] args){ new UserUI ().initUI (); } }
运行后显示界面如下所示:
通过调整一些大小参数,一个简单的窗体就这样建立起来了,之后还需要学习更多组件和布局的方法来完善这个界面。通过学习去搭建这个窗体,我接触到了java内丰富的包,并学会去使用它们,也看到了java强大的应用功能。
只有界面是仅仅不能实现创建和登录功能的,在界面中我们添加有一个登录按钮和一个注册按钮,此时这两个按钮无论你千点万击都是没反应的。要想按钮响应点击,就要加入动作监听器!使它能够实现当用户输入正确的账号和密码之后顺利登陆,并弹出登陆界面。
添加按钮点击事件步骤:动作监听器: ActionListener 接口
这个监听器中有一个半成品方法(没有方法内容),被监听按钮被点击时调用,需要我们自己实现这个方法
1:创建一个类UIListener实现(imp
ements) ActionListener,类似于继承
2:在类中复制ActionListener 中的actionPerformed方法过来,改分号为大括号
3:在方法中添加按钮点击之后要执行的代码
4:创建一个UIListener对象添加给所需要被监听的按钮 addActionListener(UIListener对象)
在UserUI类中,还需要将界面上的输入框对象变量名 中存储的输入框对象地址 复制一份给监听器对象中输入框对象变量名。因为监听器和界面在两个类中,我要为界面中的按钮添加动作监听器,就必然需要在监听器里通过界面的对象来调用方法获取密码框的值,那么我们需要把对象从界面这个类传递到监听器中,在监听器中获取数据来进去判断,再得到相应的输出。
// 创建监听器对象 并添加给登录注册按钮
UIListener uiListener = new UIListener ();
loginjbt.addActionListener (uiListener);
registjbt.addActionListener (uiListener);
// 将界面上的输入框对象变量名 中存储的输入框对象地址 复制一份给监听器对象中输入框对象变量名
uiListener.accountjtf = accountjtf;
uiListener.passwordjpf = passwordjpf;
package login; import javax.swing.*; import java.awt.event.ActionEvent; import java.awt.event.ActionListener; public class UIListener implements ActionListener{ JTextField accountjtf; JPasswordField passwordjpf; // 创建一个用户数组 User[] userList = new User[10]; int index = 0; // 重写点击按钮会调用的方法 // ActionEvent 动作事件 用来获取当前被点击的按钮的信息 @Override public void actionPerformed(ActionEvent e){ // 获取 按钮上的文本 用来判断是哪个按钮被点击了 String ac = e.getActionCommand (); // 获取输入框中的账号密码 进行验证 登录 注册 String account = accountjtf.getText (); String password = passwordjpf.getText (); System.out.println ("账号: " + account + " 密码: " + password); if(account.equals ("") || password.equals ("")){ JOptionPane.showMessageDialog (null, "账号或密码不能为空"); return; } if(ac.equals ("登录")){ System.out.println ("登录按钮被点击了"); // 验证这个账号是否已经被注册过 for(int i = 0; i < index; i++){ User user = userList[i]; if(user.account.equals (account)){ boolean isLogin = user.login (password); if(isLogin){ // 弹窗 JOptionPane.showMessageDialog (null, "登录成功"); // 小窗 信息显示 // 创建一个小窗对象 JFrame jf = new JFrame ("欢迎登录"); jf.setSize (400, 400); JLabel info = new JLabel (); info.setText ("欢迎您: " + user.showInfo ()); jf.add (info); jf.setVisible (true); } else{ // 弹窗 JOptionPane.showMessageDialog (null, "登录错误"); } return; } } JOptionPane.showMessageDialog (null, "账号不存在,请先注册~"); } else if(ac.equals ("注册")){ System.out.println ("注册按钮被点击了"); // 验证这个账号是否已经被注册过 for(int i = 0; i < index; i++){ User user = userList[i]; if(user.account.equals (account)){ // 弹窗 JOptionPane.showMessageDialog (null, "账号已经被注册过了"); return; } } // 循环结束后 都没有弹窗 就表示这个账号没有被注册过 User user = new User (); user.account = account; user.password = password; // 将存储了数据的用户对象 存储到数组中 userList[index] = user; index++; // 弹窗 JOptionPane.showMessageDialog (null, "注册成功,请登录~"); } } }
在上述代码中,通过ActionEvent 动作事件来获取当前被点击的按钮的信息,点击登录按钮后,控制台输出“登录按钮被点击了”,同样点击注册按钮后,控制台输出“注册按钮被点击了”。添加空值条件设置一个弹窗,即当账号或密码输入框为空时,弹框显示“账号或密码不能为空”。
if(account.equals ("") || password.equals ("")){
JOptionPane.showMessageDialog (null, "账号或密码不能为空");
return;
}
创建一个数组存放注册信息,以便在注册时验证这个账号是否已经被注册过。如果注册过则直接登录,没有注册过,则弹窗显示“账号不存在,请先注册~”。如果账号注册过,则显示“账号已经被注册过了”。
for(int i = 0; i < index; i++){
User user = userList[i];
if(user.account.equals (account)){
boolean isLogin = user.login (password);
}
}
JOptionPane.showMessageDialog (null, "账号不存在,请先注册~");
} else if(ac.equals ("注册")){
System.out.println ("注册按钮被点击了");
// 验证这个账号是否已经被注册过
for(int i = 0; i < index; i++){
User user = userList[i];
if(user.account.equals (account)){
// 弹窗
JOptionPane.showMessageDialog (null, "账号已经被注册过了");
return;
}
}
利用条件语句,添加登录返回条件,点击登录按钮后,弹窗显示“登陆成功”,设置一个登录成功以后弹出的界面,界面内容显示用户信息,否则显示“登录错误”。当按下按钮时,让监听器来判断账号密码是不是匹配,如果匹配,则跳出登陆成功界面。
if(user.account.equals (account)){
boolean isLogin = user.login (password);
if(isLogin){
// 弹窗
JOptionPane.showMessageDialog (null, "登录成功");
// 小窗 信息显示
// 创建一个小窗对象
JFrame jf = new JFrame ("欢迎登录");
jf.setSize (400, 400);
JLabel info = new JLabel ();
info.setText ("欢迎您: " + user.showInfo ());
jf.add (info);
jf.setVisible (true);
} else{
// 弹窗
JOptionPane.showMessageDialog (null, "登录错误");
}
return;
}
创建User类返回登录后,弹出界面的信息内容。用字符连接方式显示用户信息,并设置在线状态的改变。
package login; import javax.swing.*; public class User { String account; String password; int score; boolean isOnline; public String showInfo(){ String info = "账号: " + account + " 密码: " + password + " 积分: " + score + "是否在线: " + isOnline; return info; } public boolean checkPwd(String pwdIn){ if(pwdIn.equals (password)){ return true; } else{ return false; } } public boolean login(String pwdIn){ if(checkPwd (pwdIn)){ if(isOnline){ JOptionPane.showMessageDialog (null, "账号已经在线了"); return false; } isOnline = true; score += 5; return true; } else{ return false; } } }