1 Reply Latest reply on Jun 23, 2009 11:29 PM by Craig Grummitt

    problems skinning/styling ComboBox component

    Craig Grummitt Level 3


      So the first image is the design brief, and below it is my attempt so far. Some ways to go, and the limitations and scarce documentation of this process is getting to me. So i'm putting a call out to see if anyone's well across this process and could assist, or step me through it?


      been a while since i skinned a component in AS2, and I remember I prefered to write my own components rather than go through this process at the time. but i am hoping to use the built-in Flash component this time.


      So what I need help with is:

      1. Adjust scrollbar scrubber and track width, hopefully add padding around scrubber, and hopefully this would resolve the issue of losing the scrubber's black border on the right.
      2. Resolve issues with the combo-button (what's that white border doing there?)
      3. Style font correctly in combo-button
      4. Increase list row height
      5. Add dotted line between list rows

      (I'm ignoring the blue numbers)


      If anyone can help with even just one of those issues, i'd love to hear from you.


      Info about my attempt so far:


      I have skinned several clips, such as scrollThumb*, scrollUpArrow*, scrollDownArrow*, comboDownArrow*, etc.


      I have styled with the following:

      comboBox.setStyle("backgroundColor", 0x504C4B);
      comboBox.dropdown.setStyle("backgroundColor", 0x504C4B);
      comboBox.setStyle("themeColor", 0x1F90AE);
      comboBox.setStyle("color", 0xC4C0BF); 
      comboBox.setStyle("textSelectedColor", 0xC4C0BF); 
      comboBox.setStyle("textRollOverColor", 0xC4C0BF); 
      comboBox.setStyle("alternatingRowColors", [0x504C4B, 0x504C4B]);
      comboBox.setStyle("borderStyle", 'none');

      I have attached the fla I've worked with so far in a zip.


      Thanks for your help!

        • 1. Re: problems skinning/styling ComboBox component
          Craig Grummitt Level 3

          Well I resolved this merely by lowering my expectations!


          Leaving this unanswered because I am hoping there must be answers to these issues out there for future reference.


          But for now, my comboBox looks like this:


          And i achieve this by skinning some clips, and adjusting my styling code:

          combo.setStyle("backgroundColor", 0x504C4B);
          combo.dropdown.setStyle("backgroundColor", 0x504C4B);
          combo.setStyle("themeColor", 0x1F90AE); 
          combo.setStyle("rollOverColor", 0x46bbda); 
          combo.setStyle("color", 0xC4C0BF); 
          combo.setStyle("textSelectedColor", 0xFFFFFF); 
          combo.setStyle("textRollOverColor", 0xFFFFFF); 
          combo.setStyle("alternatingRowColors", [0x504C4B, 0x504C4B]);
          combo.setStyle("borderStyle", 'none'); 
          combo.text_mc.setStyle("themeColor", 0x00FF99);