LabelとListとNumericStepper

では引き続き行ってみましょう

 コンポーネントを学習するには、「リファレンス」と「使用」と「カスタマイズ」を見る。
 ということをやっと理解したので、学習も加速するはず。
 では、続けていきましょう。

fl.controls.Label

 たぶん一番単純なコンポーネント、というかTextFieldじゃなくて別に作ってあるのは何故かというところが一番謎なコンポーネントではなかろうか。
 setStyle()メソッドを受け付けるので、GUI部品に統一を持たせるのに良いというのが一番かと思う。
 あ、背景色ないなこれ…グループボックスの上に置く時に線を消したい、という欲求に答える気がないなこいつ。
 まーそういう裏技的なやりかたより、ちゃんとしたグループボックスコンポーネントがあった方がいい訳だが。
 つーかなんでスタイルにフォーカス関係のがあるんだ?ラベルにはフォーカス合わないのに。意味分からんな。

 ところで、コンポーネントの基本的なメソッドとして、widthheightをまとめて設定するsetSize()と、同じくxyをまとめて設定するmove()がある。
 targetObj.x = 10;targetObj.y = 20;とか書くより、targetObj.move( 10, 20 );と書いた方が読みやすい。
 あともうひとつ頑張ってsetRect( x, y, width, height )なんてのがあっても良かった気もするが、そこまでやると過剰サービスな気がしないでもない。
 ただ、Labelの場合は右揃えになっているとより良いというか折角コンポーネントにしたんだから、そこは頑張ってくれよと思う。
 autoSizeのデフォルト値は、絶対TextFieldAutoSize.RIGHTだと思う。集合の法則が働く。
 あとラベルは右側に":"(コロン)を付けて、そこで縦に奇麗に揃えるのがよろしい。また":"が付く事でそれが説明文だということがハッキリする。そんなにうるさいものでもないので極力付けたいところだ。

 では、タイムラインに書いて実行してみる。もう特に言う事はない。

import fl.controls.Label;
import flash.text.TextFieldAutoSize;

var label:Label = new Label();
label.autoSize = TextFieldAutoSize.RIGHT;
label.text = "ラベル :";
label.move( 0,0 );
addChild( label );

 んで成果。鳶嶋工房 / User Interface / Terms / ラベル(label)

fl.controls.List

  • fl.controls.List - Adobe Flash Professional CS5 用 ActionScript 3.0 リファレンスガイド (ActionScript 3.0)
  • Adobe Flash Professional CS5 * List コンポーネントの使用
  • Adobe Flash Professional CS5 * List コンポーネントのカスタマイズ
  •  さて、fl.controls.Listだが、これはfl.controls.ComboBoxのプルダウン部分、あるいはfl.controls.DataGridの1列ぶんと一緒だ。
     もはや特に書く事はない…筈。flaファイルのライブラリにコンポーネントを置いておくのを忘れずに。

    import fl.data.DataProvider;
    import fl.controls.List;
    
    const WEAPONS:Array = [	"ひのきのぼう","どうのつるぎ","てつのやり","はがねのつるぎ"];
    var list:List = new List();
    list.dataProvider = new DataProvider( WEAPONS );
    addChild( list );

     DataProvider()にはArrayを食わせるのが便利。
     んで成果。鳶嶋工房 / User Interface / Terms / リストビュー(list view)

    fl.controls.NumericStepper

  • fl.controls.NumericStepper - Adobe Flash Professional CS5 用 ActionScript 3.0 リファレンスガイド (ActionScript 3.0)
  • Adobe Flash Professional CS5 * NumericStepper コンポーネントの使用
  • Adobe Flash Professional CS5 * NumericStepper コンポーネントのカスタマイズ
  •  これも特にこれと言って問題になるような箇所はなさそう。
     部品自体は入力フィールドに上下のアローボタンを組み合わせたもので、改良の余地は大いにある。
     Adobeは改良したGUI部品として、「ステッパにドロップダウンリストをくっ付けたもの」とか「ドラッグするとスライダになってクリックすると入力ボックスになるもの」とか発明している。
     どちらも「ちょっとまし」になったものの数値入力部品の決定打とはなっていない。

    import fl.controls.NumericStepper;
    
    var ns:NumericStepper = new NumericStepper();
    ns.minimum = 1; 
    ns.maximum = 31; 
    ns.stepSize = 1; 
    addChild( ns );

     んで成果。鳶嶋工房 / User Interface / Terms / ステッパ(stepper)
     ラベルと同じもんだけど。

    他にもいろいろやりたいけど

     スタイルシートとか、もろもろのカスタマイズもやってみたいけど、それやっていると今月中にUIコンポーネント全部使ってみるというのが無理そうなので、次回も地道に残りのコンポーネント使っていきます。

     今日はここまで。


    2011-02-27