1

カスタム Flex コンポーネントのデフォルト スタイルを定義するにはどうすればよいですか? 良いスタートでしたが、他のコンポーネントを含むカスタム コンポーネントのカスタム スタイルを作成したいと考えています。

カスタム コンポーネントは Canvas です。他のキャンバス、ボタン、リストなどが含まれています。子コンポーネントに親コンポーネントと同じ値を使用させたくありません。また、いくつかのスタイル値を親コンポーネントに「ジャンプ」させ、特定の子にのみ影響を与えたい (それらのすべてではありません）。

それぞれに個別のスタイルではなく、親と各サブコンポーネントの値を持つ単一の CSS 定義が必要です。

実際には標準の CSS ではないスタイル値を CSS ファイルに含めることはできますか (例: buttonCornerRadius、mainPaneBackgroundColor、actionBitmap)。

スタイルを子コンポーネントにどこに伝播すればよいですか? this.updateDisplayList() ?

setStyle または新しい CSS ファイルの読み込み (StyleManager にはイベントがないため) によって値が変更されたかどうかを知るにはどうすればよいですか?

ありがとう

4

2 に答える 2

2

よりきめ細かい方法は、各子に CSS を追加することですが、これはメンテナンスと可読性の悪夢です。

<mx:List dataProvider="{companies}" dropShadowEnabled="true" paddingTop="10" paddingBottom="10" paddingRight="5" paddingLeft="15" backgroundColor="0xDFE8FF"/>

それぞれの子を Class として作成し、CSS を各 Class ファイルに追加する方法は、より細分化された方法ですが、それでも素晴らしい方法ではありません。

マスター CSS で子コンポーネントの各タイプ (List、ComboBox、Button など) のスタイルを設定することもできます。

List {
    dropShadowEnabled: true;
    paddingTop: 10;
}

ただし、同じタイプのコンポーネントに対して異なるスタイルを使用する場合は、いくつかのオプションがあります。

各子に styleName を与えてから、マスター CSS でスタイルを設定できます。

CustomerSelectionForm.mxml:

<?xml version="1.0" encoding="utf-8"?>
<mx:Form xmlns:mx="http://www.adobe.com/2006/mxml">
    <mx:List styleName="customerList" dataProvider="{customers}" />
</mx:Form>


CompanySelectionForm.mxml:

<?xml version="1.0" encoding="utf-8"?>
<mx:Form xmlns:mx="http://www.adobe.com/2006/mxml">
    <mx:List styleName="companyList" dataProvider="{companies}" />
</mx:Form>

styles.css:

.customerList {
    backgroundColor: "0xDFE8FF";
}

.companyList {
    backgroundColor: "0x74ADE7";
}

または、各子をカスタム クラスとして作成し、そのクラスをマスター CSS で参照することもできます。

CustomerList.mxml:

<?xml version="1.0" encoding="utf-8"?>
<mx:List xmlns:mx="http://www.adobe.com/2006/mxml">
</mx:List>

CompanyList.mxml:

<?xml version="1.0" encoding="utf-8"?>
<mx:List xmlns:mx="http://www.adobe.com/2006/mxml">
</mx:List>

styles.css:

CustomerList {
    backgroundColor: "0xDFE8FF";
}

CompanyList {
    backgroundColor: "0x74ADE7";
}

この方法は、コンポーネントを動的に構築する場合、または特定のタイプのコンポーネントを再利用する場合に特に役立ちます。特に、これらのカスタム クラスにはクラス固有のビジネス ロジックも含めることができるため、私はこの方法をよく使用します。

于 2009-04-07T14:17:00.717 に答える
0

Flex コンポーネントの開発者として、私は Flex チームがフレームワークで行っていることを実行しようとしています。つまり、個別にスタイルを設定したい各子の styleName スタイルを公開します。それらを連鎖させることもできます。フレームワークから直接の例として、ドロップダウン リストのスタイルがあり、ComboBox垂直スクロールバーの があります。dropdownStyleNameListverticalScrollBarStyleName

ComboBox
{
    dropdownStyleName: myComboDropdownStyles;
}

.myComboDropdownStyles
{
    backgroundColor: #c4c4ff;
    verticalScrollBarStyleName: myVScrollBarStyles;
}

.myVScrollBarStyles
{
    borderColor: #8686a4;
}
于 2009-04-10T20:38:21.560 に答える