滑杆组件的应用实例

滑杆JSlider类是让用户能够通过滑块的滑动来改变选择值的组件。
与JLabel、JButton相似，JSlider也可以作为小组件放置在面板上。下面以用滑杆改变颜色使画出的图像动态变化为例，说明滑杆的使用。
在这个程序中，我们需要4个类：一个面板类三个监听器类。
面板类：
面板最好分成左右两块，左边放置需要的小组件（按钮、标签、滑杆），右边作为绘画区域。
动作监听器ActionListener：
用来监听按钮，获得按钮文本，从而判断要进行的操作。在这里由于动作监听器所需要完成的功能很少，也可以将其作为一个内部类放置在面板类中。
鼠标监听器MouseListener：
　　用来监听右边面板实现绘图操作，获取鼠标按下和释放点的坐标，并据此画出图形。　　
ChangeListener：
用来监听滑杆滑块移动，其中的stateChanged(ChangeEvent e) 方法用来实现滑块移动后进行的操作。
在该方法中需要获得上一次画图形的起始位置，然后根据按钮文本来判断上一次画的是什么图形，接着将画笔颜色设为滑杆显示的数值，重复鼠标监听器中的画图形方法即可。


面板类SimplePanel：

import java.awt.BorderLayout;
import java.awt.Dimension;
import java.awt.FlowLayout;
import java.awt.Graphics;

import javax.swing.JButton;
import javax.swing.JFrame;
import javax.swing.JLabel;
import javax.swing.JPanel;
import javax.swing.JSlider;

/**
 * 简单画板，实现画线，画圆，画矩形，清除痕迹，颜色选择功能
 */
public class SimplePanel extends JFrame{

	public Graphics g;

	public JPanel jpChose;//按钮选择面板
	public JPanel jpDraw;//画图面板

	public JButton jOval;//渐变圆
	public JButton jRect;//渐变矩形
	public JButton jClear;//自定义橡皮擦

	public JLabel red;//标签 红色
	public JLabel green;//标签 绿色
	public JLabel blue;//标签 蓝色

	public JSlider jRed;//滑杆 红色
	public JSlider jBlue;//滑杆 蓝色
	public JSlider jGreen;//滑杆 绿色

	public static void main(String args[]){
		SimplePanel sp = new SimplePanel();
		sp.init();
	}

	/**
	 * 初始化面板类
	 */
	public void init(){
		//设置面板属性
		this.setTitle("简单画板");
		this.setSize(800, 700);
		this.setDefaultCloseOperation(3);
		this.setLocationRelativeTo(null);
		//设置边框布局
		this.setLayout(new BorderLayout());

		/*-----------------选择面板.西边----------------------*/
		jpChose = new JPanel();
		jpChose.setPreferredSize(new Dimension(200,700));
		jpChose.setLayout(new FlowLayout());

		jOval = new JButton("Oval");
		jRect = new JButton("Rect");
		jClear = new JButton("Clear");
		jOval.setPreferredSize(new Dimension(170,28));
		jRect.setPreferredSize(new Dimension(170,28));
		jClear.setPreferredSize(new Dimension(170,28));

		red = new JLabel("Red");
		green = new JLabel("Green");
		blue = new JLabel("Blue");

		jRed = new JSlider();
		jGreen = new JSlider();
		jBlue = new JSlider();

		//设置滑杆的各种属性
		this.setSlider();
		//向面板添加按钮
		jpChose.add(jOval);
		jpChose.add(jRect);
		jpChose.add(jClear);
		//向面板添加标签和滑杆
		jpChose.add(red);
		jpChose.add(jRed);
		jpChose.add(green);
		jpChose.add(jGreen);
		jpChose.add(blue);
		jpChose.add(jBlue);

		//添加动作监听器，获得按钮文本
		ButtonL bl = new ButtonL();
		jOval.addActionListener(bl);
		jRect.addActionListener(bl);
		jClear.addActionListener(bl);

		this.add(jpChose, BorderLayout.WEST);
		/*-----------------选择面板.西边----------------------*/

		/*-----------------绘图面板.中央----------------------*/
		jpDraw = new JPanel();
		this.add(jpDraw, BorderLayout.CENTER);
		/*-----------------绘图面板.中央----------------------*/

		this.setVisible(true);

		g = jpDraw.getGraphics();
		//鼠标监听器，根据鼠标起始位置画图形
		MouseL ml = new MouseL(g,jRed,jGreen,jBlue);
		jpDraw.addMouseListener(ml);
		//ChangeListener当移动滑杆上的滑块时，刚画过图形的颜色动态改变
		SliderL sl = new SliderL(g,jRed,jGreen,jBlue,ml);
		jRed.addChangeListener(sl);
		jGreen.addChangeListener(sl);
		jBlue.addChangeListener(sl);
	}

	/**
	 * 设置滑杆属性方法
	 */
	private void setSlider() {
		//红
		jRed.setMaximum(256);//设置最大值
		jRed.setMajorTickSpacing(64);//设置主刻度标记的间隔
		jRed.setMinorTickSpacing(16);//设置次刻度标记的间隔
		jRed.setPaintLabels(true);//确定是否在滑块上绘制标签
		jRed.setPaintTicks(true);// 确定是否在滑块上绘制刻度标记
		jRed.setValue(120);//设置初始值
		//绿
		jGreen.setMaximum(256);
		jGreen.setMajorTickSpacing(64);
		jGreen.setMinorTickSpacing(16);
		jGreen.setPaintLabels(true);
		jGreen.setPaintTicks(true);
		jGreen.setValue(130);
		//蓝
		jBlue.setMaximum(256);
		jBlue.setMajorTickSpacing(64);
		jBlue.setMinorTickSpacing(16);
		jBlue.setPaintLabels(true);
		jBlue.setPaintTicks(true);
		jBlue.setValue(150);
	}

}

　　　
在设置滑杆属性时用到了setMajorTickSpacing（int n）方法，此方法可以用来设置主刻度标记的间隔（一般的学生用尺子为1厘米）。在调用这个方法时，会检测是否设置了标签表（如直尺上竖直平行排列的刻度）。如果还没有标签表，并且主刻度间隔为 > 0，并且 getPaintLabels 返回 true，则会生成一个在主刻度标记处带有标签的标准标签表（通过调用 createStandardLabels）。然后通过调用 setLabelTable 在滑块上设置标签表。
　　还有一点要注意：要绘制主刻度，必须将setPaintTicks 设置为 true。


动作监听器类ButtonL：

import java.awt.event.ActionEvent;
import java.awt.event.ActionListener;

/**
 * 用来获得按钮上文本的类，也可以写为内部类
 */
public class ButtonL implements ActionListener{

	public static String s="null";
	public void actionPerformed(ActionEvent e) {
		s = e.getActionCommand();
	}

}

鼠标监听器类MouseL：

import java.awt.Color;
import java.awt.Graphics;
import java.awt.event.MouseEvent;
import java.awt.event.MouseListener;

import javax.swing.JSlider;

/**
 * 鼠标监听器，实现图形的绘制
 */
public class MouseL implements MouseListener {

	Graphics g;
	public int x1, y1, x2, y2;
	public JSlider jRed;
	public JSlider jBlue;
	public JSlider jGreen;

	public int red;
	public int green;
	public int blue;

	/**
	 * 重载构造方法
	 * @param g	画布，用来绘图
	 * @param jRed	滑杆，用来获得颜色初始值
	 * @param jBlue	滑杆，用来获得颜色初始值
	 * @param jGreen滑杆，用来获得颜色初始值
	 */
	public MouseL(Graphics g, JSlider jRed, JSlider jGreen, JSlider jBlue) {
		this.g = g;
		this.jRed = jRed;
		this.jGreen = jGreen;
		this.jBlue = jBlue;
	}

	/**
	 * 按下鼠标，获得按下点的坐标并设置颜色为滑杆的初始颜色
	 */
	public void mousePressed(MouseEvent e) {
		x1 = e.getX();
		y1 = e.getY();
		red = jRed.getValue();
		green = jGreen.getValue();
		blue = jBlue.getValue();
		g.setColor(new Color(red, green, blue));
	}

	/**
	 * 鼠标释放时，获取释放点的坐标，根据按钮的文本画出相应的图形
	 */
	public void mouseReleased(MouseEvent e) {
		x2 = e.getX();
		y2 = e.getY();
		String str = ButtonL.s;
		if (str.equals("Clear")) {
			g.clearRect(x1, y1, x2 - x1, y2 - y1);
		}
		//在这里采用的是向图形中心渐变的方法，也可以改变调用画图方法是传入的参数，实现更多种的变幻
		for (int i = 0; i < 150; i+=3) {
			if (str.equals("Oval")) {
				//画渐变圆
				g.fillOval(x1 + i, y1 + i, x2 - x1 - i*2, y2 - y1 - i*2);
			} else if (str.equals("Rect")) {
				//画渐变矩形
				g.fillRect(x1 + i, y1 + i, x2 - x1 - i*2, y2 - y1 - i*2);
			} 
			red = red - 2;
			green-=2;
			blue-=2;
			g.setColor(new Color(red,green,blue));
		}
	}

	public void mouseClicked(MouseEvent e) {

	}

	public void mouseEntered(MouseEvent e) {

	}

	public void mouseExited(MouseEvent e) {

	}

}

滑杆监听器类SliderL：

import java.awt.Color;
import java.awt.Graphics;

import javax.swing.JSlider;
import javax.swing.event.ChangeEvent;
import javax.swing.event.ChangeListener;
/**
 * 加在滑杆上的监听器，当任意滑杆上的滑块移动时，在先前画图形的位置用改变后的颜色将图形重画
 */
public class SliderL implements ChangeListener{

	public Graphics g;
	public JSlider jRed;
	public JSlider jBlue;
	public JSlider jGreen;

	public int red;
	public int green;
	public int blue;

	public MouseL ml;

	public int x1;
	public int y1;
	public int x2;
	public int y2;

	/**
	 * 重载构造方法
	 * @param g	画布，每移动一下滑块，都需在原来的位置画出一个颜色改变的图形
	 * @param jRed	滑杆，获得改变后的颜色值
	 * @param jBlue	滑杆，获得改变后的颜色值
	 * @param jGreen滑杆，获得改变后的颜色值
	 * @param ml	鼠标监听器，获得画图的坐标
	 */
	public SliderL(Graphics g,JSlider jRed,JSlider jGreen , JSlider jBlue,MouseL ml){
		this.g = g;
		this.jRed = jRed;
		this.jGreen = jGreen;
		this.jBlue = jBlue;
		this.ml = ml;
	}

	/**
	 * 滑块移动，改变颜色，重画图形
	 */
	public void stateChanged(ChangeEvent e) {
		x1 = ml.x1;
		y1 = ml.y1;
		x2 = ml.x2;
		y2 = ml.y2;
		red = jRed.getValue();
		green = jGreen.getValue();
		blue = jBlue.getValue();
		g.setColor(new Color(red,green,blue));

		String str = ButtonL.s;

		if (str.equals("Clear")) {
			g.clearRect(x1, y1, x2 - x1, y2 - y1);
		}
		for (int i = 0; i < 150; i+=3) {
			if (str.equals("Oval")) {
				g.fillOval(x1 + i, y1 + i, x2 - x1 - i*2, y2 - y1 - i*2);
			} else if (str.equals("Rect")) {
				g.fillRect(x1 + i, y1 + i, x2 - x1 - i*2, y2 - y1 - i*2);
			} 
			red = red - 2;
			green-=2;
			blue-=2;
			g.setColor(new Color(red,green,blue));
		}
	}

}

在编写程序过程中犯的几个错误：
1、打开程序在右边面板单击，可能会报空指针异常。原因是没有点击按钮，记录按钮文本的变量没有值。因此，最好给变量s设初值。
　　　
2、由于我一开始是使用一个面板，后来才分成左右两块面板，在修改的时候就出现了坐标偏移的问题。若在A点按下，则实际出现的起始点在A点的右下方。
出现这个问题的原因是：将一个面板分为两个后，画布是从右边面板取得，而鼠标监听器仍是加在原来的大面板上。这样，鼠标监听器取得的坐标是相对大面板的左上顶点而言的，而画布的坐标原点却是右边面板的左上顶点，用鼠标监听器取得的坐标在画布上绘图，自然就会出现坐标错位。

3、在程序中，我画图部分的设定是：循环50次，每次颜色值减2.在这种情况下，若是3个滑杆中有任意一个的初始值小于100都会报如下错误。
[img]http://dl2.iteye.com/upload/attachment/0088/2248/7dc1217e-c357-3c97-b408-03e5b87f5110.png[/img]

程序的运行结果如下：
[img]http://dl2.iteye.com/upload/attachment/0088/2267/03e7329d-5c74-3d15-ae45-e941b696b394.png[/img]