Setting the selected indices on a Spark List control in Flex 4

by Peter deHaan on June 16, 2009

in List (Spark), Vector, beta1

The following example shows how you can set the selected indices on a Spark List control in Flex 4 by setting the selectedIndices property to a Vector object.

For more information on MXML Vector support in Flex 4, see the MXML Vector Support spec on the Adobe Open Source Flex SDK site.

Full code after the jump.

The following example(s) require Flash Player 10 and the Adobe Flex 4 SDK. To download the Adobe Flash Builder 4 beta, check out the Adobe Flash Builder 4 page on the Adobe Labs site. To download the latest build of the Flex 4 SDK, see http://opensource.adobe.com/wiki/display/flexsdk/Download+Flex+4. For instructions on using the beta Flex 4 SDK in Flex Builder 3, see "Using the beta Flex 4 SDK in Flex Builder 3".

<?xml version="1.0" encoding="utf-8"?>
<!-- http://blog.flexexamples.com/2009/06/16/setting-the-selected-indices-on-a-spark-list-control-in-flex-4/ -->
<s:Application name="Spark_List_selectedIndices_test"
        xmlns:fx="http://ns.adobe.com/mxml/2009"
        xmlns:s="library://ns.adobe.com/flex/spark"
        xmlns:mx="library://ns.adobe.com/flex/halo">
 
    <fx:Script>
        <![CDATA[
            private function button1_click(evt:MouseEvent):void {
                /** longhand */
                /*
                var victor:Vector.<int> = new Vector.<int>();
                victor.push(1, 3);
                list.selectedIndices = victor;
                */
 
                /** shorthand */
                list.selectedIndices = new <int>[1, 3];
            }
        ]]>
    </fx:Script>
 
    <mx:ApplicationControlBar width="100%" cornerRadius="0">
        <s:Button label="clear selectedIndices"
                click="list.selectedIndices = null;" />
        <s:Button label="set selectedIndices (MXML)"
                click="list.selectedIndices = new &lt;int&gt;[4,6];" />
        <s:Button label="set selectedIndices (ActionScript)"
                click="button1_click(event);" />
    </mx:ApplicationControlBar>
 
    <s:List id="list"
            labelField="label"
            requireSelection="false"
            allowMultipleSelection="true"
            horizontalCenter="0"
            verticalCenter="0">
        <s:dataProvider>
            <s:ArrayList>
                <fx:Object label="(0) One" />
                <fx:Object label="(1) Two*" />
                <fx:Object label="(2) Three" />
                <fx:Object label="(3) Four*" />
                <fx:Object label="(4) Five **" />
                <fx:Object label="(5) Six" />
                <fx:Object label="(6) Seven **" />
                <fx:Object label="(7) Eight" />
                <fx:Object label="(8) Nine" />
            </s:ArrayList>
        </s:dataProvider>
        <s:selectedIndices>
            <fx:Vector type="int">
                <fx:int>1</fx:int>
                <fx:int>3</fx:int>
            </fx:Vector>
        </s:selectedIndices>
    </s:List>
 
</s:Application>

Or, you can set the selectedIndices property inline using data binding, as seen in the following example:

<?xml version="1.0" encoding="utf-8"?>
<!-- http://blog.flexexamples.com/2009/06/16/setting-the-selected-indices-on-a-spark-list-control-in-flex-4/ -->
<s:Application name="Spark_List_selectedIndices_test"
        xmlns:fx="http://ns.adobe.com/mxml/2009"
        xmlns:s="library://ns.adobe.com/flex/spark"
        xmlns:mx="library://ns.adobe.com/flex/halo">
 
    <s:List id="list"
            labelField="label"
            requireSelection="false"
            allowMultipleSelection="true"
            selectedIndices="{new &lt;int&gt;[1,3]}"
            horizontalCenter="0" verticalCenter="0">
        <s:dataProvider>
            <s:ArrayList>
                <fx:Object label="(0) One" />
                <fx:Object label="(1) Two*" />
                <fx:Object label="(2) Three" />
                <fx:Object label="(3) Four*" />
                <fx:Object label="(4) Five **" />
                <fx:Object label="(5) Six" />
                <fx:Object label="(6) Seven **" />
                <fx:Object label="(7) Eight" />
                <fx:Object label="(8) Nine" />
            </s:ArrayList>
        </s:dataProvider>
    </s:List>
 
</s:Application>

This entry is based on a beta version of the Flex 4 SDK and therefore is very likely to change as development of the Flex SDK continues. The API can (and will) change causing examples to possibly not compile in newer versions of the Flex 4 SDK.

{ 5 comments… read them below or add one }

1 Peter deHaan June 17, 2009 at 4:35 pm

Note: This example requires Flex SDK 4.0.0.7916, or newer.

Reply

2 Anonymous June 19, 2009 at 12:30 am

Description Resource Path Location Type
1067: Implicit coercion of a value of type __AS3__.vec:Vector. to an unrelated type Array. ListIndcs.mxml GumboExample/src line 15 Flex Problem

Reply

3 Peter deHaan June 19, 2009 at 6:55 am

Anonymous,

Are you using Flex SDK 4.0.0.7916, or newer? http://opensource.adobe.com/wiki/display/flexsdk/Download+Flex+4

Peter

Reply

4 JabbyPanda June 23, 2009 at 1:53 am

I’ve downloaded the latest daily build as of today (4.0.0.8031, Sat Jun 20, 2009), still the error is here:

Description Resource Path Location Type
1067: Implicit coercion of a value of type __AS3__.vec:Vector. to an unrelated type __AS3__.vec:Vector.. Hello3.mxml Hello3/src line 19 Flex Problem

Reply

5 Peter deHaan June 23, 2009 at 7:43 am

JabbyPanda,

Right you are! It looks like the Vector.<Number> was changed to Vector.<int>.

I updated the example above and verified it with build 8031.

Peter

Reply

Leave a Comment

Sorry, this blog is terrible at eating HTML comments.
If you're pasting any HTML/XML/MXML code, you need to convert your < characters to &lt; and your > characters to &gt; .

You can use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <pre lang="" line="" escaped="">

Anti-Spam Protection by WP-SpamFree

Previous post:

Next post: