how to display a loading message/screen when doing a http.request web service call

Solar2D General Questions/Discussion
#1

Hi all,

I am trying to display a rectangle with loading message when the app is trying to get some data via web service call to have user a better user experience.

I tired to follow the example provided by Gilbert with no luck. See below for the link.
http://developer.anscamobile.com/code/simple-loading-message

I basically made two global functions as follows, and call the 1st one right before I call the http.request function and call the 2nd one immediately before I display the results I received from the web service call.

However, it didn’t display the message as I expected. It basically halt when making the web service call until it finished. Then show the loding message, and remove the loading message right away. So the user is not aware of the loading message as it disappeared too fast. Is there any other better way to display the loading message in the app?
Thank you.

  
 function LoadingPage:displayLoadingMessage()  
 loadscreen = display.newGroup()  
 myRectangle= display.newRect(0, 0, display.contentWidth,display.contentHeight)  
 myRectangle.strokeWidth = 3  
 myRectangle:setFillColor(140, 140, 140)  
 myRectangle:setStrokeColor(180, 180, 180)  
 message = display.newText("Loading", 0, 0, native.systemFont, 24)  
 message.x = 100 + message.width\*0.5  
 message.y = display.contentCenterY  
 loadscreen:insert(myRectangle)  
 loadscreen:insert(message)   
  
 --Every second update the loading message   
 local counter = 0  
 function loadingMessage( event )  
 counter = counter + 1  
  
 if counter \> 3 then  
 counter = 0   
 message.text = "Loading" --remove the dots  
 else   
 message.text = message.text.."." --add a dot  
 end  
 message.x = 100 + message.width\*0.5  
 end   
  
 loadingTimer = timer.performWithDelay( 1000, loadingMessage, 0 )  
 end

function LoadingPage:removeLoadingPage() timer.cancel( loadingTimer ) myRectangle:removeSelf() message:removeSelf() end [import]uid: 23306 topic_id: 8047 reply_id: 308047[/import]

#2

use the async http. (see api guide)

http.request << is synchronous. it will not yield until the call returns.

C. [import]uid: 24 topic_id: 8047 reply_id: 28674[/import]

#3

Hi Carlos,

Thanks for your comments. I tried to use sync http.request to make sure I got the data from the webservice call before I process the data.

However, according to the Gilbert’s post ( see link below), native.setActivityIndicator + enterFrame eventlistener may work for me.

http://developer.anscamobile.com/code/show-native-activity-indicator-while-connecting-and-downloading

But I soon ran into a problem that the original function, who calls a http.request function then call the XML parser function, will not wait for that http.request function result before calling the XML parser. How can I make it wait for the result from the webservice function?
Please see the code example below and my questions in the comments.
Thank you for your support.

webservicecall.lua

function WebServiceCall:searchbyName(sName)  
 native.setKeyboardFocus( nil )  
  
 -- do the XML query  
 local xmlData = XMLRetriever:getXMLData( "http://URL.here" .. sName)  
  
 local parsedData={}  
  
 -- Parse the received XML  
 -- Here we run into the problem!!!!!!  
 -- The xmlData is still nil and it needs to wait for the results from previous function call.   
 parsedData = XMLRetriever:XMLDatatPorting(xmlData)  
  
 -- Return the parsed XML data and will use these data to generate a scrollable list view in next view.  
 return parsedData  
end

XMLRetriever.lua

[code]
function XMLRetriever:getXMLData(url)
local srcfile = “temp.xml”
local path = system.pathForFile(srcfile, system.DocumentsDirectory)
local myFile = io.open( path, “w” )

local function doitnow()
–remove the EventListener
Runtime:removeEventListener( “enterFrame”, doitnow );
local xmltext = http.request{
url = url,
sink = ltn12.sink.file(myFile),
}

– Remove the Activity Indicator
native.setActivityIndicator( false )

– Not sure if I can return from there!!!
return XmlParser:ParseXmlFile(path)
end

– Start the Activity Indicator before the http.request
native.setActivityIndicator( true )
Runtime:addEventListener( “enterFrame”, doitnow );
end
[/code] [import]uid: 23306 topic_id: 8047 reply_id: 29286[/import]