Using List Component in Mobile Flex Progrmming

Mobile Flex 4.5 programming :
List Component in Mobile Flex Programming :


output:

Program:
ListDemo.xml
--------------------------------------------------------------------------------------------



<?xml version="1.0" encoding="utf-8"?>
<s:ViewNavigatorApplication xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark" firstView="views.ListDemoHomeView" applicationDPI="160">

<fx:Declarations>
<!-- Place non-visual elements (e.g., services, value objects) here -->
</fx:Declarations>

</s:ViewNavigatorApplication>

---------------------------------------------------------------------------------------------


ListDemoHomeView.mxml
---------------------------------------------------------------------------------------------


<?xml version="1.0" encoding="utf-8"?>
<s:View xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark" title="Home">

<fx:Declarations>
<!-- Place non-visual elements (e.g., services, value objects) here -->
</fx:Declarations>

<fx:Script>
<![CDATA[
import spark.events.IndexChangeEvent;
protected function handleListItems(event:IndexChangeEvent):void
{
navigator.pushView(Second,choose.selectedItem);
}

protected function handleChangeEvent(event:IndexChangeEvent):void
{
// TODO Auto-generated method stub

}

]]>
</fx:Script>

<s:List id="choose" x="2" y="0" width="100%" height="100%" change="handleListItems(event)" labelField="name">
<s:ArrayCollection>

<fx:Object name="Ravi ram padman" age="21" working="Google"/>
<fx:Object name="santhosh" age="21" working="Adobe"/>
<fx:Object name="sandeep" age="21" working="Central Governament of INDIA"/>
<fx:Object name="Raju" age="21" working="IBM"/>
<fx:Object name="Riyazuddin" age="21" working="Microsoft"/>


</s:ArrayCollection>


</s:List>
</s:View>

-----------------------------------------------------------------------------------------

Second.mxml

-----------------------------------------------------------------------------------------

<?xml version="1.0" encoding="utf-8"?>

<s:View xmlns:fx="http://ns.adobe.com/mxml/2009"

xmlns:s="library://ns.adobe.com/flex/spark"

actionBarVisible="false" tabBarVisible="true" title="Second">

<fx:Declarations>

<!-- Place non-visual elements (e.g., services, value objects) here -->

</fx:Declarations>

<s:VGroup x="10" y="10" width="300" height="200">

<s:Label width="280" height="33" color="#4A4949" fontFamily="Verdana" fontSize="24"

fontWeight="normal" text="   Name:{data.name}" verticalAlign="top"/>

<s:Label width="252" fontSize="20" text="           Age: {data.age}"/>

<s:Label width="285" height="60" color="#454645" fontSize="21" text="work place: {data.working}"/>

</s:VGroup>

</s:View>