Copy link to clipboard
Copied
Im using httpservice to get XML from a live URL of a web service I run.... works great and Im just trying to make it a little more elegant and presentable... is there a way for me to have an animated busy indicator on the stage and have it sit on top (using depth control) of my list that populates with the XMl data... then based on the status of the httpservice request, toggle the depth so that when the xml has finished loading, the busy indicator drops beneath the list object (using a lower number for the depth).
or maybe its better to have the list alpha change and just leave the busy indicator below the list -- either way -- Im trying to figure out how to use some type of listener routine (presuming thats how I'd do it) to get the status and check for some type of completion.
heres the code Im using in FB 4.6 ... if its a mess, please be kind... Im just beginning to dabble with FB (and having a real blast so far).
<?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"
creationComplete="init(event)" splashScreenImage="@embed('logo.png')"
title="Events Listing Demo">
<fx:Script>
<![CDATA[
import mx.events.FlexEvent;
import spark.events.IndexChangeEvent;
protected function init(event:FlexEvent):void
{
lfXML.send();
}
protected function list1_changeHandler(event:IndexChangeEvent):void
{
navigator.pushView(Detail, event.target.selectedItem);
}
protected function btnreload_clickHandler(event:MouseEvent):void
{
navigator.pushView(HomeView);
}
]]>
</fx:Script>
<fx:Declarations>
<s:HTTPService id="lfXML" url="URL TO MY XML SERVICE HERE"/>
</fx:Declarations>
<s:List id="list1" y="191" left="10" width="460" height="407" change="list1_changeHandler(event)"
contentBackgroundAlpha="90"
dataProvider="{lfXML.lastResult.Events.EventListing}" depth="6"
labelField="EventTitle">
</s:List>
<s:BusyIndicator id="indicator1" y="280" width="180" height="165" depth="5" horizontalCenter="0" />
<s:Button id="btnreload" x="109" label="Reload Events Data" click="btnreload_clickHandler(event)"
verticalCenter="301"/>
<s:Image x="10" y="2" width="460" height="173" source="@embed('views/logo.jpg')"/>
</s:View>
Copy link to clipboard
Copied
After making a call, HTTPService fires a FaultEvent (if there was a failure) or ResultEvent (if there was a success).
Therefore, all you need to do is to display the busy indicator after any .send() and hide it again in response to any FaultEvent or ResultEvent.
EG: You could do this using states like this.
[code]
<fx:Script>
<![CDATA[
import mx.events.FlexEvent;
import mx.rpc.events.FaultEvent;
import mx.rpc.events.ResultEvent;
protected function init(event:FlexEvent):void
{
lfXML.send();
currentState = "loading";
}
protected function lfXML_faultHandler(event:FaultEvent):void
{
// TODO Auto-generated method stub
currentState = "ready";
}
protected function lfXML_resultHandler(event:ResultEvent):void
{
// TODO Auto-generated method stub
currentState = "ready";
}
]]>
</fx:Script>
<s:states>
<s:State name="ready" />
<s:State name="loading" />
</s:states>
<fx:Declarations>
<!-- Place non-visual elements (e.g., services, value objects) here -->
<s:HTTPService id="lfXML"
fault="lfXML_faultHandler(event)"
result="lfXML_resultHandler(event)"
/>
</fx:Declarations>
<s:List id="list1" y="191" left="10" width="460" height="407" change="list1_changeHandler(event)"
contentBackgroundAlpha="90"
dataProvider="{lfXML.lastResult.Events.EventListing}" depth="6"
labelField="EventTitle">
</s:List>
<s:BusyIndicator id="indicator1" y="280" width="180" height="165" depth="5" horizontalCenter="0"
includeIn="loading"
/>
<s:Button id="btnreload" x="109" label="Reload Events Data" click="btnreload_clickHandler(event)"
verticalCenter="301"/>
<s:Image x="10" y="2" width="460" height="173" source="@Embed('views/logo.jpg')"/>
[/code]