Flex mobile and databinding

Question

Is data binding feature supported in flex mobile project? I have data binding code used in <s: Application>. When I move the application to flex mobile in <s: view>, I can't seem to make data binding work.

Answer 1

<?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"
                                 xmlns:mx="library://ns.adobe.com/flex/mx"
                                 xmlns:amcharts="http://www.amcharts.com/com_internal"
                                 backgroundColor="#FFFFFF"
                                 width="100%" height="100%"
                                 viewSourceURL="srcview/index.html">
  <fx:Declarations>
  <!-- Place non-visual elements (e.g., services, value objects) here -->
  </fx:Declarations>
  <fx:Script>
                              <![CDATA[
                                        import mx.collections.ArrayCollection;
                                        import flash.filters.DropShadowFilter;
                                        [Bindable]private var chartData:ArrayCollection = new ArrayCollection([
                                                  {year:2001,income:23.5,expenses:18.1},
                                                  {year:2002,income:26.2,expenses:22.8},
                                                  {year:2003,income:30.1,expenses:23.9},
                                                  {year:2004,income:29.5,expenses:25.1},
                                                  {year:2005,income:24.6,expenses:25.0},
                                                  {year:2006,income:25.5,expenses:18.1},
                                                  {year:2007,income:26.2,expenses:52.8},
                                                  {year:2008,income:36.1,expenses:23.9},
                                                  {year:2009,income:24.5,expenses:33.1},
                                                  {year:2010,income:44.6,expenses:29.0}
                                        [Bindable]private var shadow:DropShadowFilter = new DropShadowFilter(2,45,0,0.5);
                              ]]>
  </fx:Script>   
                    <s:VGroup width="100%" height="100%">
                              <s:Group width="100%" height="100%">
  <amcharts:AmSerialChart
                                                  id="chart"
                                                  width="100%"
                                                  height="100%"                
                                                  dataProvider="{chartData}"
                                                  categoryField="year"
                                                  angle="30"
                                                  depth3D="30">
  <amcharts:graphs>
                                                            <amcharts:AmGraph title="Income" id="g0" valueField="income" type="column" lineAlpha="0" fillColors="[#ADD981]" fillAlphas="[1]"/>                       
                                                            <amcharts:AmGraph title="Expenses" markerType="line" id="g1" valueField="expenses" type="line" lineThickness="2" bullet="round" filters="{[shadow]}"/>                       
  </amcharts:graphs>
  <amcharts:valueAxes>
                                                            <amcharts:ValueAxis dashLength="5"/>                           
  </amcharts:valueAxes>
  <amcharts:categoryAxis>
                                                            <amcharts:CategoryAxis gridPosition="start" dashLength="5"/>
  </amcharts:categoryAxis>
  </amcharts:AmSerialChart>
  <amcharts:AmLegend
                                                  color="0x000000"
                                                  x="45"
                                                  y="10"
                                                  switchable="false"
                                                  dataProvider="{chart}"
                                                  width="100%"
                                                  marginRight="20"
                                                  marginLeft="40"
                                                  textClickEnabled="false"
                                                  marginBottom="5"/>                    
  </s:Group>
                              <s:HGroup width="100%">
                                        <mx:Spacer width="32"/>
                                        <mx:DataGrid dataProvider="{chartData}" width="100%" editable="true" height="100"/>                   
                                        <mx:Spacer width="20"/>
  </s:HGroup>
                              <mx:Spacer height="10"/>
                    </s:VGroup>           
</s:View>