Flex - Как измениться, открывает высоту DropDownList
Используя FB4, я хочу изменить высоту открытой искры DropDownList. По умолчанию это показывает до 6 объектов перед прокруткой. Мой dropdownlist содержит 7 объектов, таким образом, я хочу изменить высоту открытого выпадающего списка для установки всем 7 объектам без прокрутки. Как обходное решение, я изменил размер шрифта объектов так, чтобы они были меньшими и все 7 соответствий, но шрифт меньшего размера не выглядит хорошим. Существует ли способ изменить эту высоту? Я довольно плохо знаком с Flash, поэтому если это - сложное решение, быть подробным :-).
4 ответа
Проблема в том, что во Flex 4 для скина DropDownListSkin определено maxHeight="134" для скина по умолчанию, который вы, вероятно, используете. Это заставляет появляться полосу прокрутки, если объекты вытягиваются за пределы этой высоты. Все, что вам нужно сделать, это скопировать/вставить их код DropDownListSkin в пользовательский скин и применить его к вашему DropDownList через CSS:
VariableHeightDropDownListSkin
<?xml version="1.0" encoding="utf-8"?>
<s:Skin xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
alpha.disabled=".5">
<!-- host component -->
<fx:Metadata>
<![CDATA[
/**
* @copy spark.skins.spark.ApplicationSkin#hostComponent
*/
[HostComponent("spark.components.DropDownList")]
]]>
</fx:Metadata>
<s:states>
<s:State name="normal" />
<s:State name="open" />
<s:State name="disabled" />
</s:states>
<s:PopUpAnchor id="popUp" displayPopUp.normal="false" displayPopUp.open="true" includeIn="open"
left="0" right="0" top="0" bottom="0" itemDestructionPolicy="auto"
popUpPosition="below" popUpWidthMatchesAnchorWidth="true">
<!-- removed maxHeight! -->
<s:Group id="dropDown" minHeight="22">
<!-- border/fill -->
<s:Rect left="0" right="0" top="0" bottom="0">
<s:stroke>
<s:SolidColorStroke color="0x5380D0" />
</s:stroke>
<s:fill>
<s:SolidColor color="0xFFFFFF" />
</s:fill>
</s:Rect>
<s:Scroller left="0" top="0" right="0" bottom="0" focusEnabled="false" minViewportInset="1">
<s:DataGroup id="dataGroup" itemRenderer="spark.skins.spark.DefaultItemRenderer">
<s:layout>
<s:VerticalLayout gap="0" horizontalAlign="contentJustify"/>
</s:layout>
</s:DataGroup>
</s:Scroller>
<s:filters>
<s:DropShadowFilter blurX="20" blurY="20" distance="7" angle="90" alpha="0.45" color="0x6087CC" />
</s:filters>
</s:Group>
</s:PopUpAnchor>
<s:Button id="openButton" left="0" right="0" top="0" bottom="0" focusEnabled="false"
skinClass="spark.skins.spark.DropDownListButtonSkin" />
<s:Label id="labelDisplay" verticalAlign="middle" lineBreak="explicit"
mouseEnabled="false" mouseChildren="false"
left="7" right="30" top="2" bottom="2" width="75" verticalCenter="1" />
</s:Skin>
Sample Application
<?xml version="1.0" encoding="utf-8"?>
<s:Application
xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx">
<fx:Style>
@namespace mx "library://ns.adobe.com/flex/mx";
@namespace s "library://ns.adobe.com/flex/spark";
s|DropDownList
{
skinClass: ClassReference("VariableHeightDropDownListSkin");
}
</fx:Style>
<s:DropDownList labelField="name" horizontalCenter="0" verticalCenter="0">
<s:layout>
<s:VerticalLayout requestedRowCount="7"/>
</s:layout>
<s:dataProvider>
<mx:ArrayCollection>
<fx:Object name="one"/>
<fx:Object name="two"/>
<fx:Object name="three"/>
<fx:Object name="four"/>
<fx:Object name="five"/>
<fx:Object name="six"/>
<fx:Object name="seven"/>
</mx:ArrayCollection>
</s:dataProvider>
</s:DropDownList>
</s:Application>
Дайте мне знать, если это поможет, Lance
в FB3 это rowCount, потому что раскрывающийся список является потомком элемента управления списком. FB4 наверное похож.
myDropdown.rowCount = 7;
Обычно я использую что-то вроде
myDropdown.rowCount = myDataProvider.lenght();
К сожалению, во Flex 4 это намного сложнее, чем во Flex 3:
Вы должны иметь возможность определять макет для DropDownList с более высоким requestRowCount ( подробности здесь ), но для> 6 строк вам нужно проделать больше работы ( Flex issue SDK-25364 ).
viatropos ответ будет работать, однако вы должны стараться как можно больше избегать переопределения всего скина .
В этом случае вы заметите, что в коде viatropos VariableHeightDropDownListSkin, что группа, из которой он удалил атрибут maxHeight, также указан "id".
Теперь посмотрите документацию для DropDownList, и вы заметите в разделе SkinParts, что есть часть скина «dropDown». Фактически это свойство DropDownList.
Таким образом, вместо переопределения скина вы можете просто использовать ActionScript (здесь я использую UIComponent.DEFAULT_MAX_HEIGHT, но вы можете использовать все, что захотите):
(MyDropDownList.dropDown as UIComponent).maxHeight = UIComponent.DEFAULT_MAX_HEIGHT;