5 Replies Latest reply on Oct 22, 2010 12:06 AM by Shongrunden

    help with a vertical scroll bar issue with a List component

    jcahill23 Level 1

      hi. i have a basic <s:list> that uses an XMLListCollection as it's data provider and a very basic itemrenderer. when a row in the list is clicked a function gets the list.selectedIndex then populates some text fields with more xml data. that all works fine.. the problem i have is that the vertical scroll bar on the list seems to be "clickable" - just like a row in the list. the scroll bar scrolls normally but when it's clicked the selectedIndex becomes -1 which is not helpful b/c the value -1 is passed to the XMLListCollection.

       

      any ideas? cheers.

        • 1. Re: help with a vertical scroll bar issue with a List component
          Flex harUI Adobe Employee

          Build a small simple test case and see if the problem exists there.

          • 2. Re: help with a vertical scroll bar issue with a List component
            jcahill23 Level 1

            my test case is my app...and the problem exists...more specifically, the problem is that the scrollbar is clickable...i've skinned the scrollbar track and it's clickable and when it's clicked it passes -1 as the selectedIndex for the list. cheers

            • 3. Re: help with a vertical scroll bar issue with a List component
              Shongrunden Adobe Employee

              I think you're looking to use what was the itemClick event in the mx List.  That doesn't exist in the spark List currently.  Can you get by using the change event which is fired any time the user changes the selection whether that is via the mouse or keyboard?  If not you might want to look at adding click handlers to your item renderers, here's an example: http://forums.adobe.com/message/2569066#2569066

              • 4. Re: help with a vertical scroll bar issue with a List component
                jcahill23 Level 1

                thanks but still problematic...surely the <s:List> component shouldn't return a value when the scrollbar thumb is clicked? i created a very basic list (see below) and made the list dimensions short enough so that there is a vertical scrollbar and found that when the scrollbar thumb is clicked the trace(event.currentTarget.selectedIndex) returns a number. that's annoying b/c i just want a selectedIndex value for a row that is clicked not the scrollbar.

                any ideas to get around? cheers

                 

                <fx:Script>

                <![CDATA[

                protected function list1_clickHandler(event:MouseEvent):void

                {

                trace(event.currentTarget.selectedIndex);

                }

                ]]>

                </fx:Script>

                 

                <s:List x="162" click="list1_clickHandler(event)" y="276" labelField="@label" width="144" height="153">

                <s:dataProvider>

                <s:XMLListCollection>

                <fx:XMLList xmlns="">

                <node label="one"/>

                <node label="two"/>

                <node label="three"/>

                <node label="four"/>

                <node label="five"/>

                <node label="six"/>

                <node label="seven"/>

                <node label="eight"/>

                <node label="nine"/>

                <node label="ten"/>

                <node label="eleven"/>

                 

                </fx:XMLList>

                </s:XMLListCollection>

                </s:dataProvider>

                </s:List>

                • 5. Re: help with a vertical scroll bar issue with a List component
                  Shongrunden Adobe Employee

                  The default value of selectedIndex is -1.  If you haven't selected any items in the List then this will always return -1.

                   

                  Here's a sample application, notice if you select an item and then click the scrollbar it isn't -1:

                   

                  <s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
                                 xmlns:s="library://ns.adobe.com/flex/spark">
                     
                      <fx:Script>
                          <![CDATA[
                              import spark.events.IndexChangeEvent;
                              protected function list1_clickHandler(event:MouseEvent):void {
                                  trace("Click event:", event.currentTarget.selectedIndex);
                              }

                   

                              protected function list1_changeHandler(event:IndexChangeEvent):void {
                                  trace("change event:", event.currentTarget.selectedIndex);
                              }

                   

                          ]]>
                      </fx:Script>
                     
                      <s:List click="list1_clickHandler(event)" change="list1_changeHandler(event)" width="144" height="153">
                          <s:ArrayList source="{[1,2,3,4,5,6,7,8,9,10]}" />
                      </s:List>
                     
                  </s:Application>