07Java視窗程式設計基礎.pdf

全文

(1)Java 視窗程式設計基礎王元俊 Wang Yuan-Jiun [email protected] 1.

(2) 學習目標 • 安裝 NetBeans IDE • 使用 NetBeans 開發命令列程式 HelloNetBeans – 編輯程式 – 執行程式 – 產生佈署程式與執行 • 使用 NetBeans 開發視窗程式 HelloWindow – 視窗元件 JFrame – 標籤元件 JLabel – 按鈕元件 JButton – 文字欄位元件 JTextField 2.

(3) 3.

(4) 4.

(5) 安裝 NetBeans IDE (1) • 下載 NetBeans IDE：https://netbeans.org/. 5.

(6) 安裝 NetBeans IDE (2) • 下載 Java SE （或 All）. 6.

(7) 安裝 NetBeans IDE (3). 預設安裝目錄 C:\Program Files\NetBeans 8.1. 7.

(8) 開啟 NetBeans IDE. New Project. 8.

(9) New Project. 9.

(10) New Java Application • 專案名稱 (Project Name)：HelloNetBeans • 專案目錄 (Project Location)：C:\MyJava. 勾選. 10.

(11) Hello NetBeans. 11.

(12) 執行（測試）. 執行. 執行結果 12.

(13) Fix Imports • 加上程式碼 Scanner stdin = new Scanner(System.in); • 按滑鼠右鍵，選單中選取「Fix Imports」。. 13.

(14) import java.util.Scanner;. 執行 Fix Imports，系統會自動加入。. 14.

(15) 練習 1. 接續以上 HelloNetBeans 程式，讓使用者輸入名字，並且印出。執行結果如下。. 註：此處若輸入中文，因編碼問題，顯示亂碼。. 15.

(16) 建立執行程式佈署檔建立佈署檔. 16.

(17) 專案目錄. • dist 目錄（執行程式佈署檔） – 檔案 HelloNetBeans.jar • src 目錄（原始程式檔） – 檔案 hellonetbeans\HelloNetBeans.java. 17.

(18) 執行 .jar 檔案 • 若是視窗程式，在檔案總管中直接點選滑鼠左鍵 2 下，即可執行。 • 若是命令列程式，執行方式如下：. 可輸入中文字. 18.

(19) 第一個視窗程式 (1) • HelloWindow：New Project → New Java Application – Create Main Class 前面的勾選取消. 不要勾選. 19.

(20) 第一個視窗程式 (2) • 視窗元件 JFrame：點選 HelloWindow，按滑鼠右鍵，如下圖。選取 New → JFrame Form…。. • 在 New JFrame Form 視窗中可設定 Class Name 與 Package，按下 Finish。本範例中使用系統預設值。 20.

(21) NetBeans IDE 視窗說明. 專案視窗. 編排版面. Swing 元件. 編輯程式導覽器. 屬性視窗 21.

(22) 第一個視窗程式 (3) • 點選 JFrame，修改 title 屬性為「我的第一個 Java 視窗程式」。 • 標籤元件 JLabel：在 JFrame，放上一個 Label (jLabel1)，修改 text 屬性為「Hello! Window.」。 • 調整元件的大小與顯示字型大小（font 屬性）。 • 按下 Preview Design，可顯示執行時的視窗畫面。. 22.

(23) 第一個視窗程式 (4) • 執行專案 HelloWindow. – （上圖）點選 Run Project 圖示，在 Run Project 視窗（下圖）中選取 main class，按 OK 按鈕。. 23.

(24) 第一個視窗程式 (4) 繼續完成專案 HelloWindow： 1. Label 最初顯示「Hello! Window.」。 2. 按一下 Button，顯示中文「嗨！視窗。」，再按一下，顯示「Hello! Window.」，再按一下，又再顯示中文「嗨！視窗。」。 3. 也就是按 Button 交替顯示中、英文內容。 4. 當顯示中文時，按鈕上的文字顯示「Display English」，顯示英文時，按鈕上的文字則顯示「顯示中文」。. 24.

(25) 版面設定 (Layout) • 初學者建議設定版面為 Null Layout，能夠以直觀的方式操作編排版面。 • 在 Frame 元件上點選滑鼠右鍵，如下圖操作。. 25.

(26) 設定視窗尺寸 • 點選 JFrame，Properties 視窗如下：. 最小的尺寸. 26.

(27) 第一個視窗程式 (5) • 按鈕元件 JButton：在 JFrame 放上一個 Button (jButton1)，修改 text 屬性為「顯示中文」。 • 調整元件的大小與顯示字型大小（font 屬性）。 • （設定按鈕事件）點選 jButton1，在 Properties 視窗選取「Events」，如下圖。. 27.

(28) 第一個視窗程式 (6) • 點選 actionPerformed 項目的 jButton1ActionPerformed，開啟 Source，撰寫程式。 – 新增一個實例變數 flag，程式碼 private Boolean flag = true; – 函數 jButton1ActionPerformed() 如下頁。. 28.

(29) 第一個視窗程式 (7) private void jButton1ActionPerformed(java.awt.event.ActionEvent evt) { if (flag == true) { flag = false; jLabel1.setText("嗨！視窗。"); jButton1.setText("Display English"); } else { flag = true; jLabel1.setText("Hello! Window."); jButton1.setText("顯示中文"); } }. • Run Project，快速鍵 F6。 • （佈署，製作 .jar檔案）Clean and Build Project，快速鍵 Shift + F11。 29.

(30) 範例：使用文字欄位輸入資料 • 專案名稱：ForLoop • 說明：利用 Text Field 輸入數字，並且以 for 迴圈進行加總計算。 • 視窗元件配置：. • 功能：使用者在 Text Field 輸入數字，依照對應的數字，以迴圈計算加總結果並且顯示。 30.

(31) ForLoop 專案 (1) • 操作步驟： 1. 如上頁圖配置，放置 Label 元件顯示文字，三個 Text Field 元件讓使用者輸入。使用者按下 Button 後執行計算。 2. Button 觸發事件的程式如下： private void jButton1ActionPerformed(java.awt.event.ActionEvent evt) { int n1, n2, n3, sum, i; n1 = Integer.parseInt(jTextField1.getText()); n2 = Integer.parseInt(jTextField2.getText()); n3 = Integer.parseInt(jTextField3.getText()); sum = 0; for (i = n1; i <= n2; i = i + n3) { sum += i; } jLabel5.setText(String.valueOf(sum)); } 31.

(32) ForLoop 專案 (2) • 執行結果如下：. 32.

(33) 練習 2. 仿照 HelloWindow 專案的設計原理，撰寫一個計數器程式。 • 視窗元件配置：. • 功能：視窗內有兩個按鈕，其中一個功能為計數歸零；另一個每按一下計數增加 1，計數值以一個標籤元件顯示。 33.

(34) 練習 3. 接續範例 ForLoop 專案，增加一個清除 Button，功能是按下後將三個 Text Field 元件的內容清除為空白。. 34.

(35) 練習 4. 兩個整數加法練習。 • 視窗元件配置：. • 功能： 1. 使用者按下「開始」按鈕，以亂數自動產生並且顯示兩個兩位數的整數。 2. 使用者輸入答案，若是計算答案正確，顯示「答對了，按「開始」鍵再來一題。」，使用者按下開始，重複步驟 1；若是答案錯誤，顯示「算錯了，再試試看。」。 35.

(36) 練習 • 練習 4 執行結果. 36.

(37) 練習 5. 修改練習 4 的程式成為「兩個整數加減法」。 – 也就是按下「開始」時，讓「+」號可以隨機為「+」或「」。 – 計算則依照此符號為加法或減法計算。. 37.

(38)