Skinned scrollbar thumb does not reach the bottom of the track

Question

I have an application in Flex 4.1 where there is a vertical List, bound to an array. As long as the List scrollbar is not skinned, everything is ok, the thumb oscillates from top to bottom of the track. But after adding a skin it works bad. The thumb never goes to the very bottom of the track when scrolling, but locks somewhere in between. For very long list of elements, it even stops halfway.
Despite of this behavior, the list is in fact scrolled to the last element - so the problem is not with some elements at the bottom of the list being unreachable, but it is only about the thumb not reaching the bottom of the track, which looks as if the list was locked halfway. The skin is very simple and it is just about defining an image for the track and thumb. Is there any method to ensure that the thumb always goes to the bottom of the track, regardless list size?

Answer 1

I have 3 skins: for the scrollbar itself, for the track and for the thumb.Thumb and track skins are using fxg vector images, but exactly the same negative result is without fxg images, e.g. only using simple filled rectangles in place of the fxg - I just checked it.
For Scrollbar:
<?xml version="1.0" encoding="utf-8"?>
<s:SparkSkin
        xmlns:flex="http://ns.adobe.com/mxml/2009"
        xmlns:s="library://ns.adobe.com/flex/spark"   
        minWidth="15" minHeight="35" alpha.disabled="0.5" alpha.inactive="0.5" >
     <s:states>
        <s:State name="normal" />
         <s:State name="inactive" />
        <s:State name="disabled" />
    </s:states>
    <s:Button id="track" 
              focusEnabled="false" alpha="0.3"
              skinClass="skins.VPhotoScrollbarTrackSkin" />
    <s:Button id="thumb"
              focusEnabled="false" visible.inactive="false" alpha="0.5" left="-5"
              skinClass="skins.VPhotoScrollbarThumbSkin" />
</s:SparkSkin>
For the thumb:
<?xml version="1.0" encoding="utf-8"?>
<s:SparkSkin
    xmlns:flex="http://ns.adobe.com/mxml/2009"
    xmlns:s="library://ns.adobe.com/flex/spark"
    xmlns:fxg="fxg.*"
>
    <s:states>
        <s:State name="up" />
        <s:State name="over" />
        <s:State name="down" />
        <s:State name="disabled" />
    </s:states>
    <fxg:thumb />
</s:SparkSkin>
For the track:
<?xml version="1.0" encoding="utf-8"?>
<s:SparkSkin
    xmlns:flex="http://ns.adobe.com/mxml/2009"
             xmlns:s="library://ns.adobe.com/flex/spark"
            xmlns:fxg="fxg.*"
>
    <s:states>
        <s:State name="up" />
        <s:State name="down" />
        <s:State name="over" />
        <s:State name="disabled" />
    </s:states>
    <fxg:track  />
</s:SparkSkin>