コンポーネントのグループに対するカスタムスタイルの設定

カスタムスタイル宣言を作成して、Flash ドキュメント内のコンポーネントのグループに固有のプロパティ群を指定できます。_global オブジェクトには、Flash ドキュメント全体に対するデフォルトのスタイル宣言を指定する style プロパティ (グローバルスタイルの設定を参照) の他、使用可能なカスタム宣言のリストを示す styles プロパティがあります。スタイル宣言を CSSStyleDeclaration オブジェクトの新しいインスタンスとして作成する際、そのインスタンスにカスタムスタイル名を付けて _global.styles リストに追加できます。それからスタイルに対してプロパティや値を指定し、このカスタムスタイル名を、外観を統一したい各コンポーネントインスタンスに割り当てます。

スタイル名をコンポーネントインスタンスに割り当てても、そのコンポーネントでサポートされているスタイルプロパティしか適用されないことに注意する必要があります。各コンポーネントでサポートされるスタイルプロパティの一覧は、『ActionScript 2.0 コンポーネントリファレンスガイド』の各コンポーネントの項目を参照してください。

カスタムスタイルフォーマットは、次のシンタックスを使って変更します。

_global.styles.CustomStyleName.setStyle(propertyName, propertyValue);

カスタムスタイル設定は、クラススタイル設定、継承スタイル設定、およびグローバルスタイル設定よりも優先的に使われます。スタイルの優先順位の一覧は、同じドキュメント内でのグローバル、カスタム、クラススタイルの使用を参照してください。

コンポーネントグループのカスタムスタイル宣言を作成するには :

  1. コンポーネントを少なくとも 1 つ、ステージに追加します。

    詳細については、Flash ドキュメントへのコンポーネントの追加を参照してください。

    以降の例では、abc というインスタンス名を持つ 3 つのボタンコンポーネントを使用します。別のコンポーネントを使用する場合は、プロパティインスペクタでそれらにインスタンス名を付け、そのインスタンス名を手順 8 で使用します。

  2. タイムライン内で、コンポーネントが表示されているフレーム、または表示される前のフレームを選択します。
  3. [アクション] パネルを開きます。
  4. 次の import ステートメントを追加して、CSSStyleDeclaration クラス内から新しいスタイル宣言を作成するためのコンストラクタにアクセスできるようにします。
    import mx.styles.CSSStyleDeclaration;
    
  5. 次のシンタックスを使用して、CSSStyleDeclaration オブジェクトのインスタンスを作成し、新規カスタムスタイル形式を定義します。
    var new_style:Object = new CSSStyleDeclaration();
    
  6. スタイル宣言の名前 (たとえば "myStyle") を、カスタムスタイル宣言のリスト _global.styles に設定し、その新しいスタイル宣言のプロパティをすべて含んだオブジェクトを指定します。
    _global.styles.myStyle = new_style; 
    
  7. UIObject クラスから継承した setStyle() メソッドを使用し、new_style オブジェクトにプロパティを追加します。ここで追加するプロパティが、カスタムスタイル宣言 myStyle に関連付けられます。
    new_style.setStyle("fontFamily", "_serif");
    new_style.setStyle("fontSize", 14);
    new_style.setStyle("fontWeight", "bold");
    new_style.setStyle("textDecoration", "underline");
    new_style.setStyle("color", 0x666699);
    
  8. 同じスクリプトペインで、次のシンタックスを使って、特定の 3 つのコンポーネントの styleName プロパティをカスタムスタイル宣言の名前に設定します。
    a.setStyle("styleName", "myStyle");
    b.setStyle("styleName", "myStyle");
    c.setStyle("styleName", "myStyle");
    

setStyle() メソッドと getStyle() メソッドを使用して、宣言の styleName グローバルプロパティを通じてカスタムスタイル宣言のスタイルにアクセスすることもできます。たとえば、次のコードは、myStyle スタイル宣言で backgroundColor スタイルを設定します。

_global.styles.myStyle.setStyle("themeColor", "haloOrange");

ただし、手順 5 と 6 は、new_style インスタンスとスタイル宣言を関連付けています。これは次のコードに示すようにシンタックスを簡潔にするためですnew_style.setStyle("themeColor", "haloOrange")

setStyle() メソッドと getStyle() メソッドの詳細については、『ActionScript 2.0 コンポーネントリファレンスガイド』のUIObject.setStyle()およびUIObject.getStyle()を参照してください。


 

このページに新しいコメントが追加された場合に、電子メールでの通知を希望する。 | コメントレポート

現在のページ: http://livedocs.adobe.com/flash/9.0_jp/main/00002461.html