Question

我正在开发一个flex应用程序。该项目有一个全局样式表，其中包含声明：

s|DataGroup{
    alternating-item-colors:#FFFFFF,#F7F7FA;
}

现在，在我的一个对话框中，我想要一个具有不同配色方案的DropDownList。我尝试了很多东西，使用属性并使用我的DropDownList样式。

<s:DropDownList id="orientationEntry" width="200"
                dataProvider="{model.orientationList}"
                styleName="blackDropDown"
                alternatingItemColors="[#222222,#111111]"
                >

在我的样式表中（我尝试了很多不同的东西）：

.blackDropDown s|DataGroup {
    alternating-item-colors: #222222,#111111;
}

#orientationEntry s|DataGroup {
    alternating-item-colors: #222222,#111111;
}

s|DropDownList#orientationEntry s|DataGroup {
    alternating-item-colors: #222222,#111111;
}

但这些都没有任何影响。我的下拉列表始终显示白色和浅灰色线条。为了使它工作，（即有黑色和深灰色线条），我需要从全局样式表中删除s|DataGroup声明。但我想避免这种情况。我有点惊讶的是，对于更具体的案例，不能覆盖一般性声明。

所以问题是：如何在不重新定义应用程序的所有数据组的默认颜色的情况下覆盖DropDownList的弹出列表的背景颜色？

或者，如何在不更改全局样式表的情况下取消全局s|DataGroup声明？

Answer 1

我认为您可以通过as3设置此项，但如果您希望这种可重用方式是：

基于DropDownList创建一个新的MXML皮肤。

在某些编辑器中搜索（ CTRL + O ，编写滚动，然后按ENTER或点击进入）：

<s:Scroller id="scroller" left="0" top="0" right="0" bottom="0" hasFocusableChildren="false" minViewportInset="1">
                <!--- @copy spark.components.SkinnableDataContainer#dataGroup-->
                <s:DataGroup id="dataGroup" itemRenderer="spark.skins.spark.DefaultItemRenderer">
                    <s:layout>
                        <s:VerticalLayout gap="0" horizontalAlign="contentJustify" requestedMinRowCount="1" requestedMaxRowCount="6"/>
                    </s:layout>
                </s:DataGroup> 
            </s:Scroller>

设置指定颜色的属性：

alternatingItemColors="{[0x222222, 0x111111]}"

你现在有这个：

<!--- @private -->
            <s:Scroller id="scroller" left="0" top="0" right="0" bottom="0" hasFocusableChildren="false" minViewportInset="1">
                <!--- @copy spark.components.SkinnableDataContainer#dataGroup-->
                <s:DataGroup id="dataGroup" alternatingItemColors="{[0x222222, 0x111111]}" itemRenderer="spark.skins.spark.DefaultItemRenderer">
                    <s:layout>
                        <s:VerticalLayout gap="0" horizontalAlign="contentJustify" requestedMinRowCount="1" requestedMaxRowCount="6"/>
                    </s:layout>
                </s:DataGroup> 
            </s:Scroller>

现在只需在组件中设置skinClass（我的示例是在pacakage 皮肤）：

<s:DropDownList id="ddlFiltros" width="237" height="30" buttonMode="true"

skinClass="skins.skin_dropdown"

dataProvider="{_arrayCamposFiltro}" labelField="label"
prompt="ELEGIR CAMPO" selectedIndex="-1"/>

这对全球风格没有影响。

但是你可以用自己的风格设置：

s|DataGroup{
    alternating-item-colors:#FFFFFF,#F7F7FA;
}

.blackDropDown {
    skinClass: ClassReference("skins.skin_dropdown");
}

而不是定义skinClass，定义styleName：

<s:DropDownList id="ddlFiltros" width="237" height="30" buttonMode="true" 

styleName="blackDropDown"

dataProvider="{_arrayCamposFiltro}" labelField="label"
prompt="ELEGIR CAMPO" selectedIndex="-1"/>

你明白了：

DropDownList和DataGroup之间的Flex 4.6颜色样式冲突

1 个答案: