Java Desktop Application #5

งานนำเสนอเรื่อง: "Java Desktop Application #5"— ใบสำเนางานนำเสนอ:

1 Java Desktop Application #5
โปรแกรมคำนวณ และการใช้งาน jList , jRadioButton ใน NetBean 6.0 & swing set โดย อ. นัฐพงศ์ ส่งเนียม

2 ออกแบบหน้าจอโปรแกรม ดังรูป
หลักการทำงาน โปรแกรมที่ผ่านมามีการคำนวณพื้นที่ต่าง ๆ โดยใช้การเลือกการคำนวณค่าจาก ComboBox ค่าการคำนวณ จาก ComboBox แล้ว ก็ ป้อนข้อมูลที่จำเป็นจากนั้นก็ กด ปุ่ม OK แล้วโปรแกรมจะทำการคำนวณ และแสดง ผลลัพธ์ ออกมา ดังรูป แต่สำหรับโปรแกรมครั้งนี้จะแนะนำเครื่องมือตัวใหม่ อีก ดังนี้คือ jList jRadioButton jButtonGroup jPanel ButtonGroup

3

4 สร้าง โปรเจ็กต์ใหม่ ไปที่เมนู File เลือก New Project
เลือก Java Desktop Application กำหนดชื่อโปรเจ็กต์เป็น desktop_app5

5 control ต่าง ๆที่ใช้สำหรับโปรแกรมนี้
jLabel jTextField jButton jList jRadioButton jButtonGroup jPanel jOptionPane

6 ออกแบบหน้าจอโปรแกรม jLabel jTextField jList

7 ออกแบบหน้าจอโปรแกรม (ต่อ…)
Button jPanel jRadioButton

8 การแทรก jList เข้ามาใน jFrame
สามารถทำได้ดังนี้ ที่หน้าต่าง Swing เลือก Swing Control เลือกเครื่องมือ List ทำการ Drage mouse มาวางบน Frame แล้วปล่อย mouse ปรับขนาดของ List ตามต้องการ ดัง ต.ย. ในรูปข้างล่างนี้

9 การกำหนดคุณสมบัติของ jList1
- model :: ใช้สำหรับกำหนด/เพิ่ม รายการที่อยู่ใน jList1 - selectedItem :: สำหรับแสดงรายการที่ถูกเลือกจากรายการทั้งหมดที่อยู่ใน model การกำหนดคุณสมบัติ สามารถทำได้ดังนี้ Click เลือกที่ jList1 ในหน้าต่าง Properties ให้ เลือก model จะปรากฏหน้าต่างในการเพิ่มรายการ หากเราต้องการ สามารถเพิ่มรายการของเรา ก็สามารถพิมพ์ลงในช่อง item แล้วก็กด ปุ่ม add ดังตัวอย่างในรูป หมายเหตุ ในที่นี้เราไม่ต้องกำหนด ค่าใด เนื่องจาก ต้องการเขียนโปรแกรมเพิ่มเข้าไปที่หลัง

10 การแทรกและใช้งาน jPanel
jPanel เป็นเครื่องมือที่ใช้สำหรับ จัดวางกลุ่มของ ออบเจ็กต์ต่างบนหน้าจอให้เป็นระเบียบเรียบร้อย ในที่นี้เราต้องการจัดกลุ่มของ jRadioButton ซึ่งสามารถทำได้ดังนี้ ที่หน้าต่าง Swing เลือก Swing Containers เลือกเครื่องมือ Panel ทำการ Drage mouse มาวางบน Frame แล้วปล่อย mouse ปรับขนาดของ Panel ตามต้องการ ดัง ต.ย. ในรูปข้างล่างนี้

11 การกำหนดคุณสมบัติ Border ของ jPanel
วิธีทำ คลิกเมาส์เลือกที่ Panel ที่ต้องการ ในหน้าต่าง Properties เลือก เลือก Border แล้วจะได้ หน้าต่างดังรูป ให้คลิกเมาส์เลือกรูปแบบที่ต้องการแต่ในที่นี้ ให้เลือก เป็นแบบ TitleBorder ผลลัพธ์จะได้ดังรูปข้างล่าง

12 การแทรกและใช้งาน jRadioButton
สามารถทำได้ดังนี้ ที่หน้าต่าง Swing เลือก Swing Control เลือกเครื่องมือ RadioButton ทำการ Drage mouse มาวางบน jPanel แล้วปล่อย mouse ปรับขนาดของ jRadioButton ตามต้องการ ดัง ต.ย. ในรูปข้างล่างนี้ ในที่นี้ให้ เพิ่ม jRadioButton ทั้งหมด 5 ครั้งดังรูป

13 คุณสมบัติที่สำคัญของ RadioButton
Text ใช้สำหรับกำหนดข้อความบน RadioButton ButtonGroup ใช้สำหรับจัดกลุ่มของ RadioButton หากเราต้องการจัดกลุ่มของ RadioButton ทุกตัวให้อยู่ในกลุ่มเดียวกัน ต้อง แทรก ButtonGroup จาก palleteมาบนหน้าจอ ก่อน แล้ว กำหนด Properties ButtonGroup ให้เป็น ButtonGroup1

14 Code ในปุ่ม btnOK การเข้าไปเขียนคำสั่งในเหตุการณ์ btnOKMouseClicked ทำได้ดังนี้ Click ขวาที่ jButton1 เลือก Event เลือก mouse เลือก mouseclick เขียนคำสั่งในหน้าถัดไป

15 โค้ดในปุ่ม btnOK private void btnOKMouseClicked(java.awt.event.MouseEvent evt) { // TODO add your handling code here: lstModel = new DefaultListModel(); if(jRadioButton1.isSelected() ) { int n = Integer.parseInt(txtNumber.getText()); for(int i = 1;i<=n;i++) { if(i % 2 == 0) { } else { lstModel.addElement(i); } lst1.setModel(lstModel); } else if (jRadioButton2.isSelected() ) { jOptionPane1.showMessageDialog(null,"กรุณาเลือกรายการที่ต้องการคำนวณก่อน ค่ะ"); } }

16 Code ในปุ่ม btnRemove การเข้าไปเขียนคำสั่งในเหตุการณ์ jButton2MouseClicked ทำได้ดังนี้ Click ขวาที่ jButton2 เลือก Event เลือก mouse เลือก mouseclick private void btnRemoveMouseClicked(java.awt.event.MouseEvent evt) { // TODO add your handling code here: if(lst1.getSelectedIndex() != -1) { // ถ้าเลือก รายการใดก็ให้ ลบเฉพาะรายการนั้น ๆ lstModel.remove(lst1.getSelectedIndex()); } else{ // ถ้าไม่ได้ เลือก รายการใด ๆ เลย ให้ ลบทั้งหมด lstModel.clear(); }

17 Code ในปุ่ม btnExit การเข้าไปเขียนคำสั่งในเหตุการณ์ jButton3MouseClicked ทำได้ดังนี้ Click ขวาที่ jButton3 เลือก Event เลือก mouse เลือก mouseclick เขียนคำสั่งในหน้า ถัดไป

18 Code ในปุ่ม Exit private void btnExitMouseClicked(java.awt.event.MouseEvent evt) { // TODO add your handling code here: String[] choices = {"Yes", "No", "Quit"}; int response = jOptionPane1.showOptionDialog( null // Center in window. , "คุณต้องการออกจากโปรแกรมหรือไม่ ?" // Message , "MyTitle" // Title in titlebar , jOptionPane1.YES_NO_OPTION // Option type , jOptionPane1.PLAIN_MESSAGE // messageType , null // Icon (none) , choices // Button text as above. , "None of your business" // Default button's label ); switch (response) { case 0: break; case 1: case 2: System.exit(0); // It would be better to exit loop, but... case -1: //... Both the quit button (3) and the close box(-1) handled here. default: //... If we get here, something is wrong. Defensive programming. jOptionPane1.showMessageDialog(null, "Unexpected response "); }

19 อธิบายคำสั่งที่สำคัญ :: การแสดงข้อความใน jLabel
หากเราต้องการพิมพ์ข้อความไปที่ Label ใด ๆ ก็ใช้ method setText() ดัง ตัวอย่าง ถ้าต้องการพิมพ์ คำว่า “Hello” ใน jLabel1 ก็เขียนคำสั่งได้ ดังนี้ ถ้าหากข้อความที่ต้องการแสดงนั้นเป็นค่าจากตัวแปร ก็ ไม่ต้องใส่เครื่องหมาย “” ดังตัวอย่าง jLabel1.setText(“Hello”); String str = “Hello”; jLabel1.setText(str);

20 การตรวจสอบการกดปุ่มของผู้ใช้
String[] choices = {"Yes", "No", "Quit"}; int response = jOptionPane1.showOptionDialog( null // Center in window. , "คุณต้องการออกจากโปรแกรมหรือไม่ ?" // Message , "MyTitle" // Title in titlebar , jOptionPane1.YES_NO_OPTION // Option type , jOptionPane1.PLAIN_MESSAGE // messageType , null // Icon (none) , choices // Button text as above. , "None of your business" // Default button's label ); switch (response) { case 0: break; case 1: case 2: System.exit(0); // It would be better to exit loop, but... case -1: default: jOptionPane1.showMessageDialog(null, "Unexpected response "); } ผลลัพธ์