พัฒนาโปรแกรมด้วย BeanBox

          BeanBox  คือ โปรแกรมที่เราสามารถใช้พัฒนาโปรแกรมง่ายๆ โดยใช้ JavaBean ซึ่งสนับสนุนการพัฒนาโปรแกรมแบบ Component

โดยก่อนอื่นเราต้องทำการติดตั้ง BeanBox ลงที่เครื่องของเราก่อนครับ โดยเริ่มจาก
1. เข้าไปที่ http://sites.google.com/site/kmitlcomponentthai/home/relataed-links
2. Download ตัว BDK และ nmake
3. ทำการแตกไฟล์ BDK ไปไว้ใน Directory ที่ต้องการติดตั้งตัว BeanBox
***สำหรับผู้ที่มี JDK 1.4 ขึ้นไป ให้ท่านทำตามข้อ 4. ต่อไป
4.  ไปแก้ไขไฟล์ที่ชื่อ ExplicitButtonBeanInfo.java ใน beans\demo\sunw\demo\buttons โดยแก้ไขโค้ดที่ประมาณบรรทัดที่ 47 จาก

EventSetDescriptor push = new EventSetDescriptor(beanClass,

                    "actionPerformed",

            java.awt.event.ActionListener.class,

            "actionPerformed");

ไปเป็น  EventSetDescriptor push = new EventSetDescriptor(beanClass,

                    "action",

            java.awt.event.ActionListener.class,

            "actionPerformed");
5. แตกไฟล์ nmake ไปไว้ใน beans\demo ซึ่งอยู่ใน Directory เราติดตั้ง BeanBox ลงไป
6. เปิดไฟล์ nmake15.exe ที่ได้จากการแตกไฟล์ข้างต้น จะได้ไฟล์ nmake.exe ออกมา
7. เปิด Command Prompt เข้าไปใน Directory ที่เราติดตั้ง BeanBox ไว้ แล้วไปที่ beans\demo\ พิมพ์คำสั่ง nmake buttons.mk แล้วรอโปรแกรมทำงานเสร็จ เป็นอันเสร็จการติดตั้ง BeanBox

เริ่มต้นใช้ BeanBox

                วันนี้เราจะมาแสดงตัวอย่างง่ายๆ ในการใช้ BeanBox พัฒนาโปรแกรมครับ ซึ่งโปรแกรมที่จะนำมาแสดงเป็นตัวอย่าง คือ โปรแกรม Counter ครับ โดยเมื่อผู้ใช้กดปุ่ม Start ตัวโปรแกรมจะนับ counter เพิ่มที่ละ 1 ทุกๆ 1 วินาที เมื่อกดปุ่ม Stop ตัวโปรแกรมจะหยุดนับ และเมื่อกดปุ่ม Reset ค่า counter จะกลับมาเป็น 0

โดยตัว Counter Bean มีโค้ดดังนี้

package counter;

import java.awt.*;

public class Counter extends Canvas {

  private final static int XPAD = 10;

  private final static int YPAD = 10;

  private int count;

  private boolean operate;

  public Counter() {

    count = 0;

    operate = true;

  }

  public void reset() {

    count = 0;

    repaint();

  }

  public void start( ) {

    operate = true;

  }

  public void stop() {

    operate = false;

  }

  public synchronized void increment() {

    if(operate) {

      ++count;

      adjustSize();

      repaint();

    }

  }

  public void setFont(Font font) {

    super.setFont(font);

    adjustSize();

  }

  public Dimension getPreferredSize() {

    Graphics g = getGraphics();

    FontMetrics fm = g.getFontMetrics();

    int w = fm.stringWidth("" + count) + 2 * XPAD;

    int h = fm.getHeight() + 2 * YPAD;

    return new Dimension(w, h);

  }

  private void adjustSize() {

    Dimension d = getPreferredSize();

    setSize(d.width, d.height);

    Component parent = getParent();

    if(parent != null) {

      parent.invalidate();

      parent.doLayout();

    }

  }

  public void paint(Graphics g) {

    Dimension d = getSize();

    FontMetrics fm = g.getFontMetrics();

    int x = (d.width - fm.stringWidth("" + count))/2;

    int y = (d.height + fm.getMaxAscent() -

      fm.getMaxDescent())/2;

    g.drawString("" + count, x, y);

    g.drawRect(0, 0, d.width - 1, d.height - 1);

  }

}

โดยก่อนอื่น เราต้องทำการสร้าง JavaBean ชื่อ Counter เพื่อให้ BeanBox สามารถนำ component นี้ ไปใช้งานได้ เริ่มจาก
1. ให้ทำการ copy code ข้างต้น แล้ว save เป็นไฟล์ชื่อ Counter.java
2. Compile โดยใช้คำสั่ง javac –d . Counter.java ใน Command Prompt
3. สร้างไฟล์ Manifest โดย copy code 3 บรรทัดด้านล่าง แล้ว save เป็นไฟล์ชื่อ manifest.mf ใน Directory เดียวกับไฟล์ Counter.java

Main-Class: counter.Counter
Name: counter/Counter.class
Java-Bean: True

*** Manifest file ต้องเว้นบรรทัดสุดท้าย ให้เป็นบรรทัดว่าง โดยให้กดปุ่ม Enter 1 ครั้ง เพื่อให้บรรทัดสุดท้ายเป็นบรรทัดว่าง

4. สร้างไฟล์ Jar โดยใช้คำสั่ง jar –cfm Counter.jar manifest.mf .\counter\*.* ใน Command Prompt
5. เปิดโปรแกรม BeanBox โดยไปที่ Directory ที่ติดตั้ง BeanBox ไว้ beans\beanbox\run.bat
6. เมื่อเปิด BeanBox ขึ้นมาแล้วให้ไปที่ File->LoadJar… ดังภาพ

7. หลังจากนั้นให้เลือกไฟล์ Counter.jar ที่เราสร้างขึ้นในขั้นตอนที่ 4
เพียงเท่านี้ เราก็จะสามารถใช้ Counter Bean ใน BeanBox ได้แล้ว

ขั้นตอนต่อไปก็มาถึงการพัฒนาโปรแกรมด้วย BeanBox กันแล้วนะครับ โดย
1. ให้คลิกเลือกที่ counter แล้วคลิกอีกครั้งในหน้าต่าง BeanBox เพื่อวาง Counter  Bean ในตำแหน่งที่ต้องการ จะได้ดังภาพ

2. ให้คลิกเลือกที่ ExplicitButton แล้วคลิกอีกครั้งในหน้าต่าง BeanBox เพื่อวาง Button ในตำแหน่งที่ต้องการ แล้วเปลี่ยน Label เป็น Start จะได้ดังภาพ

3. ให้ทำตามข้อ 2 ซ้ำอีก 2 ครั้ง โดยเปลี่ยน Label เป็น Stop และ Reset ดังภาพ

4. คลิกที่ปุ่ม Start แล้วเลือก Edit->Events->button push->actionPerformed

5. เมื่อเลือกแล้วจะปรากฏเส้นสีแดง ให้คลิก counter bean จะปรากฏหน้าต่างขึ้นมาให้เลือก method start

6. ทำซ้ำข้อ 4 และ 5 กับปุ่ม Stop แล้วเลือก method stop และปุ่ม Reset แล้วเลือก method reset

7. คลิกเลือก TickTock แล้วคลิกอีกครั้งในหน้าต่าง BeanBox แล้วเปลี่ยน interval เป็น 1 เพื่อให้นับทุกๆ 1 วินาที

8. คลิกที่ TickTock ในหน้าต่าง BeanBox แล้วเลือก Edit->Events->propertyChange->propertyChange

9. เมื่อเลือกแล้วจะปรากฏเส้นสีแดง ให้คลิก counter bean จะปรากฏหน้าต่างขึ้นมาให้เลือก method increment

เพียงเท่านี้ เราก็จะได้โปรแกรม Counter ที่พัฒนามาจาก BeanBox แล้วครับ