※ 画像は公式サイトデモより

Webアプリケーション化が進めば進むほど、JavaScriptに期待されるのがリッチインタフェースの実現だ。もともとWebブラウザ自体がリッチなインタフェースだが、ローカルアプリケーション並みのコンポーネントや操作性を求められるようになっている。

四角のレイアウト

そのようなインタフェースを実現するライブラリは数多く登場してきている。その一つとしてJxを紹介しよう。

JxはMooToolsをベースとしたJavaScriptライブラリで、リッチなユーザインタフェースを実現する。Google Code上でホスティングされているオープンソース・ソフトウェアで、ライセンスはMITとなっている。

Jxの公式サイトには様々なサンプルが登録されている。レイアウトに関するもの、スライドやドラッグができるダイアログやパネル、テーブル表示、ツリー、ツールバー、メニュー、タブなど様々だ。

ツリービュー

それぞれさらにパターンがあり、細かく表示を制御できる。他にもバックグランドにグリッドを表示したり、テーマを切り替えたりすることも簡単にできる。ツールバーを使えば、まさにWebアプリケーションとして使いやすいものになるだろう。

Webアプリケーションとして使うのはもちろん、統一されたデザインを活かしてサイト全体のオブジェクトデザインを統一するのにも使えそうだ。カラーパレットなど小粋なツールや、デザインを見栄えよくするスプリッタなど開発する上で便利な機能もたくさんある。個別で探して適用するよりも簡単で統一感も出る。

既にこのようなライブラリは幾つも存在するので、どれを使うか悩ましい所ではある。しかしこの手のツールをうまく選定すれば開発効率は一気に向上する。様々なツールの中からどれが最も自分たちのプロジェクトに適しているか、試しつつ確認して欲しい。

テーブル

ツールバー

タブ機能

Jx

　http://jxlib.org/

jxlib - Google Code

　http://code.google.com/p/jxlib/