Welcome to My Eclipse Screen!


Eclipse 是個一直演進的整合開發軟體 IDE,隨著 Plug-in 的不斷加入,各種功能越來越龐大,文件與網路查詢雖然可以查到充足的資訊,不過並不容易很快上手,有時後甚至自己做過一次後,回頭再來看也要查文件看許久, 所以這裡將一些 Eclipse 使用與練習的過程用螢幕展示 (ScreenCast) 方式錄製下來,供自己以後使用或是大家參考。


License


Note


目前所有螢幕展示跟內容都還在演變中,故不提供文件打包 zip 下載服務,請先用網路瀏覽,練習告一個段落,將打包成 Eclipse Help 文件方便離線瀏覽參考。

Eclipse Update URL : TODO

本文件最新版本請線上參閱 : http://extremepattern.com/myeclipsescreen/

SG1:Qemu/Ubuntu/SVN/Bugzilla


What's Eclipse/Mylyn/SVN/Bugzilla ?

一開始想要有個容易交接開發工作「環 境」的方案,可以很方便地將 Source / Bug / Resource 資料以及 Subversion/Bugzilla 應用服務打個包,複製到其他的環境去,開啟 Eclipse/Mylyn 就可以繼續工作。

資料放在檔案(Subversion)或是 MySQL (Bugzilla)資料庫中,要將這類服務與資料一起帶走,最好用現成的 LAMP 來做,並作成一個 QEMUQcow2 Image 方便移動。

於是試著做個可以帶著走的  SVN/Bugzilla/Eclipse/Mylyn 環境,試著做一點東西之後,發現這個東西可能需要整合更多服務,查資料發現已經有個開源碼方案,可以滿足這類需求,就是 Buildix。Buildix 不只提供 SVN/Bug 功能,還提供 Wiki/Continuous Integration 等功能。

換手維護或是移交客戶時,複製到隨身碟或是光碟,可以一次將開發環境、程式碼版本控制、議題追蹤與各種討論歷史紀錄,整個完整移交,讓 接手的人或是客戶拿到一個可以除錯與修正的環境,保持軟體的快速修改彈性。同時選用自由軟體,散佈不會有智財權問題,同時這樣做成一個 image 也可以方便做備份。

保持當時的版本狀態很重要,因為軟體使用過程中不見得有人力可以一直更新維護版本。

例如 2007 環境是:

Apache 2.2.4 
Ubuntu7.10
SVN 1.4.4
PHP 5.2.3
Bugzilla 2.22
Eclipse 3.3.1
Mylyn 2.1
Qemu 0.9

到了 2012 的一般開發環境可能變成:

Apache 2.8 
Ubuntu9.10
SVN 2.4
PHP 6.2
Bugzilla 3.6
Eclipse 4.2
Mylyn 4.1
Qemu 1.2

如果有機會需要修正維護某個 2007 環境,與其期望可以用 2012 的環境來搞定,倒不如直接使用 2007 的環境比較容易。

建立 qemu image 並安裝 LAMP 環境。

更新或是安裝可能需要一段時間,請耐心等候。

$ sudo nano /etc/apt/sources.list
# deb cdrom:
# upgrade
$ sudo apt-get update
$ sudo apt-get upgrade

裝完如果覺得要重新跑一次很麻煩,建議將該 dsk 檔案另外複製起來,下次就不需要再跑一次。

Qemu and Ubuntu 7.10 LAMP


建立 svn / 設定 eclipse / 建立 bugzilla 與設定 mylyn 2.2

svn install

$ sudo apt-get install subversion
$ sudo apt-get install libapache2-svn
$ sudo mkdir /home/svn
$ sudo svnadmin create /home/svn
$ sudo chown -R www-data /home/svn
$ sudo htpasswd -cm /etc/apache2/dav_svn.passwd lin
$ sudo nano /etc/apache2/mods-enabled/dav_svn.conf

<Location /svn>
DAV svn
SVNPath /home/svn
AuthType Basic
AuthName "My Repository"
AuthUserFile /etc/apache2/dav_svn.passwd
Require valid-user
</Location>

$ sudo /etc/init.d/apache2 restart
http://localhost:7780/svn

# Add another user foo
$ sudo htpasswd -bm /etc/apache2/dav_svn.passwd foo

bugzilla install

$ sudo apt-get install bugzilla
lin@bug.zilla
$ sudo /usr/share/bugzilla/lib/checksetup.pl
$ mysql -u root -p
mysql > ALTER DATABASE bugzilla CHARACTER SET utf8;
$ sudo nano /etc/apache2/httpd.conf
------------------------------------------
Alias /bugs/ /usr/lib/cgi-bin/bugzilla/

<Directory /usr/lib/cgi-bin/bugzilla>
AddHandler cgi-script .cgi
Options +Indexes +ExecCGI
DirectoryIndex index.cgi
AllowOverride Limit
</Directory>
------------------------------------------
$ sudo /etc/init.d/apache2 restart
http://localhost:7780/bugs/


如果喜歡使用已經建制完成的,可以考慮 Buildix, 它使用 trac 而不是 bugzilla,因為 trac 有提供 wiki 功能。

svn  and  bugzilla

SG2:PDE Ant Build/JUnit Plug-in Test


Eclipse 3.3 Product export wizard 轉成自動化 ant 1.7 build

使用 product export wizard 很方便設定與調整要建構的產品, 不過這需要有人去按或是觸發,對於需要做自動化 Ant PDE build 的 Continuous Integration(CI) 環境來說,需要一點修改來運作。

要建構 Ant PDE build,可以先看看官方文件 Generating Ant scripts ,文字看起來有點難懂,還好有 Patrick Paulin 的線上範例可以看,參考 Patrick Paulin 的 Getting started with PDE Build 一文,如果需要測試還可以看看 Running Automated Tests with PDE Build 。這裡是參考  Getting started with PDE Build 的作法,練習一下並加上紀錄螢幕展示過程,方便日後快速回憶整個過程。

先用 product export wizard 產出的 product 檔案,再用 java org.eclipse.equinox.launcher.Main 去執行 org.eclipse.ant.core.antRunner 來跑org.eclipse.pde.build_xx/scripts/productBuild/productBuild.xml,大部分的東西還 是用現成的,並不是自己寫一個 build.xml,去用 javac/java/jar task 來一個個 plugin/feature 包起來。

建立 Ant pde build 環境

  1. 取得新的 eclipse-RCP-3.3.1.1-win32.zip/eclipse-RCP-3.3.1.1-delta-pack.zip/eclipse-SDK-3.3.1.1-win32.zip 建立 ant pde build 環境。
  2. 建立 foo-build-target/foo-build/eclipse-sdk 目錄
  3. eclipse-RCP-3.3.1.1-win32.zip/eclipse-RCP-3.3.1.1-delta-pack.zip 解開放入foo-build-target
  4. eclipse-SDK-3.3.1.1-win32.zip 解開放入 eclipse-sdk

開啟日常用的 eclipse sdk 環境,避免用上面 ant pde build 中的那個 sdk,因為這裡要練習不同機器的狀況。

  1. 建立一個 foo.hello rcp 
  2. 建立一個 foo.hello.feature
  3. foo.hello 下面建立一個 foo.product
  4. 建立一個 foo.hello.build
  5. 複製範例 Getting started with PDE Build 一文中的 build.properties/build.xml 到 foo.hello.build,或是 foo.hello.build.zip 中的也可以。

改 build.properties 部份

  1. pdeBuildPluginVersion=3.3.2.R331_v20071019
  2. equinoxLauncherPluginVersion=1.0.1.R33x_v20070828
  3. base=C:/LIN/RCPBUILD/foo-build-target
  4. eclipseLocation=C:/LIN/RCPBUILD/eclipse-SDK-3.3.1.1-win32/eclipse
  5. product=/foo.hello/foo.product
  6. buildDirectory=C:/LIN/RCPBUILD/foo-build
  7. baseLocation=${base}/eclipse

改  build.xml 部份

  1. include name="foo.hello/**"
  2. include name="foo.hello.feature/**"

測試 ant inti and ant pde-build

..foo.hello.build>c:\lin\PROJECT\apache-ant-1.7.0\bin\ant.bat init
..foo.hello.build>c:\lin\PROJECT\apache-ant-1.7.0\bin\ant.bat pde-build

Download foo.hello.build.zip

Eclipse 3.3 Product export wizard 轉成自動化 ant 1.7 build


Ant 1.7 pde-build with svn task 

上 面的練習中將檔案複製到 build 區比較像是 private build,一般需要從 cvs/svn 將其他人做過的部份一起 checkout 出來後才開始編譯,這裡想要練習 svn 的部份,不過 ant 官方沒有 svn 的 task,要自己準備 svn.exe(Windows),下載 svn-win32-1.4.5.zip 後裝到可以找到的地方。

本地複製的部份

<target name="init">
<mkdir dir="${buildDirectory}" />
<mkdir dir="${buildDirectory}/plugins" />
<mkdir dir="${buildDirectory}/features" />
<copy todir="${buildDirectory}/plugins">
<fileset dir="../">
<include name="foo.hello/**" />
</fileset>
</copy>
<copy todir="${buildDirectory}/features">
<fileset dir="../">
<include name="foo.hello.feature/**" />
</fileset>
</copy>
</target>

svn checkout 的部份

<target name="svninit">
<mkdir dir="${buildDirectory}" />
<mkdir dir="${buildDirectory}/plugins" />
<mkdir dir="${buildDirectory}/features" />
<property name="svnexe"
location="C:/LIN/RCPBUILD/foo-build-target/svn/svn-win32-1.4.5/bin/svn.exe"/>
<exec executable="${svnexe}">
<arg value="checkout" />
<arg value="http://127.0.0.1:7780/svn/trunk/foo.hello" />
<arg value="${buildDirectory}/plugins/foo.hello" />
</exec>
<exec executable="${svnexe}">
<arg value="checkout" />
<arg value="http://127.0.0.1:7780/svn/trunk/foo.hello.feature" />
<arg value="${buildDirectory}/features/foo.hello.feature" />
</exec>
</target>

ant svninit and ant pde-build

..foo.hello.build>c:\lin\PROJECT\apache-ant-1.7.0\bin\ant.bat svninit
..foo.hello.build>c:\lin\PROJECT\apache-ant-1.7.0\bin\ant.bat pde-build


JUnit Plug-in Test and EclEmma Code Coverage 

Eclipse 的 Plugin 架構測試的方式比較特別,需要將整個環境跑起來把相依的 plugin 組合才可以測試,雖然過程蠻繁瑣,不過 Eclipse PDE 已經有提供工具可以支援 JUnit Plug-in Test,簡化這項工作,這裡稍微練習一下。另外如果講到測試,往往會需要看看測試涵蓋程度,是否還需要還有缺的地方可以補,用 Emma Ant Task 可以做,不過這裡要用圖形化工具,所以也順便加入很好用的 Code Coverage 工具 EclEmma,圖形化的工具使用有時用圖說比起文說還要簡單,利用一個簡單的 foo.hello plug-in 測試過程紀錄下螢幕展示幫助記憶。

JUnit Plug-in Test and EclEmma Code Coverage

Test Driven Development and Mylyn 2.2

Test Driven Development (TDD) 過程來說,先寫測試(紅燈),再寫程式或是修改成綠燈,再來就是 Refactoring 過程要保持綠燈。這樣開發過程, Test Coverage 可以一直維持在相對偏高的部份,同時練習將失敗的測試提交到 mylyn/bugzilla 控制,然後再 commit 程式碼到 svn 去。接下來應該有個可憐的傢伙(往往是同一個)會負責這 task/bug,改完修好成為綠燈後,再將 context 黏在 bug 裡面供以後的人參考。

利用 foo.hello/foo.hello.tests plug-in 來跑這個過程並紀錄下螢幕展示。

  1.  TEST : Red
  2. CODE : Green
  3. Refactor : Green

Test Driven Development and Mylyn 2.2

SG3:Welcome/Help/CheatSheet


Eclipse 3.3 RCP Welcome page and CheatSheet

Eclipse SDK 一開始用會出現一個 Welcome page,這個頁面可以提供一些幫助指引,甚至可以開 CheatSheet 來讓使用者設定程式,對於圖形化介面的設定來說更為方便,這裡要練習建立一個 有 Welcome page/CheatSheet 指引的 RCP 程式。

  1. 用樣板建立 RCP with intro page 的程式
  2. 測試
  3. 查看 content/root.xhtml
  4. 查 showPage/openBrowser/openURL/runAction
  5. 加入 org.eclipse.ui.browser plugin
  6. http://org.eclipse.ui.intro/openURL?url=http://extremepattern.com/files/mylyn-svn-bug/
  7. http://org.eclipse.ui.intro/openBrowser?url=http://extremepattern.com/files/mylyn-svn-bug/
  8. 加入 org.eclipse.ui.cheatsheet/org.eclipse.platform plugin 
  9. 建立 help extension
  10. 建立 checksheet
  11. 註冊 Register checksheet
  12. 改 cheatsheet id = foo.hello.welcome.cs1
  13. run rcp check help menu
  14. 查 Contributing a standby content part
  15. 加 org.eclipse.ui.intro.configExtension standbyContentPart
  16. 改 root.xthml 使用 http://org.eclipse.ui.intro/showStandby?partId=org.eclipse.platform.cheatsheet&amp;input=foo.hello.welcome.cs1

Welcome page and CheatSheet

MyEclipseScreen Help Plug-in /Universal Welcome

之 前做的螢幕展示會有一堆的 html/swf 等檔案,本來預計要用 zip 來包一下,不過既然 Eclipse提供按版本更新功能,想要練習一下如何建立 Help 並試著分割兩個 plug-in,這樣可以不用每次都全部重新下載一次,尤其是如果只更新 5% ,卻全部下載一次,對提供者與下載者來說,都是一種頻寬的浪費。

不過 Eclipse 的 plug-in 都是可以動態掛上去的,所以必須弄清楚後來加上的內容要如何掛到主內容去。同時除了 Help 可以進去這個內容,也可以在 Universal Welcome page 加個料,指向這個 Help 內容。

  1. 建立 xxx.eclipse.screen.doc 負責當主要黏接點
  2. Use Template: Plug-in with sample help content
  3. 把之前做的放進來並測試
  4. 建立一個  xxx.eclipse.screen.doc.ubuntu 來分散文件大小
  5. 查 Help:Building nested documentation structures
  6. 加上 anchor id ubuntu
  7. 使用 link_to="../xxx.eclipse.screen.doc/tocgettingstarted.xml#ubuntu"
  8.  加上 Universal Welcome Contribution
  9. 注意 welcome path tutorials/@  就是秀在教學區
  10. 查 Help:showHelpTopic
  11. http://org.eclipse.ui.intro/showHelpTopic?id=/xxx.eclipse.screen.doc/html/toc.html
  12. 測試

因為分散下載的緣故,如果要上傳到網站供瀏覽,可以考慮用 Ant 做一些複製來集中,再修改一下就可以上傳。

MyEclipseScreen Help/Welcome

UpdateSite Project

TODO

SG4:Text Editor


Text Editor/Content Assist/My TextEditor Assist

工 作中常常需要寫很多專案文件與 email 等等,這些文件寫久了都會有個基本格式,每次剪剪貼貼也不是辦法,這時候可以考慮做個私房或是專案使用 plug-in,這個 plug-in 會提供的Text Editor 文字編輯器的延伸版本,加上補字功能來簡化以及統一這些文件寫法。

例如發個郵件給其他夥伴,其中有時間還有一些背景資料等等連結,利用 Content Assist 補字功能可以很快開始寫。

受文者 : Haha
發文日期 : 2007年12月28日 下午04時36分18秒
主旨:[Endless Project Bug xxx] 專案要到 2020 才能完成
說明:

http://yourbugsite/foo?bug=12345

參考 wiki
http://your.wiki/project

承辦人 Foo
電話 xxxx
電郵 yyyyx

MyTextEditor.java

public class MyTextEditor extends TextEditor {
public MyTextEditor() {
super();
setSourceViewerConfiguration(new SourceViewerConfiguration() {
@Override
public IContentAssistant getContentAssistant(ISourceViewer sourceViewer) {
ContentAssistant assistant = new ContentAssistant();
IContentAssistProcessor cap = new MyContentAssistProcessor();
assistant.setContentAssistProcessor(cap,
IDocument.DEFAULT_CONTENT_TYPE);
assistant.setInformationControlCreator(
getInformationControlCreator(sourceViewer));
assistant.enableAutoActivation(true);
return assistant;
}
});

}
}

My Text Editor Assist

Download foo.my.editor.zip

參考資料

  1. Keyword : Content Assist/SourceViewerConfiguration/SourceViewer
  2. Plugin : org.eclipse.ui/org.eclipse.ui.editors/org.eclipse.jface.text
  3. Note : icon="icons/sample.gif" 一定要加,不然會無法出現。
  4. FAQ How do I add Content Assist to my editor?

My TextEditor Assist2

之前看死亡筆記本可以寫幾個字就有效用,這裡當然不是要做這類東西,而是要利用補字功能選字,然後觸發 Eclipse  內建的瀏覽器來開啟相關的網頁。

主要利用 ICompletionListener 來監聽事件,然後在變化與補字完之後,將瀏覽器開起來。練習的觸發格式是空白鍵加上關鍵字,然後有英文的句點來觸發 Content Assist 功能。

My Text Editor Assist2

Download foo.my.editor-2.zip

SG5:TODO


TODO