CSS の適用

テキストフィールドには、プレーンテキストまたは HTML 形式のテキストを含めることができます。プレーンテキストはインスタンスの text プロパティに格納し、HTML テキストは htmlText プロパティに格納します。

CSS スタイル宣言を使用すると、多数の異なるテキストフィールドに適用できるテキストスタイルを定義することができます。CSS スタイル宣言は、アプリケーションコード内で作成することも、実行時に外部 CSS ファイルからロードすることもできます。

CSS スタイルの処理には flash.text.StyleSheet クラスを使用します。StyleSheet クラスでは、一部の CSS プロパティに限り認識されます。StyleSheet クラスでサポートされるスタイルプロパティの詳細な一覧については、『ActionScript 3.0 コンポーネントリファレンスガイド』の flash.textStylesheet の項を参照してください。

次の例に示すように、StyleSheet オブジェクトを使用してコードで CSS を作成し、作成したスタイルを HTML テキストに適用することができます。

var style:StyleSheet = new StyleSheet();

var styleObj:Object = new Object();
styleObj.fontSize = "bold";
styleObj.color = "#FF0000";
style.setStyle(".darkRed", styleObj);

var tf:TextField = new TextField();
tf.styleSheet = style;
tf.htmlText = "<span class = 'darkRed'>Red</span> apple";

addChild(tf);

この例のコードでは、StyleSheet オブジェクトを作成した後、一連のスタイル宣言プロパティを保持する単純オブジェクトを作成します。続いて、StyleSheet.setStyle() メソッドを呼び出します。このメソッドによって、.darkRed という名前の新しいスタイルがスタイルシートに追加されます。その後、TextField オブジェクトの styleSheet プロパティに StyleSheet オブジェクトを割り当てて、スタイルシートによるフォーマットを適用します。

CSS スタイルを有効にするには、htmlText プロパティが設定される前に、TextField オブジェクトにスタイルシートを適用する必要があります。

設計上、スタイルシートを含むテキストフィールドは編集できません。入力テキストフィールドがあり、スタイルシートが割り当てられている場合、テキストフィールドにはスタイルシートのプロパティが表示されますが、ユーザーはテキストフィールドに新しいテキストを入力することはできません。また、スタイルシートが割り当てられたテキストフィールドで、次の ActionScript API を使用することはできません。

テキストフィールドにスタイルシートが割り当てられている場合に、後で TextField.styleSheet プロパティを null に設定すると、TextField.text プロパティと TextField.htmlText プロパティの両方のコンテンツがタグと属性をそれぞれのコンテンツに追加し、以前に割り当てられたスタイルシートのフォーマットを組み込みます。元の htmlText プロパティを維持するには、スタイルシートを null に設定する前に、このプロパティを変数に保存します。