畫板效果
(以前寫在Csdn上的博文,沒去水印,Csdn名字同博客園)
布局類:

package gary; import java.awt.Color; import java.awt.event.ActionEvent; import java.awt.event.ActionListener; import java.io.File; import javax.swing.JButton; import javax.swing.JColorChooser; import javax.swing.JFileChooser; import javax.swing.JFrame; public class PaintFrame extends JFrame{ //定義按鈕 JButton line,rect,round,chooseColor,save,exit; //定義一個繪圖區 PaintPanel panel ; //默認顏色是 Color selectColor = Color.GRAY; //構造方法對面板進行初始化 public PaintFrame() { //1.初始化所有按鈕 line = new JButton("線"); rect = new JButton("矩形"); round = new JButton("圓形"); chooseColor = new JButton("選擇顏色"); save = new JButton("保存"); exit = new JButton("退出"); //初始化繪圖區 panel = new PaintPanel(); panel.setBackground(Color.WHITE); //設置繪圖區為白色 chooseColor.setBackground(selectColor); panel.selectColor = selectColor; //2.初始化窗口 setTitle("畫板"); setSize(600,600); setResizable(false); setDefaultCloseOperation(EXIT_ON_CLOSE); //3.把按鈕放置在窗口中 add(line); add(rect); add(round); add(chooseColor); add(save); add(exit); //step2:把繪圖區放置到窗口中 add(panel); //4.重定位按鈕 line.setBounds(1,10,60,30); rect.setBounds(1,40,60,30); round.setBounds(1,70,60,30); chooseColor.setBounds(1,100,60,30); save.setBounds(1,130,60,30); exit.setBounds(1,160,60,30); //重定位繪圖區 panel.setBounds(65,10,520,550); //5.給各個按鈕注冊監聽器 //直線 line.addActionListener(new ActionListener() { @Override public void actionPerformed(ActionEvent e) { //改變繪圖區的type變量的值為"line" panel.type = "line"; } }); //矩形 rect.addActionListener(new ActionListener() { @Override public void actionPerformed(ActionEvent e) { //改變繪圖區的type變量的值為"rect" panel.type = "rect"; } }); //圓 round.addActionListener(new ActionListener() { @Override public void actionPerformed(ActionEvent e) { //改變繪圖區的type變量的值為"round" panel.type = "round"; } }); //選擇顏色 chooseColor.addActionListener(new ActionListener() { @Override public void actionPerformed(ActionEvent e) { Color color = JColorChooser.showDialog(null, "請選擇顏色", selectColor); selectColor = color; //默認顏色設置成選擇的顏色 //講選擇的顏色返回到按鈕"選擇顏色"的背景上 chooseColor.setBackground(selectColor); panel.selectColor = selectColor; } }); //保存 save.addActionListener(new ActionListener(){ @Override public void actionPerformed(ActionEvent arg0) { JFileChooser chooser = new JFileChooser(); int cnt = chooser.showDialog(null,"保存"); if(cnt == 0 ) { //用戶選中的文件 File file = chooser.getSelectedFile(); System.out.println("file = " + file.getAbsolutePath()); panel.save(file); } } }); //退出 exit.addActionListener(new ActionListener() { @Override public void actionPerformed(ActionEvent arg0) { System.exit(0); } }); //end.設置布局為空,使窗口可見 setLayout(null); setVisible(true); } public static void main(String[] args) { new PaintFrame(); } }
功能類:

package gary; import java.awt.Color; import java.awt.Graphics; import java.awt.Graphics2D; import java.awt.event.MouseEvent; import java.awt.event.MouseListener; import java.awt.image.BufferedImage; import java.io.File; import javax.swing.JPanel; public class PaintPanel extends JPanel{ //表示下一次要畫的圖形類型 "line","rect","round" String type = "line"; //表示鼠標的橫縱坐標 int x,y; //要繪制的顏色 Color selectColor; public PaintPanel() { //給繪圖區添加鼠標點擊和釋放的監聽器 addMouseListener(new MouseListener() { @Override public void mousePressed(MouseEvent e) { // 按下 //獲得圖形的原點 x = e.getX(); y = e.getY(); } @Override public void mouseReleased(MouseEvent e) { // 釋放 //獲得圖形的終點 int x1 = e.getX(); int y1 = e.getY(); //獲得繪圖區的作圖器 Graphics2D g = (Graphics2D)getGraphics(); //給作圖器設置繪圖的顏色 g.setColor(selectColor); //根據type的值繪制不同類型的圖形 if(type.equals("line")) { //繪制直線 g.drawLine(x,y, x1, y1); } if(type.equals("rect")) { //繪制矩形 g.drawRect(x,y,x1-x,y1-y); } if(type.equals("round")) { //繪制橢圓形 g.drawOval(x, y, x1-x, y1-y); } } @Override public void mouseClicked(MouseEvent e) { // TODO Auto-generated method stub } @Override public void mouseEntered(MouseEvent e) { // TODO Auto-generated method stub } @Override public void mouseExited(MouseEvent e) { // TODO Auto-generated method stub } }); } public void save(File file) { //獲得相對於文件的緩沖圖片 BufferedImage image= new BufferedImage(getWidth(),getHeight(),BufferedImage.TYPE_INT_RGB); //從緩沖圖片中獲得作圖器 Graphics g = image.getGraphics(); g.setColor(Color.white); g.fillRect(0, 0, getWidth()+1, getHeight()+1); //向緩存圖片上寫繪制所有的圖形 } }
畫板制作分兩個部分:
(一)界面布局
(二)實現功能
小知識:
setBounds(x,y,width,height);
x:組件在容器X軸上的起點
y:組件在容器Y軸上的起點
width:組件的長度
height:組件的
下面是一個按鈕的簡單布局
實現過程:
一、界面布局
1.定義所有按鈕,把按鈕全部放置到面板中
package gary; import javax.swing.JButton; import javax.swing.JFrame; public class PaintFrame extends JFrame{ JButton line,rect,round,chooseColor,save,exit; //構造方法對面板進行初始化 public PaintFrame() { //1.初始化所有按鈕 line = new JButton("線"); rect = new JButton("矩形"); round = new JButton("圓形"); chooseColor = new JButton("選擇顏色"); save = new JButton("保存"); exit = new JButton("退出"); //2.初始化窗口 setTitle("畫板"); setSize(600,600); setResizable(false); setDefaultCloseOperation(EXIT_ON_CLOSE); //3.把按鈕放置在窗口中 add(line); add(rect); add(round); add(chooseColor); add(save); add(exit); //4.重定位按鈕 line.setBounds(1,10,60,30); rect.setBounds(1,40,60,30); round.setBounds(1,70,60,30); chooseColor.setBounds(1,100,60,30); save.setBounds(1,130,60,30); exit.setBounds(1,160,60,30); //end.設置布局為空,使窗口可見 setLayout(null); setVisible(true); } public static void main(String[] args) { new PaintFrame(); } }
chooseColor.setBackground(selectColor);
這樣這些按鈕就放到面板上了
2.把繪圖區放置到面板中
繪圖區我們用JPanel類來制作,JPanel是一個輕量級面板,不可以單獨存在,必要要放到Frame面板上,Frame是一個重量級面板,可以單獨存在
定義一個PaintPanel類用來繼承JPanel
接着到PaintFrame這個類中初始化放置繪圖區到面板上:
初始化
//step2:初始化繪圖區 panel = new PaintPanel(); panel.setBackground(Color.WHITE); //設置繪圖區為白色
把繪圖區放置到窗口中
//step2:把繪圖區放置到窗口中 add(panel);
定義繪圖區
//重定位繪圖區 panel.setBounds(65,10,520,550);
板右邊就繪制了一個繪圖區,為后面繪制直線、圓、矩形設置了一個面板
3.定義顏色
在PaintFrame類中定義一個顏色
//默認顏色是 Color selectColor = Color.GRAY;
將"選擇顏色"按鈕定義為灰色
chooseColor.setBackground(selectColor);

package gary; import java.awt.Color; import javax.swing.JButton; import javax.swing.JFrame; public class PaintFrame extends JFrame{ //定義按鈕 JButton line,rect,round,chooseColor,save,exit; //定義一個繪圖區 PaintPanel panel; //默認顏色是 Color selectColor = Color.GRAY; //構造方法對面板進行初始化 public PaintFrame() { //1.初始化所有按鈕 line = new JButton("線"); rect = new JButton("矩形"); round = new JButton("圓形"); chooseColor = new JButton("選擇顏色"); save = new JButton("保存"); exit = new JButton("退出"); //初始化繪圖區 panel = new PaintPanel(); panel.setBackground(Color.WHITE); //設置繪圖區為白色 chooseColor.setBackground(selectColor); //2.初始化窗口 setTitle("畫板"); setSize(600,600); setResizable(false); setDefaultCloseOperation(EXIT_ON_CLOSE); //3.把按鈕放置在窗口中 add(line); add(rect); add(round); add(chooseColor); add(save); add(exit); //step2:把繪圖區放置到窗口中 add(panel); //4.重定位按鈕 line.setBounds(1,10,60,30); rect.setBounds(1,40,60,30); round.setBounds(1,70,60,30); chooseColor.setBounds(1,100,60,30); save.setBounds(1,130,60,30); exit.setBounds(1,160,60,30); //重定位繪圖區 panel.setBounds(65,10,520,550); //end.設置布局為空,使窗口可見 setLayout(null); setVisible(true); } public static void main(String[] args) { new PaintFrame(); } }
(左邊就是面板的功能區,右邊就是畫板繪圖區,接下來我們就要實現這些按鈕的基本功能了)
二、實現功能
1.退出(最簡單的一個)
exit.addActionListener(new ActionListener() { @Override public void actionPerformed(ActionEvent arg0) { System.exit(0); } });
2.選擇顏色
showDialog(Component component, String title, Color initialColor)創建一個顏色對話框參數component指定對話框所依賴的組件,title指定對話框的標題;initialColor指定對話框返回默認顏色
chooseColor.addActionListener(new ActionListener() { @Override public void actionPerformed(ActionEvent e) { Color color = JColorChooser.showDialog(null, "請選擇顏色", selectColor); selectColor = color; //默認顏色設置成選擇的顏色 //講選擇的顏色返回到按鈕"選擇顏色"的背景上 chooseColor.setBackground(selectColor); } });
3.線、矩形、圓形
在PaintPanel類中定義一個String類型的變量type,用表示下一次要畫的圖形類型
在PaintFrame中添加這三個按鈕的監聽器,每按下一個按鈕,改變type的值
//直線 line.addActionListener(new ActionListener() { @Override public void actionPerformed(ActionEvent e) { //改變繪圖區的type變量的值為"line" panel.type = "line"; } }); //矩形 rect.addActionListener(new ActionListener() { @Override public void actionPerformed(ActionEvent e) { //改變繪圖區的type變量的值為"rect" panel.type = "rect"; } }); //圓 round.addActionListener(new ActionListener() { @Override public void actionPerformed(ActionEvent e) { //改變繪圖區的type變量的值為"round" panel.type = "round"; } });
接下來到PaintPanel類JPanel輕量級面板上實現三個按鈕的功能
關鍵就是給繪圖區添加鼠標點擊和釋放的監聽器
在PaintPanel類中定義一個x,y來表示鼠標的橫縱坐標
//表示鼠標的橫縱坐標 int x,y;
在繪圖區給鼠標添加點擊和釋放的監聽器
點擊鼠標時候獲得繪制圖形起點x,y坐標
釋放鼠標時候獲得繪制圖形終點x,y坐標
用type的不同值來調用Graphics2D類中不同方法繪畫出不同的圖形
addMouseListener(new MouseListener() { @Override public void mousePressed(MouseEvent e) { // 按下 //獲得圖形的原點 x = e.getX(); y = e.getY(); } @Override public void mouseReleased(MouseEvent e) { // 釋放 //獲得圖形的終點 int x1 = e.getX(); int y1 = e.getY(); //獲得繪圖區的作圖器 Graphics2D g = (Graphics2D)getGraphics(); //根據type的值繪制不同類型的圖形 if(type.equals("line")) { //繪制直線 g.drawLine(x,y, x1, y1); } if(type.equals("rect")) { //繪制矩形 g.drawRect(x,y,x1-x,y1-y); } if(type.equals("round")) { //繪制橢圓形 g.drawOval(x, y, x1-x, y1-y); } }
接下來把顏色添加到繪畫圖形線條上面
在PaintPanel類中定義一個Color類的變量
//要繪制的顏色 Color selectColor;
在釋放鼠標繪圖器開始繪圖的時候添加上顏色
Graphics2D g = (Graphics2D)getGraphics(); //給作圖器設置繪圖的顏色 g.setColor(selectColor);
PaintFrame類設置監聽器"設置顏色"按鈕上給PaintPanel獲得選擇的顏色
//選擇顏色 chooseColor.addActionListener(new ActionListener() { @Override public void actionPerformed(ActionEvent e) { Color color = JColorChooser.showDialog(null, "請選擇顏色", selectColor); selectColor = color; //默認顏色設置成選擇的顏色 //講選擇的顏色返回到按鈕"選擇顏色"的背景上 chooseColor.setBackground(selectColor); panel.selectColor = selectColor; } });
4.保存
在PaintFrame類中添加"保存"按鈕的監聽器
//保存 save.addActionListener(new ActionListener(){ @Override public void actionPerformed(ActionEvent arg0) { JFileChooser chooser = new JFileChooser(); int cnt = chooser.showDialog(null,"保存"); if(cnt == 0 ) { //用戶選中的文件 File file = chooser.getSelectedFile(); System.out.println("file = " + file.getAbsolutePath()); panel.save(file); } } });
在PaintPanel類中實現保存功能,調用PaintPanel類中save()保存方法
public void save(File file) { //獲得相對於文件的緩沖圖片 BufferedImage image= new BufferedImage(getWidth(),getHeight(),BufferedImage.TYPE_INT_RGB); //從緩沖圖片中獲得作圖器 Graphics g = image.getGraphics(); g.setColor(Color.white); g.fillRect(0, 0, getWidth()+1, getHeight()+1); //向緩存圖片上寫繪制所有的圖形 }
到這里一個簡單的畫板就制作出來啦O(∩_∩)O,程序比較簡單還有很多可以完善的地方