1 Reply Latest reply on May 13, 2010 5:26 AM by JcFx.Eu

    DateChooser Rollover Skin Bug

    JcFx.Eu Level 1

      Summary: When applying rollOverIndicatorSkin, selectionIndicatorSkin, todayIndicatorSkin styles to a DateChooser component, only the selectionIndicatorSkin style appears to be working - the other two settings are ignored.




      Using Flex 4


      I'm extending the DateChooser component for an application. I''ve created a custom class, which is instantiated as follows:


                  calendar = addChild(new McbdDateChooser()) as McbdDateChooser;
                  calendar.displayedMonth = currentMonth;
                  calendar.displayedYear = currentYear;
                  calendar.selectedRanges = selectedDates;


      Within my custom datechooser, the important functions are:


              public function Init($config:Configuration_Manager):void
                  Console.AlwaysDebug("McbdDateChooser Init: "  + build);
                  Config = $config;


              protected function setStyles():void
                  Console.Debug("McbdDateChooser setStyles");
                  this.setStyle("fontSize", 10);
                  this.setStyle("todayColor", 0xFFFFFF);
                  this.setStyle("selectionColor", 0xFFFFFF);
                  this.setStyle("rolloverColor", 0xFFFFFF);
                  this.setStyle("rollOverIndicatorSkin", (getDefinitionByName(getQualifiedClassName(new McbdRolloverSkin())) as Class));
                  this.setStyle("selectionIndicatorSkin", (getDefinitionByName(getQualifiedClassName(new McbdRolloverSkin())) as Class));
                  this.setStyle("todayIndicatorSkin", (getDefinitionByName(getQualifiedClassName(new McbdRolloverSkin())) as Class));
              protected function setParameters():void
                  //Console.Debug("McbdDateChooser setParameters");
                  this.monthNames = ["JAN", "FEB", "MAR", "APR", "MAY", "JUN", "JUL", "AUG", "SEP", "OCT", "NOV", "DEC"];
                  this.showToday = true;




      McbdRolloverSkin is just a test class at the moment. It extends UIComponent and simply overrides the visible parameter so all the rollover / selection / today highlights should be hidden:

              public override function set visible(value:Boolean):void
                  Console.Debug("SET VISIBLE: " + value);
                  super.visible = false;



      I'm getting some odd behaviour, however. The selection indicator is being hidden correctly, but the rollover and today indicators remain visible. When I trace down the children of the DateChooser control, I find the following:


      DEBUG: Tracing Children: CalendarTest0.McbdDateChooser5
      DEBUG: CalendarTest0.McbdDateChooser5
      DEBUG: > CalendarTest0.McbdDateChooser5.UIComponent6
      DEBUG: > CalendarTest0.McbdDateChooser5.UIComponent7
      DEBUG: > CalendarTest0.McbdDateChooser5.CalendarLayout8
      DEBUG: >> CalendarTest0.McbdDateChooser5.CalendarLayout8.McbdRolloverSkin80
      DEBUG: >> CalendarTest0.McbdDateChooser5.CalendarLayout8.McbdRolloverSkin79
      DEBUG: >> CalendarTest0.McbdDateChooser5.CalendarLayout8.McbdRolloverSkin78
      DEBUG: >> CalendarTest0.McbdDateChooser5.CalendarLayout8.McbdRolloverSkin77
      DEBUG: >> CalendarTest0.McbdDateChooser5.CalendarLayout8.DateChooserRollOverIndicatorSkin59
      DEBUG: >> CalendarTest0.McbdDateChooser5.CalendarLayout8.DateChooserTodayIndicatorSkin58


      I have four selected dates on my calendar. These have been correctly replaced with the McbdRolloverSkin. The Today indicator and RollOver indicator, however, remain at their default settings.


      Can anyone suggest what is going wrong here? Am I missing a step in applying the skin or is my work somehow being done and then undone?


      Many thanks in advance for any assistance.



      JcFx Ltd.


        • 1. Re: DateChooser Rollover Skin Bug
          JcFx.Eu Level 1

          I partly answered this myself - if you override the createChildren() method and set the properties before it is called, then everything works as expected:


                    protected override function createChildren():void
                      Console.Debug("McbdDateChooser createChildren");
                      this.setStyle("rollOverIndicatorSkin", (getDefinitionByName(getQualifiedClassName(new McbdRolloverSkin())) as Class));
                      this.setStyle("selectionIndicatorSkin", (getDefinitionByName(getQualifiedClassName(new McBdSelectionSkin())) as Class));
                      this.setStyle("todayIndicatorSkin", (getDefinitionByName(getQualifiedClassName(new McbdTodaySkin())) as Class));


          Does this mean you have to create a custom class to override these style settings? If so then I don't see anything about that in the livedocs. Otherwise, is there something I am missing?



          JcFx Limited