2009年7月10日 星期五

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

推文
功能:同第一篇。

說明:就如同標題一樣,前端會用到JavaFXSwingJava Web StartGoogle Map

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

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

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

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

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

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

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

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


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

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

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

  4. 下載 JavaFX 1.2 SDK,到網址

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


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

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

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


  6. meunFile-->New Project,如下圖,建置一個JavaFX Project,按Next


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

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

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

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


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

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

那要如何建立JavaFXGUI?如下圖展開右邊Palette,選Swing ComponentsButton

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

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

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

使用它們。



如下圖,再建立JavaFX Class檔,File Name輸入FlipViewPackage輸入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輸入MyJTableJPPackage輸入jdbcfx.java,按Finish





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

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

    以及如何建JavaFXGUI注意要加入librarycos.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,這樣我們才可輕而一舉的在

    javafxscript使用swingcomponent wrap 方法將其轉成 SwingComponent type

    的元件。

    jdbcfx.java.TableHelper.java

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



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.pngpie.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 的結合,以 JDBCServlet的技術

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

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

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



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

具對 JavaFX 支援還是比較好,而eclipseplugin雖然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 ServerTomcat 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. 如圖選 menuFile-->New Project

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

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

    C:\netbeansprj,按 Next 按鈕

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

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

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

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

    這帳號可以管理 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跳出如下畫面,

      左邊 CategoriesWeb,右邊 File Types Servlet,按 Next


    如下圖 Class Name 輸入 HelloWorldServletPackage 輸入 yj.servlet,按 Finish



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

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

      注意 NetBeans Servlet範本的 doPostdoGet 方法均轉給 processRequest方法來

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

      即可更改。


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

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

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


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

      DataIUS_ServletGenGraphic_ServletGenMapfile_Servlet

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

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

      JfreeChartjfreechart-1.0.12.jarjcommon-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 結束行程。