ColorPicker コンポーネントの使用

ColorPicker を使用すると、ユーザーがカラーを選択して、アプリケーション内の別のオブジェクトに適用できます。 例えば、ユーザーが背景色やテキストの色などのアプリケーションのエレメントをパーソナライズできるようにする場合は、ColorPicker を組み込むと、ユーザーが選択したカラーを適用できます。

ユーザーがカラーを選択するには、パネルでそのカラーの色見本をクリックするか、テキストフィールドにそのカラーの 16 進数値を入力します。 ユーザーがいずれかのカラーを選択すると、ColorPicker の selectedColor プロパティを使用して、アプリケーション内のテキストなどのオブジェクトにそのカラーを適用できます。

ColorPicker インスタンスは、ユーザーがポインターをその上に移動するか Tab キーで移動すると、フォーカスを取得します。 ColorPicker の色見本パネルが表示されているときは、次のキーを使用した操作が可能です。

プロパティインスペクターまたはコンポーネントインスペクターで ColorPicker の各インスタンスに設定できるオーサリングパラメーターは、 selectedColor および showTextField です。これらの各パラメーターには、対応する同名の ActionScript プロパティがあります。 これらのパラメーターに設定できる値については、「 Adobe Flash Professional CS5 用 ActionScript 3.0 リファレンスガイド 」の ColorPicker クラスを参照してください。

次の例では、オーサリング時に、アプリケーションに ColorPicker コンポーネントを追加します。 この例では、ColorPicker でカラーを変更するたびに、 changeHandler() 関数が drawBox() 関数を呼び出し、ColorPicker で選択されたカラーの新しいボックスを描画します。

1. 新しい Flash (ActionScript 3.0) ドキュメントを作成します。

2. ColorPicker をコンポーネントパネルからステージの中央までドラッグし、インスタンス名を aCp にします。

3. アクションパネルを開いて、メインタイムライン内でフレーム 1 を選択し、次の ActionScript コードを入力します。

   import fl.events.ColorPickerEvent; 
    
   var aBox:MovieClip = new MovieClip(); 
   drawBox(aBox, 0xFF0000);    //draw a red box 
   addChild(aBox); 
    
   aCp.addEventListener(ColorPickerEvent.CHANGE,changeHandler); 
    
   function changeHandler(event:ColorPickerEvent):void { 
       drawBox(aBox, event.target.selectedColor); 
   } 
    
   function drawBox(box:MovieClip,color:uint):void { 
               box.graphics.beginFill(color, 1); 
               box.graphics.drawRect(100, 150, 100, 100); 
               box.graphics.endFill();         
   }

4. 制御／ムービープレビューを選択します。

5. ColorPicker をクリックし、ボックスに塗るカラーを選択します。