2009年7月10日 星期五

JavaFX結合 JDBC, Servlet, Swing, Google Map及動態產生比例圖 (2):JavaFX建立及程式碼說明

推文
功能:同第一篇。

說明:就如同標題一樣,前端會用到JavaFX、Swing、Java Web Start、Google Map

的技術,後端就是JDBC、Servlet的技術,以及我們會簽署認證jar檔案,這

樣才可存取客戶端(ex:執行命令,存檔等等),以這樣的架構其實很容易就可

以讓我們開發各式各樣的系統,當然你得發揮你的創意,其中的一項重點就

是servlet與前端互傳的Serial物件,你可以將他寫入資料庫的欄位,這樣每

當你的客戶端需求有變動時,隨時可新增刪減欄位,不必還得在資料庫的表

格再新增或刪減一個或多個欄位,當然你存入資料庫的Serial物件的欄位必

須設定好足夠的空間(可用比較大型資料type如blob,clob等等或自訂type),

確實也以此架構幫公司設計了一些系統,覺得還不錯用,介紹給大家。


  1. 學習JavaFX Script語法的網址 http://java.sun.com/javafx/1/tutorials/core/

  2. 學習如何建立JavaFX GUI的網址 http://java.sun.com/javafx/1/tutorials/ui/

  3. 步驟1跟2是基礎,各位學JavaFX一定要先看。

  4. 下載 JavaFX 1.2 SDK,到網址

    http://javafx.com/downloads/windows.jsp


    選 JavaFX 1.2 SDK,下載及安裝。
  5. 在寫 javafx 前,我們要先下更新javafx 開發元件,選menu的Tools--->Plugins

    如下圖,點tab的Available Plugins,在search欄位打入javafx搜尋字,出現3

    個plugins,全選,然後按Install按鈕安裝


  6. 選meun,File-->New Project,如下圖,建置一個JavaFX Project,按Next鈕


如下圖,Project Name輸入jdbcfx,Project Location我的是C:\netbeans,其他預設即可,而

Create Main File我們輸入jdbcfx.fx.Main(多加個package name fx,為了好區分而已),這個

Main.fx檔是我們要Run這個jdbcfx Project時的主要啟動檔案,檔案名稱你可自己設,不一

定要Main.fx,不過我們這用預設即可,按Finish鈕


然後在將我附上的原始檔Main.fx全部覆蓋複製進來,此時會有錯誤,因為有些檔案還沒建

立,先忽略,之後再一步一步建立。

那要如何建立JavaFX的GUI呢?如下圖展開右邊Palette,選Swing Components的Button元

件,拉到TextEditor,我們在程式碼裡設一個變數button1,其type為SwingButton

(var button1:SwingButton =),將button元件拉到等號右邊,然後設定Button的text屬性及動

作的方法,各種元件的詳細操作使用方式,各位一定要先看完步驟1及2,才能了解如何去

使用它們。



如下圖,再建立JavaFX Class檔,File Name輸入FlipView,Package輸入jdbcfx.fx,

按Finish鈕




然後再將我附上的原始檔FlipView.fx複製進來即可。



  1. 接下來我們需要建立Swing GUI,由於我的GUI是由Eclipse IDE所建立,所以在這

    我們直接以建立Java Class方式複製進來,如下圖,當然你也可以選擇JPanel Form的

    方式建立Swing GUI,注意我們的Swing GUI必須是繼承自JComponent類別,才可

    用JavaFX API所提供的SwingComponent類別的方法wrap包裹進來,而JFrame不是

    ,所以無法用SwingComponent類別提供的方法,不過大部分的Swing GUI均可使用

    SwingComponent類別來轉換,所以JavaFX還是可以使用大部分的Swing GUI,

    如下圖:Class Name輸入MyJTableJP,Package輸入jdbcfx.java,按Finish鈕





    在將我附上的原始檔MyJTableJP.java複製進來即可。

  1. 以上的步驟只是要讓各位了解如何在JavaFX Project裡建javafx script檔及java檔,

    以及如何建JavaFX的GUI,注意要加入library,cos.jar前端傳送序列物件用,加入

    方式參考上一篇步驟8,我會附上我建的NetBeans Project,稍後各位只要使用

    NetBeans開啟project即可,如你要一步一步建檔,就請依照上列步驟建立。

  2. 程式碼說明:(這部分網頁顯示的有點亂,請參考下載文件)

    jdbcfx netbeans project 程式碼如下(包含package name)

    jdbcfx

    |--- fx

    \--- FlipView.fx

\--- Main.fx

|--- java

\--- MyJTableJP.java

\--- TableHelper.java

yj

|--- db

\--- MyDataSerial.java

\--- MyJTableJP_Model.java



salary netbeans project 程式碼如下(web project,包含 package name)

yj

|--- db

\--- MyDataSerial.java

\--- MyJTableJP_Model.java

|--- servlet

\--- DataIUS_Servlet.java

\--- GenGraphic_Servlet.java

\--- GenMapfile_Servlet.java

|--- dbutility

\--- DB_Utility.java



以上是兩個project程式碼的清單,底下在逐一說明各程式碼主要功能,但詳細說明

還是請參考程式碼的註解。



  1. jdbcfx project部分

    jdbcfx.fx.FlipView.fx:

    主要功能是讓我們動態產生的統計圖檔(長條圖跟圓餅圖),作翻轉切換。

    jdbcfx.fx.Main.fx:

    這是這整個程式的進入點,類似java application 的 main function。

    jdbcfx.java.MyJTableJP.java

    這是個swing component Jpanel,裡面有放入JTable,這樣我們才可輕而一舉的在

    javafx的script使用swingcomponent 的 wrap 方法將其轉成 SwingComponent type

    的元件。

    jdbcfx.java.TableHelper.java:

    主要功能是讓我們可以在javafx script建立MyJTableJP的type的物件。



yj.db.MyDataSerial.java:

這是我們前後端傳送的 serial 物件。

yj.db.MyJTableJP_Model.java:

這是MyJTableJP裡的JTable所用的TableModel。

salary web project部分

yj.db.MyDataSerial.java:

同上。

yj.db.MyJTableJP_Model.java:

同上。

yj.db.servlet.DataIUS_Servlet.java

主要功能為對資料庫資料表作新增刪除修改的動作。

yj.db.servlet.GenGraphic_Servlet.java

主要產生長條圖跟圓餅圖檔(bar.png,pie.png)。

yj.db.servlet.GenMapfile_Servlet.java

主要是動態產生Googel Map的相對應員工家地址的地圖html檔。


yj.db.servlet.dbutility.DB_Utility.java

jdbc的設定檔,這支程式是針對SQL Server 2000,如果你的是其他DataBase Server,

請參考其他相關db server jdbc的設定。

下一篇將介紹部署及應用,未完待續~~~

本篇教學文件下載

2009年7月8日 星期三

JavaFX結合 JDBC, Servlet, Swing, Google Map及動態產生比例圖 (1):NetBeans 寫 Servlet

推文

功能:這支程式的主要功能是將 javafx 與 swing 的結合,以 JDBC、Servlet的技術

存取(新增刪除修改查詢)後端資料庫,而前端以 javafx 結合 JTable 來呈現,

以及顯示動態查詢後的結果來產生"部門所佔薪資比例長條圖、圓餅圖",而

由前端的 JTable 裡選擇 row 可產生到該員工家的Google地圖。



說明:建議JavaFX應用程式的撰寫開發工具還是以 NetBeans 為主,Sun自家的開發工

具對 JavaFX 支援還是比較好用,而eclipse的plugin雖然1.2版已支援了 Code

Completion 但對在 javafx script 裡引入 Java API 還是有些問題。

本主題共有三篇,相關檔案會在第三篇放上,

我會以 NetBeans 建兩個專案,一個是 Web Servlet,另一個專案是JavaFX應用程

式的專案,所以第一部分我會先介紹 NetBeans 寫 Servlet。


  1. 先下載工具 NetBeans IDE 6.5.1

    http://www.netbeans.org/downloads/6.5.1/

    這個頁面也會有其他不同功能的下載版本,我們選擇
    Java的版本,而 JavaFX我們

    第二篇介紹 JavaFX 時,再用更新方式update,因為這篇主要介紹開發 Servlet。

    注意:你電腦須先裝 JDK 6 Update 13 以上版本 ,如沒有到底下網址下載

    http://java.sun.com/javase/downloads/index.jsp

  2. 下載 Application Server,Tomcat Server 6.0.18 版

    http://archive.apache.org/dist/tomcat/tomcat-6/v6.0.18/bin/apache-tomcat-6.0.18.zip

    我是解壓縮到 C:\apache-tomcat-6.0.18

  3. 如圖選 menu,File-->New Project

    如下圖,選 Java Web,Web Application,按 Next 按鈕

    如下圖,Project Name輸入 salary,Project Location 指定你要放置專案的目錄,我放在目錄

    C:\netbeansprj,按 Next 按鈕

    1. 如下圖加入 Tomcat Server,按 Add 按鈕

    如下圖,選 Tomcat6.0,按 Next 按鈕

    如下圖選擇我們在步驟2解壓的目錄 C:\apache-tomcat-6.0.18

    Username,Password請自行輸入管理員的帳號密碼(隨你喜歡,如無會依你輸入建立),

    這帳號可以管理 Web Application 的 start ,stop, reload, undeploy,按 Finish鈕

    再按 一次 Finish 鈕


    1. 產生了 salary project,以及預設會幫我們建立index.jsp檔,如下圖


    如下圖,點 salary 按右鍵 Run

    會啟動Tomcat server,及瀏覽器自動開啟index.jsp(印出 Hello World!)

    1. 接下來就是建立 Servlet,點 salary 按右鍵 ---> New ---> Other跳出如下畫面,

      左邊 Categories選 Web,右邊 File Types 選 Servlet,按 Next 鈕


    如下圖 Class Name 輸入 HelloWorldServlet,Package 輸入 yj.servlet,按 Finish 鈕



    1. 將程式碼33行及42行的註解行移除,39行改成

      out.println("Hello World 這世界~~~");如下圖

      注意 NetBeans 的 Servlet範本的 doPost跟 doGet 方法均轉給 processRequest方法來

      處理,我們當然也可改範本,在munu的 Tools ---> Templates ---> Web 的 Servlet,

      即可更改。


    點左邊程式 HelloWorldServlet.java,按右鍵 Run File,會跳出框框如下圖

    這是問你要不要加參數,我們只是印 Hello World 而已,所以直接按 OK 鈕即可,此時可看

    到瀏覽器自動開啟(印出 Hello World 這世界~~~) ,即表成功建立 HelloWorldServet。


    1. 接下來重複步驟6建立三個 Servlet 檔案,Class Name 輸入

      DataIUS_Servlet、GenGraphic_Servlet、GenMapfile_Servlet,

      Package 輸入 yj.servlet,然後將我附上的各 java 原始檔複製進來,以及會用到的lib

      JDBC(for SQL Server 2000):jtds-1.2.jar,

      JfreeChart:jfreechart-1.0.12.jar、jcommon-1.0.15.jar,(繪長條圖及圓餅圖用)

      設定進開發環境裡,如下圖選salary按右鍵選Properties,選Libraries按

      Add JAR/Folder鈕,將lib jar檔加進來


      相關檔案的功能作用我會在下篇用到時介紹,java 原始碼也會有註解說明,

      這步驟你可以省略,因我會提供我的netbeans project壓縮檔給各位,你只要用

      NetBeans IDE開啟即可,lib會自動加進來。


    1. Web application的部署:

      我的這個salary project是放在目錄C:\netbeansprj底下,所以在

      C:\netbeansprj\salary\dist 目錄下會有 salary.war,如果這檔案不是最新的,請在執行

      Built 或者是 Clean and Build 以產生更新的 war 檔,如下圖


    然後再將你的 salary.war 檔案複製到你要對外開放的 Tomcat Server的目錄,我的是

    C:\Tomcat602\webapps底下,如有啟動 Tomcat Server 會自動產生目錄 salay,我的電腦是裝

    兩個Tomcat Server,一個給 NetBeans 開發用,如步驟4,另一個是對外開放發佈用,但請

    注意兩個Tomcat Server 的幾個 port 要設成不一樣,請將其中一個 Tomcat Server更改

    C:\apache-tomcat-6.0.18\conf\server.xml檔案,找到如下內容:

    …...

    <server port="8005" shutdown="SHUTDOWN"> 預設 8005我改成 8006

    …...

    <connector connectiontimeout="20000" port="8080" protocol="HTTP/1.1" redirectport="8443"> 預設 8080改成 8081

    …...

    <connector port="8009" protocol="AJP/1.3" redirectport="8443">

    預設 8009 改成 8010

    這樣servlet的部份即完成,下一偏將介紹 JavaFX如何結合JDBC, Servlet, Swing,

    Google Map及動態產生比例圖,未完待續~~~

    本篇教學文件下載



可顯示或設定電腦自動開啟的程式 WhatInStartup v1.11

推文
簡介:(免費軟體、綠色軟體)

來源:http://www.nirsoft.net/

下載,中文化(只要把檔案解壓至程式執行目錄下即可)


這個工具會顯示你電腦開機後,自動開啟的程式,你可以用這個工具停用、
啟用、刪除(可複選)已選項目,你也可以看某程式執行命令列的語法,也可
以開啟登錄檔的路徑等等,簡單好用。

2009年7月6日 星期一

Active Ports 1.4 查看電腦的TCP/UDP port

推文
簡介:(免費軟體)

來源:http://www.devicelock.com/

下載


這是一個查看你電腦所有開啟的TCP/IP和UDP的port,以及是哪些應用程式使用了這些的port,

或是有遠端IP,連進來你的電腦使用了哪些port,這跟我介紹的 CurrPorts v1.66功能類似,

只是我覺得這個軟體介面比較簡潔好用,你可以點左下面按鈕 Query Names反查domain name,

或 Terminate Process 結束行程。