ZK 6.5：一份程式同時解決 Desktop 與 Tablet！

官方英文版：http://blog.zkoss.org/index.php/2012/07/31/zk-6-5-responsive-design-desktop-and-tablet-applications-from-the-same-codebase/

ZK 6.5 版專注的重點在於加強開發人員建立 tablet 版 web application 的流暢度、甚至無須特別為 tablet 撰寫另外一個版本。

Desktop vs Tablet

有別於 Desktop，Tablet 的螢幕較小、沒有滑鼠、輸入得靠軟體模擬鍵盤...... 等差異。在這些先天限制下，製作 Tablet 的 web application 時，勢必得換另一種思維來思考如 layout 設計、輸入方式、swipe 行為等諸多 UX 議題。

ZK 6.5 版，已經幫你解決這些問題了。

ZK 做了什麼？

為了兼顧 End-User 的 UX 以及開發人員的負荷，ZK 的作法是：「讓同一個元件在 Desktop 與 Tablet 下，分別有不同的行為與樣式。」以 Colorbox 來說，color picker 模式下的 gradient block 與 circle bar 都變大了，按鈕之間的間距也加大避免誤按。Datebox 則是徹底改變輸入方式，不再出現月曆、而是以吃角子老虎的方式讓使用者可以輕鬆地指定日期。至於 Listbox，在 tablet 的環境下不會出現捲軸，但是會捕捉 swipe 動作讓 End-User 可以上下捲動 item 並瀏覽。

這裡只舉出幾個代表性的例子。事實上，絕大多數的 component 都精心調校過，只要設計得當，開發人員可以只寫一份程式碼，卻同時能讓使用 Tablet 與 Desktop 的 End-User 瀏覽。

真的假的？

是的，我們寫了一個 demo project：ZKForumViewer，完全使用 ZK 原生的 component、幾乎沒有覆寫原本的 CSS、也只額外寫了一點點 CSS。效果如何呢？請看這個影片：

你可以到 github 抓 source code、在自己的環境下執行看看。它是可以運作的，而且運作良好！

Enjoy ZK 6.5 and have fun!

ZK MVVM 我也會 [1]

首先在 src/fooPackage 下新增一個 class，名字叫做 MyViewModel，內容是：

Rikulo 之道

原文網址：http://blog.rikulo.org/posts/2012/Jul/General/the-rikulo-way/

前言

Rikulo 是一個免費、open source 的 framework，讓你可以使用 Dart 與 HTML5 創造出令人驚豔、跨平台的網頁與 native mobile application。我們的目標是提供開發人員最簡單且強而有力的方式來開發 application。為此我們提供了一個 UI 的架構。

Dart 提供了一個給 web 用的結構化程式語言，程式碼可以同時在 client 與 server 端執行。在 Rikulo 中，我們希望拓展這個思維、並應用到 UI 上。HTML 跟 CSS 對包含大量文字的網站而言是很棒的，許多強大的功能也隨著 HTML5 與 CSS3 的導入而出現。然而，在建立複雜的 application 時，複雜 layout 會導致許多 side-effect，HTML 與 CSS 是解決了一些問題、但是卻產生更多的問題。

我們提出的解決方法是「Structured UI Model」。