一、想要实现的登录界面效果
1、添加三个标签(JLabel):用户名:、密码:、验证码:。
2、添加两个单行文本输入框(JTextField)和一个密码文本输入框(JPasswordField)
3、添加三个按钮:换一张、登录、重置
4、添加验证码:单独创建一个面板类
5、添加按钮监听器(这里不一一赘述)
三、验证码的面板类
1、实现背景图片
先实例化缓冲图片对象(BufferedImage),再获取其画布对象(gs),再在获取的画布对象(gs)上绘制背景图片(Image)。然后再在本面板的画布对象中,绘制缓冲图片对象。
public void paint(Graphics g) { BufferedImage image = new BufferedImage(WIDTH, HEIGHT, BufferedImage.TYPE_INT_RGB);// 实例化BufferedImage Graphics gs = image.getGraphics(); // 获取Graphics类的对象 Image img = null; try { img = ImageIO.read(new File("img/image1.jpg")); // 创建图像对象 } catch (IOException e) { e.printStackTrace(); } image.getGraphics().drawImage(img, 0, 0, WIDTH, HEIGHT, null);// 在缓冲图像对象上绘制图像 g.drawImage(image, 0, 0, null);// 在面板中画出验证码 }
2、实现随机干扰线
int startX1 = random.nextInt(20);// 随机获取第一条干扰线起点的x坐标 int startY1 = random.nextInt(20);// 随机获取第一条干扰线起点的y坐标 int startX2 = random.nextInt(30)+35;// 随机获取第一条干扰线终点的x坐标,也是第二条干扰线起点的x坐标 int startY2 = random.nextInt(10)+20;// 随机获取第一条干扰线终点的y坐标,也是第二条干扰线起点的y坐标 int startX3 = random.nextInt(30)+90;// 随机获取第二条干扰线终点的x坐标 int startY3 = random.nextInt(10)+5;// 随机获取第二条干扰线终点的y坐标 gs.setColor(Color.RED); gs.drawLine(startX1, startY1, startX2, startY2);// 绘制第一条干扰线 gs.setColor(Color.BLUE); gs.drawLine(startX2, startY2, startX3, startY3);// 绘制第二条干扰线
3、实现随机取得字母
首先实例化随机对象(Random),并可以通过整型到字符型的强制转换实现。
Random random = new Random();// 实例化Random char ctmp = (char) (random.nextInt(26) + 65); // 生成A~Z的字母
4、实现字母的随机颜色,旋转和缩放
这里需要用到AffineTransform类。
AffineTransform
类表示 2D 仿射变换,它执行从 2D 坐标到其他 2D 坐标的线性映射,保留了线的“直线性”和“平行性”。可以使用一系列平移 (translation)、缩放 (scale)、翻转 (flip)、旋转 (rotation) 和错切 (shear) 来构造仿射变换。
// 输出随机的验证文字 for (int i = 0; i < 4; i++) { char ctmp = (char) (random.nextInt(26) + 65); // 生成A~Z的字母 num += ctmp;// 更新验证码 Color color = new Color(20 + random.nextInt(120), 20 + random .nextInt(120), 20 + random.nextInt(120));// 生成随机颜色 gs.setColor(color); // 设置颜色 Graphics2D gs2d = (Graphics2D) gs;// 将文字旋转指定角度 AffineTransform trans = new AffineTransform();// 实例化AffineTransform trans.rotate(random.nextInt(45) * 3.14 / 180, 22 * i + 8, 7); float scaleSize = random.nextFloat() + 0.8f;// 缩放文字 if (scaleSize > 1f) scaleSize = 1f;// 如果scaleSize大于1,则等于1 trans.scale(scaleSize, scaleSize); // 进行缩放 gs2d.setTransform(trans);// 设置AffineTransform对象 gs.drawString(String.valueOf(ctmp), WIDTH / 6 * i + 28, HEIGHT / 2);// 画出验证码 }