3 Replies Latest reply on Jan 2, 2010 1:40 PM by WebTrauma

    Custom itemRenderer for ComboBox in Flex 4

    WebTrauma Level 1

      Hi,

       

      I am new to Flex and am really enjoying spooling up on Flash Builder and Flex 4...please be patient with a newb!

       

      I need to create custom itemRenderers within ComboBoxes that will vary font size and/or padding for individual list items.

       

      I started with an excellent example from Flex 3 and tried to adapt it: http://blog.flexexamples.com/2007/09/25/creating-a-custom-combobox-item-renderer-in-flex/c omment-page-1/#comment-6553

       

      The combo box works without the itemRenderer (but of course does not style the items).

       

      Any advice is vastly appreciated.

       

       

      ComboBoxItemRenderer.mxml:

      <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/halo">

       

       

      xmlns:fx="

      http://ns.adobe.com/mxml/2009"

      xmlns:s="

      library://ns.adobe.com/flex/spark"

      xmlns:mx="

      library://ns.adobe.com/flex/halo">

       

      xmlns:fx="

      http://ns.adobe.com/mxml/2009"

      xmlns:s="

      library://ns.adobe.com/flex/spark"

      xmlns:mx="

      library://ns.adobe.com/flex/halo">

       

       

       

      <s:VGroup>

       

      <s:Label text="{data.@name}"

      fontSize="

      11"

      fontWeight="

      bold"/>

       

       

      <s:Label text="{data.@abbrev}"

      fontSize="

      9"

      paddingLeft="

      5"/>

       

       

      </s:VGroup>

       

       

      </s:ItemRenderer>

       

       

       

       

      Code from my main.mxml file:

       

      <fx:Declarations>

       

       

       

      <fx:XMLList id="statesXMLList">

      <state abbrev="AL" name="Alabama" />

      <state abbrev="AK" name="Alaska" />

      <state abbrev="AZ" name="Arizona" />

      <state abbrev="AR" name="Arkansas" />

      <state abbrev="CA" name="California" />

      <state abbrev="CO" name="Colorado" />

      <state abbrev="CT" name="Connecticut" />

       

      </fx:XMLList>

       

       

       

       

       

      </fx:Declarations>

       

      <mx:ComboBox id="comboBox" x="15" y="115"

      labelField="

      @name"

      dataProvider="

      {statesXMLList}"

      rowCount="

      3"

      itemRenderer="

      ComboBoxItemRenderer"/>