March 16th, 2007 by Kyle
Tags: ActionScript, combobox, components, Flex, mxml
Posted in: Flex
I wrote a simple little extension to ComboBox to allow the dropdown to expand to the width of the widest entry and the ComboBox input to expand/contract to the width of the selected item. This is based on the simple ComboBox sample from the docs found here.
Here is the source code for the component:
<mx:ComboBox xmlns:mx="http://www.adobe.com/2006/mxml" creationComplete="init()" change="onChange(event);">
<mx:Script>
<![CDATA[
import mx.controls.ComboBase;
import mx.core.EdgeMetrics;
private function init():void{
this.dropdownWidth=calculatePreferredSizeFromData(this.dataProvider.length).width;
}
private function onChange(e:Event):void{
var txt:String = itemToLabel(selectedItem);
if(measureText(txt).width > 0){
var buttonWidth:Number = getStyle("arrowButtonWidth");
// Text fields have 4 pixels of white space added to each side
// by the player, so fudge this amount.
// If we don’t have any data, measure a single space char for defaults
var bm:EdgeMetrics = borderMetrics;
var textWidth:Number = measureText(txt).width + bm.left + bm.right + 8;
this.width = textWidth + buttonWidth;
}
else {
this.width=DEFAULT_MEASURED_MIN_WIDTH
}
}
]]>
</mx:Script>
</mx:ComboBox>
No Comments »
Recent Comments