4

次のデフォルトの色を変更したいアイテムレンダラーがあります。

<s:ItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009"
                xmlns:s="library://ns.adobe.com/flex/spark"
                xmlns:mx="library://ns.adobe.com/flex/mx"
                initialize="init(event)"
                creationComplete="created(event)"
                dataChange="created(event)"
                width="100%"
                maxWidth="{FlexGlobals.topLevelApplication.width}"
                contentBackgroundColor.hovered="0xff0018"
                focusColor="0xff00ff"
                contentBackgroundAlpha="0.8">

        <s:states>
            <s:State name="normal"/>
            <s:State name="hovered"/>
            <s:State name="selected"/>
        </s:states>

上記のコードのスタイルは効果がありません。

また、contentBackgroundColorをList要素に追加しようとしましたが、リストの背景のみが変更され、アイテムは変更されませんでした。

cssも機能しません：

s|ItemRenderer{
    backgroundColor:#2e2e2e;
}

アイテムレンダラーの背景色を変更するにはどうすればよいですか？

私はそれを皮を剥ぐことができることを知っていますが、それは単純な色の変更にはやり過ぎであり、皮を剥ぐことなく数年前にそれが機能していたことを確信しています。

4

1 に答える 1

8

これは、最初は常に少し混乱します。私の意見では、スタイル名はあまり選択されていません。残酷な詳細はすべてクラスのdrawBackground()メソッドにあります。ItemRenderer

スタイルはコンポーネント自体にcontentBackgroundColor設定できるものListであり、レンダラーには影響しません。リストの背景色を塗りつぶしますが、通常、レンダラーがその領域全体を占めるため、表示されることはありません。たとえば、リストが高いのに1つまたは2つのアイテムしかない場合に表示されます（したがって、下部のスペースはレンダラーでカバーされません）。

レンダラーの背景色を設定するには：

を使用する代わりにcontentBackgroundColor、alernatingItemColorsスタイルを使用します。このスタイルでは、値の配列が必要です。1つの色だけが必要な場合は、配列に1つの要素を配置するだけです。

alternatingItemColors="[#c0c0c0]"

のコードを見てdrawBackground()、背景色にアルファを設定する場合は、自分で背景を描画する必要があります（以下を参照）。

設定したいその他の背景関連のスタイル：

  • downColor
  • selectionColor
  • rollOverColor

独自の背景色を描画するには：

autoDrawBackgroundプロパティをfalseに設定します。これは、さまざまなレンダラー状態（「通常」、「選択済み」、「ホバー」など）すべてに対して独自の色を描画する必要があることを意味します。幸い、レンダラー内で、選択した背景オブジェクト（ `Rectなど）で上記で使用したのと同じ状態構文を使用してこれを行うことができます。

<s:ItemRenderer autodrawBackground="false">
    <s:states>
        <s:State name="normal"/>
        <s:State name="hovered"/>
        <s:State name="selected"/>
    </s:states>
    <s:Rect id="theBackgroundObject" top="0" bottom="0" left="0" right="0">
        <s:fill>
            <s:SolidColor color="#FF0000" color.hovered="#00FF00"
                alpha="1" alpha.hovered=".5" />
        </s:fill>
    </s:Rect>
</s:ItemRenderer>
于 2013-03-05T23:52:51.353 に答える