配色の変更

配色の変更

■　Flashムービーの作成

それでは、FStyleFormatクラスを利用したFlashムービーを作成してみましょう。

1.　新規のFlashムービーを作成します。メニューバーの［ウィンドウ］-［コンポーネント］を選択肢、［コンポーネント］パネルを表示します。このパネルの中から幾つかのコンポーネントを選んでステージ上に配置します。配置するコンポーネントとインスタンス名は以下の通りです。

挿入するコンポーネント

インスタンス名

CheckBox
_cb

ComboBox
_cb

ListBox
_lb

PushButton
_pb

RadioButton
_rb

RadioButton
n_rb

ScrollBar
_sb

上記のコンポーネントのほかに、ダイナミックテキストを一つ配置します。［コンポーネント］パネルからスクロールバーをダイナミックテキストにドロップすると両者が自動的に関連付けられます。

2.　ステージの右下に配色設定を選択するリストボックスを挿入します。このインスタンス名を「style_cb」に設定し、パラメータを以下のように設定します。

パラメータ

設定内容

Editable
false

Labels ［標準、yellow, pink, green, blue, gray, brown］

Data []

Row Count 5

Change Handler styleChange

3.　フレーム２にキーフレームを挿入し、フレームアクションに以下の内容を記述します。
まず、FStyleFormatオブジェクトを管理するためのformatArrは入れると作成します。formatArr配列の各要素を、FStyleFornatオブジェクトで初期化します。その後、３つの要素の具体的なプロパティを設定していきます。1つ目の要素（formatArr[0]）には標準の配色設定を格納するので、globalStyleFormatオブジェクトの各種プロパティをそのまま割り当てています。2つ目以降の要素（formatArr[i]）には、独自の配色設定を格納します。色の指定には16進数を使っています。16進数で指定すると、RRGGBBの形式で記述できるので、どのような色になるか想像しやすいという利点があります。

次に、formatArr配列に格納した配色設定をリスト場オックスの選択内容に応じて各コンポーネントに関連付ける関数（styleChange関数）を定義します。手順2でstyle_cbリストボックスを作成したときに、ChangeHandlerパラメータに「styleChange」と設定したことを思い出してください。したがって、style_cbリストボックスの現在の選択位置からformatArr配列内のどの要素を使用するかを特定し、その要素をaddFormat関数内では、各コンポーネントに対してremovaListenere関数を呼び出し、FSylesFormatオブジェクトの関連付けを解消して標準の配色にします。addFormat関数内では、各コンポーネントに対してaddListner関数を呼び出し、FStyleオブジェクトと関連付けて新しい配色設定を適用します。

formatArr = new Array();
formatArr[ 0 ] = new FStyleFormat();
formatArr[ 1 ] = new FStyleFormat();
formatArr[ 2 ] = new FStyleFormat();
formatArr[ 3 ] = new FStyleFormat();
formatArr[ 4 ] = new FStyleFormat();
formatArr[ 5 ] = new FStyleFormat();
formatArr[ 6 ] = new FStyleFormat();

sf = formatArr[ 0 ];
sf.arrow = globalStyleFormat.arrow;
sf.background = globalStyleFormat.background;
sf.backgroundDisabled = globalStyleFormat.backgroundDisabled;
sf.check = globalStyleFormat.check;
sf.darkshadow = globalStyleFormat.darkshadow;
sf.face = globalStyleFormat.face;
sf.highlight = globalStyleFormat.highlight;
sf.highlight3D = globalStyleFormat.highlight3D;
sf.radioDot = globalStyleFormat.radioDot;
sf.scrollTrack = globalStyleFormat.scrollTrack;
sf.selection = globalStyleFormat.selection;
sf.selectionDisabled = globalStyleFormat.selectionDisabled;
sf.selectionUnfocused = globalStyleFormat.selectionUnfocused;
sf.shadow = globalStyleFormat.shadow;

sf = formatArr[ 1 ];
sf.arrow = 0x665500;
sf.background = 0xFFFFCC;
sf.backgroundDisabled = 0xFFFFCC;
sf.check = 0x665500;
sf.darkshadow = 0xE6C419;
sf.face = 0xFFFF99;
sf.highlight = 0x58B7FC;
sf.highlight3D = 0x7570Ef;
sf.radioDot = 0x11008A;
sf.scrollTrack = 0xFFEE33;
sf.selection = 0x665500;
sf.selectionDisabled = 0x665500;
sf.selectionUnfocused = 0x665500;
sf.shadow = 0x240F7B;

sf = formatArr[ 2 ];
sf.arrow = 0xA90D05;
sf.background = 0xFFE1E6;
sf.backgroundDisabled = 0xFF99C4;
sf.check = 0x651207;
sf.darkshadow = 0x810F0A;
sf.face = 0xFFCCE2;
sf.highlight = 0xF7918C;
sf.highlight3D = 0x810F0A;
sf.radioDot = 0x651207;
sf.scrollTrack = 0xFF99C4;
sf.selection = 0xFF0055;
sf.selectionDisabled = 0xFF0055;
sf.selectionUnfocused = 0xFF0055;
sf.shadow = 0x240F7B;

sf = formatArr[ 3 ];
sf.arrow = 0x425C3D;
sf.background = 0xDCF0DD;
sf.backgroundDisabled = 0xA8F0AE;
sf.check = 0x425C3D;
sf.darkshadow = 0x425C3D;
sf.face = 0xA8F0AE;
sf.highlight = 0x083300;
sf.highlight3D = 0x006633;
sf.radioDot = 0x425C3D;
sf.scrollTrack = 0x66CC66;
sf.selection = 0x116600;
sf.selectionDisabled = 0x116600;
sf.selectionUnfocused = 0x116600;
sf.shadow = 0x083300;

sf = formatArr[ 4 ];
sf.arrow = 0x002266;
sf.background = 0xCCEEFF;
sf.backgroundDisabled = 0xCCEEFF;
sf.check = 0x002266;
sf.darkshadow = 0x0077CC;
sf.face = 0x99D5FF;
sf.highlight = 0x0077CC;
sf.highlight3D = 0x003B66;
sf.radioDot = 0x651207;
sf.scrollTrack = 0x66B3FF;
sf.selection = 0x0055CC;
sf.selectionDisabled = 0x0055CC;
sf.selectionUnfocused = 0x0055CC;
sf.shadow = 0x240F7B;

sf = formatArr[ 5 ];
sf.arrow = 0x333333;
sf.background = 0xEEEEEE;
sf.backgroundDisabled = 0xEEEEEE;
sf.check = 0x222222;
sf.darkshadow = 0x777777;
sf.face = 0xDDDDDD;
sf.highlight = 0x333333;
sf.highlight3D = 0xBBBBBB;
sf.radioDot = 0x222222;
sf.scrollTrack = 0xCCCCCC;
sf.selection = 0x555555;
sf.selectionDisabled = 0x555555;
sf.selectionUnfocused = 0x555555;
sf.shadow = 0x444444;

sf = formatArr[ 6 ];
sf.arrow = 0x331100;
sf.background = 0xF0EBDC;
sf.backgroundDisabled = 0xF0EBDC;
sf.check = 0x331100;
sf.darkshadow = 0x331100;
sf.face = 0xF0EADC;
sf.highlight = 0x332200;
sf.highlight3D = 0x331100;
sf.radioDot = 0x651207;
sf.scrollTrack = 0xCCB799;
sf.selection = 0x664400;
sf.selectionDisabled = 0x664400;
sf.selectionUnfocused = 0x664400;
sf.shadow = 0x331100 ;

old_sf = null;

function styleChange()
{
delFormat( old_sf );
var index = style_cb.getSelectedIndex();
var sf = formatArr[ index ];
addFormat( sf );
}

function addFormat( sf )
{
sf.addListener( _sb );
sf.addListener( _ch );
sf.addListener( _cb );
sf.addListener( _lb );
sf.addListener( _pb );
sf.addListener( _rb );
sf.addListener( n_rb );
}

function delFormat( sf )
{
if( sf == null )
return;

sf.removeListener( _sb );
sf.removeListener( _ch );
sf.removeListener( _cb );
sf.removeListener( _lb );
sf.removeListener( _pb );
sf.removeListener( _rb );
sf.removeListener( n_rb );
}

this.stop();

4.　これでムービーが完成です。

<<<戻る

挿入するコンポーネント	インスタンス名
CheckBox	_cb
ComboBox	_cb
ListBox	_lb
PushButton	_pb
RadioButton	_rb
RadioButton	n_rb
ScrollBar	_sb

パラメータ	設定内容
Editable	false
Labels	［標準、yellow, pink, green, blue, gray, brown］
Data	[]
Row Count	5
Change Handler	styleChange