值得练手的JavaGUI项目——色彩调节器的实现【附完整源码】

时间:2022-07-25
本文章向大家介绍值得练手的JavaGUI项目——色彩调节器的实现【附完整源码】，主要内容包括其使用实例、应用技巧、基本知识点总结和需要注意事项，具有一定的参考价值，需要的朋友可以参考一下。

Hello！大家好！我是努力赚钱买生发水的灰小猿！

最近在做开发的时候有用到红、绿、蓝三色号的色彩调节，然后想使用某种色彩还需要去相关的网站上进行查询很是麻烦，于是就想着利用Java的GUI开发一个简单的调色器。可以自行调节色彩并且获取到对应的红绿蓝三种色号。

先来看一波效果图：

其实调色器的基本设计思路非常简单：

利用Java窗体，设置红。绿。蓝三种滑块、然后当我们拖动滑块使三种颜色的RGB值发生改变时，利用ChangeListener对事件进行监听，获取到三种颜色对应的RGB值，并且在窗体中将对应得到的颜色显示出来即可。

这里可能有小伙伴会问了，那么是RGB值呢？大灰狼给大家科普一下：

像素RGB值

其实就像我们平常所看到的所有图片，无论是彩色照还是黑白照，其实它们都是有色彩的，更加神奇的是，我们肉眼所看到的所有色彩几乎都是由红（Red）、绿（Green）、蓝（Blue）经过不同深度的调色后得到的，而RGB色彩模式就是是工业界的一种颜色标准，是通过对红®、绿(G)、蓝(B)三个颜色通道的变化以及它们相互之间的叠加来得到各式各样的颜色的。

所以RGB即是代表红、绿、蓝三个通道的颜色，这个标准几乎包括了人类视力所能感知的所有颜色，是目前运用最广的颜色系统之一。所以也可以说，我们所看到的所有具有色彩的图片都是由这三种颜色调出来的。

窗体模块设计

知道了这些以后，就是调色器的模块设计了。

首先是设置调色器窗体和字体，并且根据我们的需要将窗体进行简单的面板布局，在这里我们可以将窗体划分为一行三列，即：第一列摆放三种滑块、第二列显示三种颜色的RGB值、第三列显示当前得到的颜色。

setTitle("调色器");
setSize(600, 300);
setLayout(new GridLayout(1,3)); //将窗体进行布局
Font font1 = new Font("楷体", Font.PLAIN, 20);

//设置一个面板，存放滑块
JPanel jp_slide = new JPanel(new GridLayout(3,2));
add(jp_slide);

//设置另一个面板，存放显示色号的控件
JPanel jp_color = new JPanel(new GridLayout(3,1));
add(jp_color);

在第一个面板中设置红、绿、蓝三种颜色的滑块：

//设置颜色提示标签
JLabel radtext = new JLabel("红色");
radtext.setFont(font1);
JLabel greentext = new JLabel("绿色");
greentext.setFont(font1);
JLabel bluetext = new JLabel("蓝色");
bluetext.setFont(font1);

js_red = new JSlider(0,255,255); //设置红色滑块
js_green = new JSlider(0,255,0); //设置绿色滑块
js_blue = new JSlider(0,255,0); //设置蓝色滑块

jp_slide.add(radtext);
jp_slide.add(js_red);
jp_slide.add(greentext);
jp_slide.add(js_green);
jp_slide.add(bluetext);
jp_slide.add(js_blue);

在进行滑块的设置中，我们用到了JSlider控件，也就是滑块控件，在该控件后面对应的三个参数分别是滑块的最小值，滑块的最大值，滑块初始时的默认位置，如代表红色RGB值的滑块，最小值是0,最大值是255，当程序运行时滑块默认处于的位置是255。

在第二个面板中摆放显示颜色RGB值的控件

//设置显示颜色色号控件
jt_red = new JTextArea("255");
jt_red.setFont(font1);

jt_green = new JTextArea("0");
jt_green.setFont(font1);

jt_blue = new JTextArea("0");
jt_blue.setFont(font1);

jp_color.add(jt_red);
jp_color.add(jt_green);
jp_color.add(jt_blue);

最后进行颜色显示区域的摆放

//设置颜色显示区域
colorLB = new JTable();
colorLB.setBackground(Color.red);
add(colorLB);

现在调色器中的控件基本上都设置已经完成了，来看一波效果图：

但是现在我们拖动滑块，在颜色显示区域是没有变化的，因为我们还没有给控件添加相应的事件监听。

接下来就是我们对红、绿、蓝三种滑块的RGB值进行监听，并且在RGB值显示区域和色彩显示区域作出相应的响应。

在这里我们需要调用ChangeListener接口，该接口是ChangeEvent事件的监听接口，ChangeEvent事件在组件值改变的时候会触发，就比如说我们这里用到的滑块的值改变。同时，继承ChangeListener 这个接口的类（监听者）需要重写stateChanged(ChangeEvent e1) 方法，在该方法中对事件进行处理。

在该项目的stateChanged(ChangeEvent e1) 方法中，我们需要获取到三种滑块的RGB值，然后将对应的数值和颜色在窗体进行显示：

@Override
public void stateChanged(ChangeEvent e) {
// TODO Auto-generated method stub
r = js_red.getValue(); //获取到红色滑块的RGB值
g = js_green.getValue(); //获取到绿色滑块的RGB值
b = js_blue.getValue(); //获取到蓝色滑块的RGB值

//将三种颜色的RGB值在窗体进行显示
jt_red.setText(Integer.toString(r));
jt_green.setText(Integer.toString(g));
jt_blue.setText(Integer.toString(b));

//将对应的颜色进行显示
colorLB.setBackground(new Color(r, g, b));

}

同时在滑块控件上，我们也需要对三种滑块添加监听事件：

js_red.addChangeListener(this);

js_green.addChangeListener(this);

js_blue.addChangeListener(this);

现在，我们的调色器就基本已经完成了！

完整源码

最后附上完整源码：

package toning_device;

import java.awt.Color;
import java.awt.Container;
import java.awt.Font;
import java.awt.GridLayout;
import java.awt.event.ActionEvent;
import java.awt.event.ActionListener;

import javax.swing.JButton;
import javax.swing.JFrame;
import javax.swing.JLabel;
import javax.swing.JPanel;
import javax.swing.JSlider;
import javax.swing.JTable;
import javax.swing.JTextArea;
import javax.swing.event.AncestorListener;
import javax.swing.event.ChangeEvent;
import javax.swing.event.ChangeListener;

//定义Toning_device类继承窗体类，并且实现接口ChangeListener 监控组件的值发生改变，如滑块的值
public class Toning_device extends JFrame implements ChangeListener{

//将控件设置为公有权限
public JSlider js_red,js_green,js_blue; //定义滑块控件
public JTable colorLB; //定义颜色显示的标签
public JTextArea jt_red, jt_green, jt_blue; //定义显示色号的控件
public int r,g,b; //定义整形数据表示红、绿、蓝色号

public static void main(String[] args) {
// TODO Auto-generated method stub
new Toning_device(); //调用该类，执行构造函数
}

public Toning_device(){
setTitle("调色器");
setSize(600, 300);
setLayout(new GridLayout(1,3)); //将窗体进行布局
Font font1 = new Font("楷体", Font.PLAIN, 20);

//设置一个面板，存放滑块
JPanel jp_slide = new JPanel(new GridLayout(3,2));
add(jp_slide);

//设置另一个面板，存放显示色号的控件
JPanel jp_color = new JPanel(new GridLayout(3,1));
add(jp_color);

//设置颜色提示标签
JLabel radtext = new JLabel("红色");
radtext.setFont(font1);
JLabel greentext = new JLabel("绿色");
greentext.setFont(font1);
JLabel bluetext = new JLabel("蓝色");
bluetext.setFont(font1);

js_red = new JSlider(0,255,255); //设置红色滑块
js_green = new JSlider(0,255,0); //设置绿色滑块
js_blue = new JSlider(0,255,0); //设置蓝色滑块

jp_slide.add(radtext);
jp_slide.add(js_red);
jp_slide.add(greentext);
jp_slide.add(js_green);
jp_slide.add(bluetext);
jp_slide.add(js_blue);

//设置显示颜色色号控件
jt_red = new JTextArea("255");
jt_red.setFont(font1);
jt_green = new JTextArea("0");
jt_green.setFont(font1);
jt_blue = new JTextArea("0");

jt_blue.setFont(font1);

jp_color.add(jt_red);
jp_color.add(jt_green);
jp_color.add(jt_blue);

//设置颜色显示区域
colorLB = new JTable();
colorLB.setBackground(Color.red);
add(colorLB);

js_red.addChangeListener(this);
js_green.addChangeListener(this);
js_blue.addChangeListener(this);

setVisible(true);
setLocationRelativeTo(null);
}

@Override
public void stateChanged(ChangeEvent e) {
// TODO Auto-generated method stub
r = js_red.getValue(); //获取到红色滑块的RGB值
g = js_green.getValue(); //获取到绿色滑块的RGB值
b = js_blue.getValue(); //获取到蓝色滑块的RGB值

//将三种颜色的RGB值在窗体进行显示
jt_red.setText(Integer.toString(r));
jt_green.setText(Integer.toString(g));
jt_blue.setText(Integer.toString(b));

//将对应的颜色进行显示
colorLB.setBackground(new Color(r, g, b));
}

}

觉得不错记得点赞关注哟！

随机文章
java知识点必读
最近更新