libro
www.tuyano.com
DashcodeによるiPhone用Webアプリ作成入門

主なGUI部品を使う (4/5)

作成:2011-05-16 07:57
更新:2011-05-16 07:57

■オリジナルのGUI部品

チェックボックスやラジオボタンなどは、複数の要素から構成されているとはいえ、基本的にはHTMLのフォームに用意されているGUI部品をそのまま利用したものです。ただ、テキストの表示などが自動的に作成されるのでちょっとばかり便利だ、というだけで、HTMLの表現力を越えるものではありませんでした。

が、Dashcodeに用意されているのは、こうしたHTMLの標準的なGUIだけではありません。独自のGUI部品もいろいろと持っているのです。特に充実しているのが、「数字を扱う部品」でしょう。パソコンでは、例えばスライダーのように、一定範囲の値を設定するためのGUIが用意されています。が、HTMLにはこうしたものはありません。このため、グラフィックといくつかのタグを組み合わせ、独自のGUIを作り出し、利用できるようにしていたのです。ここで、オリジナルの部品から汎用性の高いものをまとめて紹介しておきましょう。

◯インジケータ
信号のように緑・黄・赤のランプを付けるGUIです。自身の値と、いくつかの「しきい値」をもっており、値がしきい値を超えるごとに点灯(緑)、警告(黄)、重大(赤)と表示が変わります。最小値最大値は特に用意されていません。つまり、いくつでも値は設定可能で、ただ設定した値によって表示される色が緑・黄・赤と変わる、というだけのものです。

パレットの「属性」欄に、これらのしきい値と現在の値を設定するための項目があり、ここであらかじめ各しきい値を設定して利用します。

◯ゲージ
インジケータを更に強化したもので、インジケータ内に針とメモリが追加されています。最小値最大値の情報を持っており、値が増えるごとに針がゼロから次第に増えていき、最大値になった時点で振り切れます。また、インジケータと同様に点灯、警告、重大のしきい値を持っており、それらを超えた時点で表示が緑・黄・赤と変わります。これも「属性」パレットに、各しきい値を設定する項目があります。

◯レベルインジケータ
これは横方向と縦方向の2種類が用意されています。ゲージと同様に、現在の値をアナログに示すのに使われます。いくつかの小さなLEDのようなランプが一列に並んだ形をしており、値と共にそれが点灯していきます。また、点灯、警告、重大を示すしきい値を持っており、それらを超えるとランプの色が緑・黄・赤と変わっていきます。やはり「属性」パレットに、各しきい値を設定する項目があります。ゲージよりも、より視覚的にわかりやすい表示と言えます。

ここで紹介したものは、基本的に「状態を表示するためのもの」であり、ユーザーが触って操作するたぐいのものではありません。現在の状況(値)を視覚的に表現するためのものであり、実質的な役割は3つとも同じです。ただ、「どのように見せるか」が違うだけ、と考えるとよいでしょう。

※プログラムリストが表示されない場合

AddBlockなどの広告ブロックツールがONになっていると、プログラムリスト等が表示されない場合があります。これらのツールをOFFにしてみてください。


※関連コンテンツ

「DashcodeによるiPhone用Webアプリ作成入門」に戻る