UJMLサンプル063：位置とサイズを指定してティッカーを表示する。(2006/02/25)

今回紹介するサンプルは、位置とサイズを指定してティッカーを表示するもの。ステートマシン内で指定されたサイズから表示する文字数を判定している。
※UJMLサンプルの番号が前後してしまい申し訳ございません。

本サンプルに登場する、関数

_text_width("ほげほげ", &_FONT_SIZE_MEDIUM;, &_FONT_STYLE_PLAIN;, &_FONT_FACE_SYSTEM;);

は、指定された文字列を表示した時の幅を計算するものだ。小型デバイスでは画面サイズも限られる。最適な画面表示を行うため、このようにサイズを逐次計算して表示レイアウトを行うのがこつだ。

UJMLではHTMLと違い、例えばHTMLでできる、「align="left"」と指定し、配置することができない。ヴィジュアルエレメント（箱とかラベル等のこと）の配置には座標を計算して配置しなければならず、ここは敷居が高いと感じる。HTMLはその点、書く人に優しい（これが、爆発的に普及した理由でもあるのだが※誰でもできる）。HTMLはインタラクティブ性を思想として取り入れて設計されていない。文書や画像を上から順にHTMLで書いていけば、上から順にブラウザ上に表示される。という極めて分かりやすい設計だ。UJMLは逆に、よりインタラクティブなUI設計を思想として取り入れたため、ヴィジュアルエレメントの配置に厄介な座標計算が必要になるし、ステート変数による画面遷移の管理が必要になる。

※ちなみに、このサンプルは今後作成する「はてブタグホッパー」「グラフ表示ステートマシン」に流用するために作成した。今後これらのものを作成しつつ、改良されたステートマシンも公開する予定だ。

ソースコードはファイルでダウンロードできる。↓

使う側：Download samples_063_TickerAnywhere.ujml

ステートマシン：Download tickeranywhere.ujms