gui.java 可以在教材講義區下載
GUI programming 工作:
(1) new 出窗與 Panel 等零件 (阿就是像小時候在做 "勞作" 啦!)
(2) 必要時 setLayout( LayoutManager ); 改變 add 方式
(3) 用 add(other); 或 add(other, "North"); 等加入圖形元件 (widget)
(4) 用 addXXXListener( someObject ); 指定監聽事件(event)
(5) 記得寫對應 XXX 事件的處理程式(例如 actionPerformed)
阿注意要 public 且函數與參數的 type 也都要寫正確!
例如 ActionListener 對應的處理程式是
public void actionPerformed(ActionEvent eee);
那該處理程式所屬的 class 就必須 implements ActionListener
這 class 的物件就可以用來做 addActionListener( 該物件 ) 的參數!
若該 class 就是使用它的這個 class,
則這時參數用 this 就可, 就像這範例!
01 //gui.java -- GUI sample, @CopyLeft by tsaiwn@cs.nctu.edu.tw
02 //package ...; // 指定我這 class 的命名空間 namespace, 阿就是要放哪個目錄啦
03 import java.applet.*;
04 import java.awt.*;
05 import java.awt.event.*;
06 // 注意要寫 public class 不然 Applet 有問題
07 public class gui extends Applet implements ActionListener { // 我就是 Applet
08 Panel ppp; Button bbb; TextArea tt; TextField tx;
09 public static void main(String gg[ ]) {
10 Frame f = new Frame("Windows 2011");
11 gui me = new gui( ); // 模仿 Applet ..
12 me.init( ); me.start( ); // ..
13 f.add(me, "Center"); // 把 Applet (me) 放入窗 f 內
14 f.setSize(580, 520); // Frame 是 Window, 用 BorderLayout
15 f.setVisible(true); // f.show( );
16 } // main(
17 public gui( ) { } // Constructor; 注意要寫 public 不然 Applet 有問題
18 public void init( ) {
19 ppp = new Panel( ); tx=new TextField("你可以在這打字", 38);
20 bbb = new Button(" empty "); ppp.add(bbb);
21 bbb.setSize(168, 120); bbb.setFont(new Font("標楷體",36,36));
22 setLayout(new BorderLayout( ) ); // change Layout Manager 擺設經理
23 // 因為 Applet 是 Panel, 其 default Layout Manager 是 FlowLayout
24 ppp.setBackground(Color.pink);
25 tt = new TextArea("Hahaha\n", 5,20,TextArea.SCROLLBARS_BOTH);
26 add(ppp, "North"); add(tt, "Center");
27 tt.setFont(new Font("Ariel",32,32));
28 Panel pn = new Panel( ); Panel ptt=new Panel( );
29 Panel pOut = new Panel( ); pOut.setLayout(new BorderLayout( ));
30 pOut.add(pn, "South"); // pn 塞在 pOut 這 Panel 內 :-) 木板上再放木板!
31 pOut.add(ptt,"North"); // pOut 內塞兩個 Panel : pn, ptt
32 ptt.add(new Button("請在右邊打字: ")); ptt.add(tx);
33 pn.setBackground(Color.yellow); tx.setFont(new Font("標楷體",16,16));
34 bt = new Button[98]; // 只會生出 98 個參考 (阿其實就是 C++ 的指標啦)
35 for(int i=1; i< bMsg.length; ++i) {
36 bt[i] = new Button(bMsg[i]); // 真正生出六個 Button (注意 0 故意不用)
37 pn.add(bt[i]); bt[i].setFont(new Font("細明體",16,16));
38 bt[i].addActionListener(this); // 請求監聽 "動作事件"(ActionEvent)
39 } // for int i
40 add(pOut, "South"); // 把 pOut 塞入我這個 Applet 南邊
41 bt[3].setForeground(Color.red); validate( ); //
42 } // init(
43 Button bt[ ]; // 宣告說 bt[ ] 是 Button 陣列 (array)
44 String bMsg[ ] = {"000", "Bt001", "btBBB",
45 "哈哈哈會讀輸入", "bt西西", "BT五", "六 六 大順 囉", "Bye" };
46 int kk = 0; // Global variable to this class
47 public void paint(Graphics g) {
48 System.out.println(" Paint kk = " + kk++);
49 // do drawing something ...
50 validate( ); //
51 } // paint(
52 ////// ==================================================
53 public void actionPerformed(ActionEvent e) {
54 Object what = e.getSource( ); // 誰被按了一下 ?
55 String gg = "You press " + e.getActionCommand( );
56 if(what == bt[7]) System.exit(0);
57 if(what == bt[1]) ppp.setBackground(Color.red);
58 if(what == bt[6]) { ppp.setBackground(Color.green);
59 tt.append("如果 林志玲 來演講, 你會去聽嗎? "); } // if
60 bbb.setLabel(gg); tt.append(gg+"\n");
61 if(what == bt[3]) { tt.append("讀到 " + tx.getText( ) + "\n");
62 ppp.setBackground(Color.gray); }
63 repaint( ); // 會偷叫 update(Graphics);
64 } // actionPerformed(
65 public void start( ) { System.out.println(" start kk = " + kk++);
66 super.start( ); }
67 public void update(Graphics g) { // 只是看看何時會跑過來這
68 System.out.println(" update ==> kk = " + kk++);
69 super.update(g); // 叫用上層(super class)的 update( )
70 } // update( will called by repaint( )
71 } // class
Hint to test gui.java (至少要這樣測試才會進步!)
1. 先編譯並執行, 到處按按, 或在可打字的格子內打打字然後再按紅色按鈕, ...
對照 gui.java 看各種變化的 scenario (情境)
結束執行後建立一個檔案 yyy.htm 內容如下
<applet code=gui width=580 height=520>
2. 在 CMD 窗打入 yyy.htm 重新測試看看
把 Java Console (Java 主控台) 想辦法叫出來觀看裡面印出的訊息
記得要抓住主控台到處亂動看看
3. 接下來要想辦法使得點按上方的看板(其實是Button)會有反應!
簡單一點, 弄成每點按一下就變看板上字體的顏色(前景色)就好..
先寫個仿照 C 程式庫 int rand( ) 來亂 .. 阿不是, 我是說.. 來用
找個適當的地方塞 入以下 function:
int rand( ) { return (int) (32768* Math.random( ) ); }
4. 為了每次點按會變顏色, 弄個 顏色的 array 備用,
還要有個整數(也要 Global)來記住目前是哪種顏色
所以, 在 class 內函數外面弄個 Color 的 array 常數, 各函數都看得到(Global)
(建議寫在整個 class 最後比較好找, 就是 class 最後那大括號之前!)
這顏色 array 先用三個元素存放三種 Color, 這樣 yyc[i] 就是第 i 種顏色!
再來寫個整數變數 int cid 設初始值 0 代表目前是第 0 種顏色:
Color yyc[ ] = { Color.red, Color.green, Color.blue };
int cid = 0;
5. 註冊監控事件: 把 bbb 設定說要監控 ActionEvent,
在 bbb 生出之後任何地方加入以下這句:
bbb.addActionListener(this); // // // new
如此一來當 bbb 被點按後, 系統也會調用 actionPerformed( ) 這函數
6. 在 actionPerformed ( ) 內加入處理 bbb 被按下時要做的事,
a. 先把 cid 加 1 並取餘數, 確保範圍在 0.. yyc.length - 1
b. 把 bbb 的前景色 (字的顏色啦) 改為 yyc[cid]
c. return 以免做到其他事
if(what == bbb) {
cid = (cid+1) % yyc.length; // 注意 array 的 length 是變數
bbb.setForeground( yyc[cid] ); // 前景色英文 Foreground 是一字
return; // 測試過後可以把這 return 弄掉再測試看看
}
7. 可以重新編譯 並 執行你的程式了 ! 注意要連續點按上方看板觀察顏色變化
8. 結束程式之後, 找到剛剛加入的 yyc[ ],
在 Color.blue 後面加入以下使得有四個顏色: (別忘了逗點)
, Color.pink
9. 好了, 可以再重新編譯 並 執行你的程式了 !
怎麼知道 Color. 後面可以寫啥顏色呢? 簡單, 查 Java API 或是在 CMD 窗打入:
javap java.awt.Color ( 注意大小寫 !)
那麼少顏色, 要別的顏色怎辦? 也是簡單, new 一個 Color 來用就好:
在 Color.blue 後面加入 ,new Color(198,222,66)
存檔後再重新編譯 並 執行看看, 記得要連續點按上面看板觀看看板上字體顏色變化!
以上這些建議的修改已經改好放到 gui2.java 內