SpecialButtonコンポーネント Tips

コンポーネントを実用して作成したスキン作成ウィザードと、スキンの実用方法、
およびindexで紹介した具体的な使用例や他のTipsを紹介します。


目次
更新履歴
スキン作成ウィザード
スキンの使用方法
その他Tips


indexに戻る


Tips更新履歴

2006/12/09 正式版公開準備に合わせていろいろ修正

SpecialButton用動作確認サンプル兼スキン作成ウィザード

swfのダウンロードはこちらを右クリック。

画面右側に並んでいる項目が各種メソッド名となっています。
各種メソッド名の横にあるスライダー、およびコンボボックスの値を変更し、
各メソッドの挙動を確認して下さい。

画面左上はボタンの通常(Up)時、Over時、Down時、押下不可(Disable)時の色、透明度、ハンドラ、および効果音(Sound)を指定できます。
また、各項目の背景およびラベル色はその状態になった際の外観を示しています。

その下にあるのが各種パラメータの変更を実際に反映するプレビューボタンです。
(プレビューボタンはドラッグで移動ができるようになっています)
ボタンの色と背景色の関係をチェックしたい場合は
すぐ横にある「背景色の変更」から背景色を変更し、色合いを確認して下さい。

各種パラメータの設定をいちいち行うのが面倒な場合、
「背景色の変更」の右にあるコンボボックスからスキン名を選択すると、
ボタン本体にデフォルトで用意されているスキンが適用され、そのスキンのパラメータが
各パラメータ設定欄に自動的に反映されます。

設定したパラメータを実用したい場合は、画面右下の「スキン名」に任意のスキン名を入力し、
「スキンを出力」ボタンを押下すれば、
新規スキンとして登録可能なコードが出力されます。
詳細は「自作スキンの使用方法」を参照して下さい。

既存スキン、および自作スキンの使用方法

通常の使用方法

コンポーネント定数「スキン名」に
デフォルト






オレンジ
透明
Link
Windows
WinXP
MX2004
XPBar
FF
NovelGame
のいずれかの文字を指定する。

自作スキンの使用方法

1. スキン作成ウィザードで作成したコードをコピーする。
2. スキンを使用するflaファイルを開く。
3. ライブラリ[Flash UI Simple Components]内にある「spb_Skins」を開く。
4. 1フレーム目に記載されているASの最下部「自作スキン置き場」の
  //自作スキンはここに貼り付けて下さい//
  と記載されている箇所に、1.で作成したスキンを貼り付ける。
5. コンポーネント定数「スキン名」に1.で指定したスキン名を指定する。

コンポーネント定数の値とスキンの値の優先順位の関係

コンポーネント定数とスキンで違う値を指定した場合は、
スキンで指定した値が優先的に使用されます。
そのため、複数のボタンで色だけを統一しておきたい場合は
色情報だけを定義したスキンを作成し、
それ以外の項目をコンポーネント定数で指定する、という方法を使って下さい。

優先順位の関係:
コンポーネント読み込み後に指定した値 > スキンで指定した値 > コンポーネント定数で指定した値

その他Tips

データやハンドラにはターゲットパスを含む変数名や値を参照/指定できる

例:ボタンを押下したらrootにあるテキストボックス「Label_txt」に入力したアドレスを開く。

データ [_root.Label_txt.text]
ボタン押下時のアクション "指定データにgetURL(新規ウィンドウ)"

例:ボタンを押下したら『_root.test_mc = false;』を実行する

データ [false]
ボタン押下時のアクション "ハンドラ起動"
ハンドラ _root.test_mc

テキストフォーマットはコンポーネント定数に記載されている定数以外のパラメータも指定できる

設定しているTextFormatオブジェクトは通常のTextFormatと同様のものなので、
他のパラメータを付与すれば同様に指定することが可能です(実用できるかは別として)
例:setするTextFormatオブジェクトの内容
    var _fmt = {
        bold          :false,
        italic        :false,
        underline     :false, //underlineはボタンの押下状態によって可変するため指定しても意味ナス
        size          :12,
        leading       :2,
        blockIndent :5
        align       :right
    }
    ボタンインスタンス名.setTextFormat(_fmt);
	

『SimpleBox』 『InsidePullingOutBox』コンポーネントも単体で使える

『SimpleBox』は単純な四角形を描画するためのコンポーネントです。
大きさと角の丸み、および色が指定できます。
『InsidePullingOutBox』はSimpleBoxの「境界線のみ」を実装したコンポーネントです。
どちらも使いこなすと画面のレイアウトを構築する際に地味に活躍できるかもしれません。

ハンドラ名にはMovieclipのプリミティブメソッドが直接記述できる

ハンドラ名に「gotoAndPlay」や「CreateEmptyMovieClip」といったMovieClipのメソッドを記載し、
データに上記メソッドに対応した引数を指定すれば、それらのメソッドは正常に実行されます。

例:ボタンを押したらrootに新規テキストボックスを作成する。

データ [hoge_txt,0,0,0,104,16]
ボタン押下時のアクション "ハンドラ起動"
ハンドラ "_root.createTextField"

応用範囲はあまり無さそうですが、こんな事もできますよという事で。


indexに戻る