Microsoft Word - 投影片ch20

Size: px

Start display at page:

Download "Microsoft Word - 投影片ch20"

装耶熊
5 years ago
Views:

1 Java2 JDK5.0 教學手冊第三版洪維恩編著博碩文化出版書號 pg20210 第二十章 AWT 的繪圖本章學習目標認識 Java 繪圖的基本概念學習設定圖形的顏色與文字的字型學習用滑鼠繪圖的基本程式設計

2 AWT 的繪圖繪圖概述座標系統 Java 的座標系統, 原點在視窗的左上角, 向右為 x 軸方向, 向下為 y 軸方向, 如下圖所示 : 原點 x (x,y) y

3 AWT 的繪圖 Graphics 類別 Graphics 類別所產生的物件稱為圖形內容 (graphics context) 圖形內容可透過 getgraphics() method 來取得利用 getgraphics() 取得繪圖區 app20_1 在 AWT 視窗下方配置了一個按鈕, 用來觸發繪圖事件 : 原點

4 AWT 的繪圖 20-4 app20_1 的程式碼如下 : 01 // app20_1, 簡單的繪圖 02 import java.awt.*; 03 import java.awt.event.*; 04 public class app20_1 extends Frame implements ActionListener 05 { 06 static app20_1 frm=new app20_1(); 07 static Button btn=new Button("Draw"); public static void main(string args[]) 10 { 11 BorderLayout br=new BorderLayout(); 12 frm.settitle("drawing example"); 13 frm.setlayout(br); 14 frm.setsize(200,150); 15 frm.add(btn,br.south); 16 btn.addactionlistener(frm); 17 frm.setvisible(true); 18 } 19 public void actionperformed(actionevent e) 20 { 21 Graphics g=getgraphics(); // 取得視窗的繪圖區 22 g.drawrect(100,50,70,55); // 繪出長方形 23 } 24 }

5 AWT 的繪圖 20-5 解決圖形被覆蓋掉的問題 app20_1 所繪出來的長方形, 如果有別的視窗覆蓋在上面, 再移開視窗時, 長方形被覆蓋的部份會消失? (1) 長方形被別的視窗覆蓋在上面 (2) 當視窗移開時, 被覆蓋的部份會消失

6 AWT 的繪圖 20-6 要解決長方形因覆蓋而消失的問題, 可利用 paint() method paint() 在下列的情況發生時會自動執行 : (1) 當新建的視窗顯示於螢幕上, 或從隱藏變成顯示時 (2) 從縮小圖示還原之後 (3) 正在改變視窗的大小時

7 AWT 的繪圖 20-7 利用 paint() method, 可把 app20_1 改寫成 app20_2: 01 // app20_2, app20_1 的修改版 02 import java.awt.*; 03 import java.awt.event.*; 04 public class app20_2 extends Frame implements ActionListener 05 { 06 static app20_2 frm=new app20_2(); 07 static Button btn=new Button("Draw"); public static void main(string args[]) 10 { 11 BorderLayout br=new BorderLayout(); 12 frm.settitle("drawing example"); 13 frm.setlayout(br); 14 frm.setsize(200,150); 15 frm.add(btn,br.south); 16 btn.addactionlistener(frm); 17 frm.setvisible(true); 18 } 19 public void actionperformed(actionevent e) 20 { 21 Graphics g=getgraphics(); // 取得視窗的繪圖區 22 paint(g); // 呼叫 paint() method

8 23 } 24 public void paint(graphics g) 25 { 26 g.drawrect(100,50,70,55); // 繪出長方形 27 } 28 } AWT 的繪圖 20-8

9 AWT 的繪圖 20-9 app20_3 則是修改 app20_2, 使得按下 Draw 按鈕之後才會繪製長方形 : 01 // app20_3, app20_2 的修改版 02 import java.awt.*; 03 import java.awt.event.*; 04 public class app20_3 extends Frame implements ActionListener 05 { 06 static app20_3 frm=new app20_3(); 07 static Button btn=new Button("Draw"); 08 boolean clicked=false; // 宣告 boolean 變數, 用來判別按鈕是否按下 public static void main(string args[]) 11 { 12 BorderLayout br=new BorderLayout(); 13 frm.settitle("drawing example"); 14 frm.setlayout(br); 15 frm.setsize(200,150); 16 frm.add(btn,br.south); 17 btn.addactionlistener(frm); 18 frm.setvisible(true); 19 } 20 public void actionperformed(actionevent e) 21 {

10 22 clicked=true; // 設定按鈕已被按下 23 Graphics g=getgraphics(); // 取得視窗的繪圖區 24 paint(g); 25 } 26 public void paint(graphics g) 27 { 28 if(clicked) // 如果按鈕被按下 29 g.drawrect(100,50,70,55); // 繪出長方形 30 } 31 } AWT 的繪圖 20-10

11 AWT 的繪圖不透過按鈕, 在程式一開始時便在視窗上繪圖 app20_4 會在視窗顯現後寫上一行文字, 並用紅色的長方形框起來 : 01 // app20_4, 簡單的繪圖 02 import java.awt.*; 03 import java.awt.event.*; 04 public class app20_4 extends Frame // 設定 app20_4 繼承自 Frame 類別 05 { 06 static app20_4 frm=new app20_4(); // 建立視窗物件 frm public static void main(string args[]) 09 { 10 frm.settitle("drawing example"); 11 frm.setsize(200,150); 12 frm.setvisible(true); 13 } 14 public void paint(graphics g) 15 { 16 g.setfont(new Font("Arial",Font.ITALIC,18)); // 設定使用的字型 17 g.drawstring("live and learn.",45,88); // 繪出字串 18 g.setcolor(color.red); // 設定繪圖顏色為紅色 19 g.drawrect(30,65,145,30); // 繪出長方形 20 } 21 }

12 AWT 的繪圖下圖為字串 "Live and learn." 的位置說明圖 : (45,88)

13 AWT 的繪圖設定顏色與字型設定顏色下表列出 Color 類別常用的建構元與 method: 表 java.awt.color 的建構元與 method 建構元 Color(float r, float g, float b) Color(int r, int g, int b) 主要功能設定紅色 (red) 綠色 (green) 與藍色 (blue) 的值, 這三者的值必須介於 0~1 之間的浮點數同上, 但數值是介於 0~255 之間的整數 method Color brighter() Color darker() boolean equals(object obj) int getblue() int getgreen() int getred() 主要功能取得此目前顏色稍亮一點的顏色取得此目前顏色稍暗一點的顏色測試顏色是否相等取得 Color 裡藍色的值取得 Color 裡綠色的值取得 Color 裡紅色的值

14 AWT 的繪圖 app20_5 是 Color 類別使用的範例 01 // app20_5, RGB color 色階的應用 02 import java.awt.*; 03 import java.awt.event.*; 04 public class app20_5 extends Frame implements AdjustmentListener 05 { 06 static app20_5 frm=new app20_5(); 07 static Scrollbar scr1=new Scrollbar(Scrollbar.VERTICAL); 08 static Scrollbar scr2=new Scrollbar(Scrollbar.HORIZONTAL); 09 static Scrollbar scr3=new Scrollbar(Scrollbar.VERTICAL); public static void main(string args[]) 12 { 13 BorderLayout br=new BorderLayout(5,5); 14 frm.settitle("display colors"); 15 frm.setsize(200,150); 16 frm.add(scr1,br.west); // scr1 捲軸, 用來控制紅色 17 frm.add(scr2,br.south); // scr2 捲軸, 用來控制綠色 18 frm.add(scr3,br.east); // scr3 捲軸, 用來控制藍色 19 scr1.setvalues(255,45,0,300); // 設定 scr1 的相關數值 20 scr2.setvalues(255,45,0,300); // 設定 scr2 的相關數值 21 scr3.setvalues(140,45,0,300); // 設定 scr3 的相關數值 22 scr1.addadjustmentlistener(frm);

15 AWT 的繪圖 scr2.addadjustmentlistener(frm); 24 scr3.addadjustmentlistener(frm); 25 frm.setvisible(true); 26 } 27 public void adjustmentvaluechanged(adjustmentevent e) 28 { 29 Graphics g=getgraphics(); 30 paint(g); 31 } public void paint(graphics g) 34 { 35 int red=scr1.getvalue(); // 取得捲軸 scr1 的值 36 int green=scr2.getvalue(); // 取得捲軸 scr2 的值 37 int blue=scr3.getvalue(); // 取得捲軸 scr3 的值 38 String str="color("+red+","+green+","+blue+")"; 39 g.setcolor(new Color(red,green,blue)); // 設定繪圖顏色 40 g.fillrect(0,0,getwidth(),getheight()); 41 g.setcolor(color.black); // 設定繪圖顏色為黑色 42 g.drawstring(str,45,80); // 於 (45,80) 處寫上字串 43 } 44 }

16 AWT 的繪圖下圖為執行結果拉動捲軸時, 視窗上的顏色與數值會隨之更改

17 AWT 的繪圖 darker() 與 brighter() 的使用範例 app20_6 是 darker() 與 brighter() 的使用範例 01 // app20_6, brighter() 與 darker() 的使用 02 import java.awt.*; 03 import java.awt.event.*; 04 class app20_6 extends Frame implements ActionListener 05 { 06 static app20_6 frm=new app20_6(); 07 static Button btn1=new Button("Brighter"); // Brighter 按鈕 08 static Button btn2=new Button("Darker"); // Darker 按鈕 09 Color co=new Color(255,255,255); // 設定顏色的初值 public static void main(string args[]) 12 { 13 frm.settitle("brighter & Darker"); 14 frm.setlayout(new FlowLayout()); 15 frm.setsize(200,150); 16 frm.add(btn1); 17 frm.add(btn2); 18 btn1.addactionlistener(frm); 19 btn2.addactionlistener(frm); 20 frm.setvisible(true);

18 AWT 的繪圖 } 22 public void actionperformed(actionevent e) 23 { 24 Button btn=(button) e.getsource(); // 取得被按下的按鈕 25 if(btn==btn1) 26 co=co.brighter(); // 如果是按下 brighter, 則將顏色變亮一點 27 else if(btn==btn2) 28 co=co.darker(); // 如果是按下 Darker, 則將顏色變暗一點 29 Graphics g=getgraphics(); 30 paint(g); 31 } 32 public void paint(graphics g) 33 { 34 g.setcolor(co); // 將繪圖顏色設為 co 35 g.fillrect(0,0,getwidth(),getheight()); // 填滿顏色 36 } 37 }

19 AWT 的繪圖設定字型 Java 以 Font 類別來處理字型的相關設定下表列出了 Font 類別常用的建構元與 method: 表建構元 java.awt.font 的建構元與 method 主要功能 Font(String name, int style, int size) 設定字型的名稱樣式與大小 method 主要功能 String getfontname() 取得字型的名稱 int getsize() 取得字型的大小 int getstyle() 取得字型的樣式 ( 粗體斜體或一般 ) boolean isbold() 測試字體是否為粗體 boolean isitalic() 測試字體是否為斜體 boolean isplain() 測試字體是否為一般字體

20 AWT 的繪圖 app20_7 是個可用來列出系統所提供之所有字型的範例 01 // app20_7, 列出系統所提供的字型 02 import java.awt.*; 03 import java.awt.event.*; 04 class app20_7 extends Frame implements ItemListener 05 { 06 static app20_7 frm=new app20_7(); 07 static List lst=new List(); // 建立一個 List 物件 08 String str="arial"; // 設定字串的初值 public static void main(string args[]) 11 { 12 BorderLayout br=new BorderLayout(5,5); 13 frm.add(lst,br.north); 14 frm.setbackground(color.yellow); 15 frm.settitle("font List"); 16 lst.additemlistener(frm); 17 frm.setsize(250,150); 18 GraphicsEnvironment ge; 建立 GraphicsEnvironment 的物件 ge, 並以它來取得系統裡所提供的字型 19 ge=graphicsenvironment.getlocalgraphicsenvironment(); 20 String fnt[]=ge.getavailablefontfamilynames(); 21 for(int i=2;i<fnt.length-2;i++) 22 lst.add(fnt[i]);

AWT 的繪圖 20-21 23 frm.setvisible(true); 24 } 25 public void itemstatechanged(itemevent e) 26 { 27 str=lst.

21 AWT 的繪圖 frm.setvisible(true); 24 } 25 public void itemstatechanged(itemevent e) 26 { 27 str=lst.getselecteditem(); // 取得選擇表單裡被選取的項目 28 Graphics g=getgraphics(); 29 update(g); // 清除背景顏色, 再呼叫 paint() 30 } 31 public void paint(graphics g) 32 { 33 g.setfont(new Font(str,Font.PLAIN,20)); // 設定字型 34 g.setcolor(color.black); // 設定顏色 35 g.drawstring(str,50,110); // 用指定的顏色與字型寫上字串 36 } 37 }

22 AWT 的繪圖 Graphics 類別下表列出了 Graphics 類別常用的建構元與 method: 表 java.awt.graphics 的建構元與 method 建構元 protected Graphics() 主要功能建立一個新的 Graphics 物件 method abstract void clearrect(int x, int y, int w, int h) abstract void cliprect(int x, int y, int w, int h) abstract void drawarc(int x, int y, int w, int h, int startangle, int arcangle) void drawchars(char[] data, int offset, int length, int x, int y) abstract boolean drawimage(image img, int x, int y, ImageObserver observer) 主要功能清除所指定之長方形的繪圖區域, 並填上背景顏色只顯示長方形區域內的圖形繪出弧形在繪圖區寫上字元顯示指定的圖檔, 圖形的左上角放在座標 (x,y) 之處

23 AWT 的繪圖 method drawimage(image img, int x, int y, int width, int height, ImageObserver observer) abstract void drawline(int x1, int y1, int x2, int y2) abstract void drawoval(int x, int y, int w, int h) abstract void drawpolygon(int[] xpoints, int[] ypoints, int npoints) abstract void drawpolyline(int[] xpoints, int[] ypoints, int npoints) void drawrect(int x, int y, int w, int h) abstract void drawroundrect(int x, int y, int w, int h, int arcw, int arch) abstract void drawstring(string str, int x, int y) abstract void fillarc(int x, int y, int w, int h, int startangle, int arcangle) abstract void filloval(int x, int y, int w, int h) abstract void fillpolygon(int[] xpoints, int[] ypoints, int npoints) 主要功能顯示指定的圖檔, 圖形的左上角放在座標 (x,y) 之處, 並自動調整圖形的大小, 使其寬度為 width, 高為 height 個點素繪出線段繪出橢圓形繪出多邊形用線段將所給予的點連接起來繪出長方形繪出圓角長方形在繪圖區寫上字串 str 繪出弧形, 並填滿顏色繪出橢圓形, 並填滿顏色繪出多邊形, 並填滿顏色

24 AWT 的繪圖 method abstract void fillrect(int x, int y, int w, int h) abstract void fillroundrect(int x, int y, int w, int h, int arcw, int arch) abstract Color getcolor() abstract Font getfont() abstract void setclip(int x, int y, int w, int h) abstract void setcolor(color c) abstract void setfont(font font) abstract void translate(int x, int y) 主要功能繪出長方形, 並填滿顏色繪出圓角長方形, 並填滿顏色取得繪圖的顏色取得繪圖的字型設定剪裁的區域為長方形設定繪圖的顏色為 c 設定繪圖區所用的顏色為 c 將原點定位在點 (x,y)

AWT 的繪圖 20-25 繪圖區域內的每一個點由座標 (x,y) 來表示 : 原點 y x (x,y) 繪圖 method 引數的說明下面列出了部份 method

25 AWT 的繪圖繪圖區域內的每一個點由座標 (x,y) 來表示 : 原點 y x (x,y) 繪圖 method 引數的說明下面列出了部份 method 的引數於二維平面中所代表的意義 : (x 1,y 1 ) (x 2,y 2 ) drawline(int x 1, int y 1, int x 2, int y 2 ) drawline(), 給予兩個端點繪製線段

26 AWT 的繪圖 (x,y) h drawrect(), 給予頂點與寬高來繪製長方形 w drawrect(int x, int y, int w, int h) (x,y) arch arcw w h drawroundrect(), 給予頂點寬高與兩個圓角距離繪製圓角長方形 drawroundrect(int x, int y, int w, int h,int arcw, int arch) (x,y) h drawoval(), 給予頂點與寬高來繪製橢圓形 w drawoval(int x, int y, int w, int h)

27 AWT 的繪圖 (x,y) arcangle startangle h drawarc(), 給予頂點起始角度與弧形角度來繪弧 w drawarc(int x, int y, int startangle, int arcangle) (x 1,y 1 ) (x 2,y 2 ) (x 3,y 3 ) drawpolyline(), 用線段連接每一個頂點,nPoints 為所給予的點數 (x 4,y 4 ) drawpolyline(int xpoints[], int ypoints[], int npoints) (x 1,y 1 ) (x 2,y 2 ) (x 3,y 3 ) (x 4,y 4 ) drawpolygon(), 用線段連接頂點, 形成封閉的多邊形, 其中 npoints 為所給予的點數 (x 5,y 5 ) drawpolylgon(int xpoints[], int ypoints[], int npoints)

$*; 03 public class app20_8 extends Frame 04 { 05 static app20_8 frm=new app20_8(); 06 07 public static void main(string args[]) 08 { 09 frm.settitle("arc & Oval"); 10 frm.setsize(200,150); 11 frm.$

28 AWT 的繪圖基本幾何形狀的繪圖 app20_8 是圓弧和圓形的繪圖練習 : 01 // app20_8, 填滿圓弧與圓形 02 import java.awt.*; 03 public class app20_8 extends Frame 04 { 05 static app20_8 frm=new app20_8(); public static void main(string args[]) 08 { 09 frm.settitle("arc & Oval"); 10 frm.setsize(200,150); 11 frm.setvisible(true); 12 } public void paint(graphics g) 15 { 16 g.setcolor(color.pink); // 設定繪圖顏色為粉紅 17 g.fillarc(20,50,70,70,30,300); // 填滿圓弧 18 g.setcolor(color.red); // 設定繪圖顏色為紅色 19 for(int x=70;x<=170;x=x+20) 20 g.filloval(x,80,10,10); // 繪出六個小圓 21 } 22 }

$*; 03 class app20_9 extends Frame 04 { 05 static app20_9 frm=new app20_9(); 06 07 public static void main(string args[]) 08 { 09 frm.settitle("polygon"); 10 frm.setsize(200,150); 11 frm.$

29 AWT 的繪圖多邊形的繪圖練習下面是繪製多邊形的範例 : 01 // app20_9, 繪製多邊形 02 import java.awt.*; 03 class app20_9 extends Frame 04 { 05 static app20_9 frm=new app20_9(); public static void main(string args[]) 08 { 09 frm.settitle("polygon"); 10 frm.setsize(200,150); 11 frm.setvisible(true); 12 } public void paint(graphics g) 15 { 16 int x[]={44,65,97,139,58}; // 儲存所有頂點 x 座標的一維陣列 17 int y[]={34,55,40,109,127}; // 儲存所有頂點 y 座標的一維陣列 18 g.setcolor(color.pink); // 繪圖顏色設為粉紅色 19 g.fillpolygon(x,y,5); // 繪出多邊形, 並填滿粉紅色 20 g.setcolor(color.black); // 繪圖顏色設為黑色 21 g.drawpolygon(x,y,5); // 用黑色繪出多邊形 22 } 23 }

30 AWT 的繪圖會變色的小圓形 app20_10 是利用 paint() method 會自動被呼叫的特性, 呼叫亂數來改變視窗內 54 個小圓的顏色 01 // app20_10, 以不同顏色的小圓形鋪滿視窗 02 import java.awt.*; 03 class app20_10 extends Frame 04 { 05 static app20_10 frm=new app20_10(); public static void main(string args[]) 08 { 09 frm.settitle("random Color"); 10 frm.setsize(200,150); 11 frm.setvisible(true); 12 } public void paint(graphics g) 15 { 16 for(int x=10;x<=180;x=x+20) 17 for(int y=27;y<=140;y=y+20) 18 {

AWT 的繪圖 20-31 19 int red=(int)(math.random()*255); // 紅色的亂數 20 int green=(int)(math.random()*255); // 綠色的亂數 21 int blue=(int)(math.

31 AWT 的繪圖 int red=(int)(math.random()*255); // 紅色的亂數 20 int green=(int)(math.random()*255); // 綠色的亂數 21 int blue=(int)(math.random()*255); // 藍色的亂數 22 g.setcolor(new Color(red,green,blue)); // 設定顏色 23 g.filloval(x,y,15,15); // 用指定的顏色填滿小圓 24 } 25 } 26 } 程式執行的結果如下圖所示 :

32 AWT 的繪圖剪裁繪圖區 app20_11 是 setclip() method 的使用範例 01 // app20_11, 剪裁繪圖區 02 import java.awt.*; 03 public class app20_11 extends Frame 04 { 05 static app20_11 frm=new app20_11(); public static void main(string args[]) 08 { 09 frm.settitle("setclip()"); 10 frm.setsize(200,150); 11 frm.setvisible(true); 12 } public void paint(graphics g) 15 { 16 g.setclip(30,45,140,80); // 限定繪圖的顯示區域 17 for(int x=10;x<=180;x=x+20) 18 for(int y=27;y<=140;y=y+20) 19 { 20 int red=(int)(math.random()*255);

33 21 int green=(int)(math.random()*255); 22 int blue=(int)(math.random()*255); 23 g.setcolor(new Color(red,green,blue)); 24 g.filloval(x,y,15,15); 25 } 26 } 27 } AWT 的繪圖 20-33

34 AWT 的繪圖拖曳滑鼠繪圖 app20_12 是拖曳滑鼠繪圖的範例 01 // app20_12, 拖曳滑鼠繪圖 02 import java.awt.*; 03 import java.awt.event.*; 04 public class app20_12 extends Frame implements MouseMotionListener,MouseListener 05 { 06 static app20_12 frm=new app20_12(); 07 int x1,x2,y1,y2; 08 public static void main(string args[]) 09 { 10 frm.settitle("free drawing"); 11 frm.setsize(200,150); 12 frm.addmouselistener(frm); // 設定 MouseListener 13 frm.addmousemotionlistener(frm);// 設定 MouseMotionListener 14 frm.setvisible(true); 15 } 16 public void mousepressed(mouseevent e) 17 { 18 x1=e.getx(); // 取得滑鼠按下時的 x 座標 ( 繪圖起始點的 x 座標 ) 19 y1=e.gety(); // 取得滑鼠按下時的 y 座標 ( 繪圖起始點的 y 座標 ) 20 }

AWT 的繪圖 20-35 21 public void mousedragged(mouseevent e) 22 { 23 Graphics g=getgraphics(); 24 x2=e.getx(); // 取得拖曳滑鼠時的 x 座標 25 y2=e.gety(); // 取得拖曳滑鼠時的 y 座標 26 g.

35 AWT 的繪圖 public void mousedragged(mouseevent e) 22 { 23 Graphics g=getgraphics(); 24 x2=e.getx(); // 取得拖曳滑鼠時的 x 座標 25 y2=e.gety(); // 取得拖曳滑鼠時的 y 座標 26 g.drawline(x1,y1,x2,y2); // 繪出 (x1,y1) 到 (x2,y2) 的連線 27 x1=x2; // 更新繪圖起始點的 x 座標 28 y1=y2; // 更新繪圖起始點的 y 座標 29 } 30 public void mousemoved(mouseevent e){} 31 public void mousereleased(mouseevent e){} 32 public void mouseentered(mouseevent e){} 33 public void mouseexited(mouseevent e){} 34 public void mouseclicked(mouseevent e){} 35 }

36 AWT 的繪圖拖曳滑鼠時產生的軌跡, 可由下圖來說明 : 拖曳滑鼠時產生的軌跡鬆開滑鼠左鍵 (x 2,y 2 ) 按下滑鼠左鍵 (x 1,y 1 )

37 AWT 的繪圖用滑鼠移動幾何圖形 app20_13 是利用滑鼠移動圓形的範例 01 // app20_13, 利用滑鼠移動圓形 02 import java.awt.*; 03 import java.awt.event.*; 04 public class app20_13 extends Frame implements MouseMotionListener,MouseListener 05 { 06 static app20_13 frm=new app20_13(); 07 int x=70,y=60,posx=70,posy=60,dx,dy; 08 public static void main(string args[]) 09 { 10 frm.settitle("dragging a circle"); 11 frm.setsize(200,150); 12 frm.addmouselistener(frm); 13 frm.addmousemotionlistener(frm); 14 frm.setvisible(true); 15 } 16 public void mousepressed(mouseevent e) 17 { 18 dx=e.getx()-posx; // 取得滑鼠按下之點與基準點 x 方向的距離 19 dy=e.gety()-posy; // 取得滑鼠按下之點與基準點 y 方向的距離 20 }

38 AWT 的繪圖 public void mousedragged(mouseevent e) 22 { 23 x=e.getx()-dx; // 取得拖曳時的基準點 x 座標 24 y=e.gety()-dy; // 取得拖曳時的基準點 y 座標 25 if(dx>0 && dx<50 && dy>0 && dy<50) // 如果指標落在正方形區域內 26 { 27 Graphics g=getgraphics(); 28 update(g); // 清空畫面為背景顏色, 再呼叫 paint() 29 } 30 } 31 public void paint(graphics g) 32 { 33 g.setcolor(color.pink); // 設定繪圖顏色為粉紅 34 g.filloval(x,y,50,50); // 以基準點為圖形的左上角繪出圓形 35 posx=x; // 更新基準點的 x 座標 36 posy=y; // 更新基準點的 y 座標 37 } 38 public void mousemoved(mouseevent e){} 39 public void mousereleased(mouseevent e){} 40 public void mouseentered(mouseevent e){} 41 public void mouseexited(mouseevent e){} 42 public void mouseclicked(mouseevent e){} 43 }

AWT 的繪圖 20-39 app20_13 的執行結果如下 : 拖曳滑鼠即可移動小圓基準點座標的計算方式, 可以參考下圖的解說 : 基準點

39 AWT 的繪圖 app20_13 的執行結果如下 : 拖曳滑鼠即可移動小圓基準點座標的計算方式, 可以參考下圖的解說 : 基準點 (posx, posy) dx 基準點 dy (x,y) dx dy (e.getx(), e.gety()) (e.getx(), e.gety())

40 AWT 的繪圖 20-40

Microsoft PowerPoint - ch03

Microsoft PowerPoint - ch03 第三章基礎繪圖 (Basic Graphics) 3 1 簡介 3 2 Graphics Class 3 3 3 直線繪製 3 4 長方形繪製 3 5 橢圓形繪製 3 6 弧線繪製 3 7 多邊形繪製 3 8 圖形剪裁 3 9 圖形複製 3 10 習題 (Exercises) 3 1 簡介在基礎圖文繪製上, 除了前章所探討的文字繪製之外, 本章將介紹基礎圖形之繪製類別 Graphics 提供了各類圖形之繪製方法程序,