黑马程序员技术交流社区

标题: 【自定义GUI组件】java gui编程，打造自己的多元化组件 [打印本页]

---

作者: 徘徊消逝中    时间: 2014-4-19 19:50
标题: 【自定义GUI组件】java gui编程，打造自己的多元化组件


项目背景：目前正在学习java se，同时在做毕业设计——单片机光立方的上位机部分，上位机实现两个功能，1、图形化界面实现算法：LED点阵各种自定义图形对应的IO口的数据。2、串口通信。本身这类工具，大多数是在vc下开发的，也具有很多MFC的实例，但是我觉得练手一下java。
发现问题：我决定采取16个JButton，作为4*4的一层光立方的LED点阵。但是问题是，java中提供的JButton组件是方形的，且颜色固定。
解决方案：通过网络学习，最终解决了问题。方案如下： 采用重写JButton继承的paintComponent方法和paintBorder方法以及contains方法

1、paintComponent方法：重画button的背景和标签

1. protected void paintComponent(Graphics g) {
   
2.                 if (getModel().isArmed()) {
   
3.                         // getModel方法返回鼠标的模型ButtonModel
   
4.                         // 如果鼠标按下按钮，则buttonModel的armed属性为真
   
5.                         g.setColor(Color.LIGHT_GRAY);
   
6.                 } else {
   
7.                         // 其他事件用默认的背景色显示按钮
   
8.                         g.setColor(getBackground());
   
9.                 }
   
10.                 // fillOval方法画一个矩形的内切椭圆,并且填充这个椭圆
    
11.                 // 当矩形为正方形时,画出的椭圆便是圆
    
12.                 g.fillOval(0, 0, getSize().width - 1, getSize().height - 1);
    
13. 
    
14.                 // 调用父类的paintComponent画按钮的标签和焦点所在的小矩形
    
15.                 super.paintComponents(g);
    
16.         }

复制代码

2、paintBorder方法，画button边界

1. // 用简单的弧充当按钮的边界
   
2.         protected void paintBorder(Graphics g) {
   
3.                 g.setColor(getForeground());
   
4.                 // drawOval方法画矩形的内切椭圆,但不填充,只画出一个边界
   
5.                 g.drawOval(0, 0, getSize().width - 1, getSize().height - 1);
   
6.         }

复制代码

3、contains方法：button的检测(因为图形变了，检测按钮也要重写)，判断鼠标是否在button上

1.         public boolean contains(int x, int y) {
   
2.                 // 如果按钮边框,位置发生改变,则产生一个新的形状对象
   
3.                 if ((shape == null) || (!shape.getBounds().equals(getBounds()))) {
   
4.                         // 构造椭圆型对象
   
5.                         shape = new Ellipse2D.Float(0, 0, getWidth(), getHeight());
   
6.                 }
   
7.                 // 判断鼠标的x,y坐标是否落在按钮形状内
   
8.                 return shape.contains(x, y);
   
9.         }

复制代码

4、完整代码

1. package testButton;
   
2. 
   
3. import java.awt.Color;
   
4. import java.awt.Dimension;
   
5. import java.awt.FlowLayout;
   
6. import java.awt.Graphics;
   
7. import java.awt.Shape;
   
8. import java.awt.event.ActionEvent;
   
9. import java.awt.event.ActionListener;
   
10. import java.awt.geom.Ellipse2D;//注意此包加载
    
11. 
    
12. import javax.swing.JButton;
    
13. import javax.swing.JFrame;
    
14. 
    
15. /**
    
16. * 制作一个圆形按钮时，需要做两件事： 第一件事是重载一个适合的绘图方法以画出一个图形 第二件事是设置一些事件使得只有当单击图形按钮的范围中的时候才会做出响应
    
17. */
    
18. 
    
19. @SuppressWarnings("serial")
    
20. public class CircleButtonOrig extends JButton {
    
21. 
    
22.         public CircleButtonOrig(String label) {
    
23.                 super(label);
    
24.                 Dimension size = getPreferredSize();// 获取按钮的最佳大小
    
25. 
    
26.                 // 调整按钮的大小,使之变成一个方形
    
27.                 size.width = size.height = Math.max(size.width, size.height);
    
28.                 setPreferredSize(size);
    
29.                 // 使jbutton不画背景,即不显示方形背景,而允许我们画一个圆的背景
    
30.                 setContentAreaFilled(false);
    
31.         }
    
32. 
    
33.         // 画图的按钮的背景和标签
    
34.         protected void paintComponent(Graphics g) {
    
35.                 if (getModel().isArmed()) {
    
36.                         // getModel方法返回鼠标的模型ButtonModel
    
37.                         // 如果鼠标按下按钮，则buttonModel的armed属性为真
    
38.                         g.setColor(Color.LIGHT_GRAY);
    
39.                 } else {
    
40.                         // 其他事件用默认的背景色显示按钮
    
41.                         g.setColor(getBackground());
    
42.                 }
    
43.                 // fillOval方法画一个矩形的内切椭圆,并且填充这个椭圆
    
44.                 // 当矩形为正方形时,画出的椭圆便是圆
    
45.                 g.fillOval(0, 0, getSize().width - 1, getSize().height - 1);
    
46. 
    
47.                 // 调用父类的paintComponent画按钮的标签和焦点所在的小矩形
    
48.                 super.paintComponents(g);
    
49.         }
    
50. 
    
51.         // 用简单的弧充当按钮的边界
    
52.         protected void paintBorder(Graphics g) {
    
53.                 g.setColor(getForeground());
    
54.                 // drawOval方法画矩形的内切椭圆,但不填充,只画出一个边界
    
55.                 g.drawOval(0, 0, getSize().width - 1, getSize().height - 1);
    
56.         }
    
57. 
    
58.         Shape shape;// 用于保存按钮的形状,有助于侦听单击按钮事件
    
59. 
    
60.         // 判断鼠标是否点在按钮上
    
61. 
    
62.         public boolean contains(int x, int y) {
    
63.                 // 如果按钮边框,位置发生改变,则产生一个新的形状对象
    
64.                 if ((shape == null) || (!shape.getBounds().equals(getBounds()))) {
    
65.                         // 构造椭圆型对象
    
66.                         shape = new Ellipse2D.Float(0, 0, getWidth(), getHeight());
    
67.                 }
    
68.                 // 判断鼠标的x,y坐标是否落在按钮形状内
    
69.                 return shape.contains(x, y);
    
70.         }
    
71. 
    
72.         public static void main(String[] args) {
    
73.                 final JButton button = new CircleButtonOrig("Click me");// 产生一个圆形按钮
    
74.                 button.setBackground(Color.green);// 设置背景色为绿色
    
75.                 // 产生一个框架显示这个按钮
    
76.                 JFrame frame = new JFrame("图形按钮");
    
77.                 frame.getContentPane().setBackground(Color.yellow);
    
78.                 frame.getContentPane().setLayout(new FlowLayout());
    
79.                 frame.getContentPane().add(button);
    
80.                 frame.setSize(200, 200);
    
81.                 frame.setVisible(true);
    
82.                 frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
    
83.         }
    
84. 
    
85. }

复制代码

总结：以上提供的是button的自定义形状的方法，类似的思路可以尝试在其他的组件上。


原创内容，手打不易，且行且珍惜。


附：程序运行效果如下（只截取LED点阵部分，学过单片机的同学或是知道光立方的应该能看懂）


ps：涉及到毕业设计，我是不是应该强调一下版权问题   “ 0”

---

欢迎光临 黑马程序员技术交流社区 (http://bbs.itheima.com/)

黑马程序员IT技术论坛 X3.2