Flex - Change position of scrollbar to the top of a HorizontalList component

Question

Hi

By default, the Horizontal ScrollBar of a HorizontalList component will be at the bottom. Is there a way to reposition it so it is at the top?

Just for clarity, I do not mean moving the scroll position using either scrollToIndex or horizontalScrollPosition or similar, but the actual physical position of the scrollbar component.

Any suggestions would be very appreciated!

Answer 1

I was looking for something similar myself a while ago and found this post. I eventually ended up solving my problem in another way, so didn't use that solution, however it might work for what you want.

Answer 2

I've had to do the same thing previously. I had to dig around in the base classes (to handle some masking/positioning issues) and this is what I came up with:

package
{
    import flash.display.DisplayObject;

    import mx.controls.HorizontalList;
    import mx.core.EdgeMetrics;

    public class ReverseHList extends HorizontalList
    {
     override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void
     {
      super.updateDisplayList(unscaledWidth, unscaledHeight);

      var w:Number = unscaledWidth;
      var h:Number = unscaledHeight;
      var vm:EdgeMetrics = viewMetrics;
      if (horizontalScrollBar && horizontalScrollBar.visible)
         {
             horizontalScrollBar.setActualSize(w - vm.left - vm.right,
                                               horizontalScrollBar.minHeight);
             horizontalScrollBar.move(vm.left, vm.top);

             horizontalScrollBar.enabled = enabled;
         }

         var mask:DisplayObject = maskShape;

            var wd:Number = w - vm.left - vm.right;
            var ht:Number = h - vm.top - vm.bottom;

            mask.width = wd < 0 ? 0 : wd;
            mask.height = ht < 0 ? 0 : ht;

            mask.x = vm.left;
            mask.y = vm.top + vm.bottom;
     }

     override protected function adjustListContent(unscaledWidth:Number = -1,
                                       unscaledHeight:Number = -1):void
     {
      super.adjustListContent(unscaledWidth, unscaledHeight);

      var lcx:Number = viewMetrics.left + listContent.leftOffset;
      var lcy:Number = (viewMetrics.top + listContent.topOffset) + viewMetrics.bottom;
      listContent.move(lcx, lcy);
     }

    }
}