Dienstag, 22. Januar 2013

Create your own ADF Mobile Twitter App with a RESTful Webservice and JSON (Part 1)

When I was at the DOAG conference in Nürnberg, at the end of november, Volker Linz and I were showing a presentation about our practical ADF Mobile experience. Therefore we had a little sample application with some of the more interesting features. Like showing your geo location on a map.
One feature you couldn't miss out, was a twitter integration - why? - because everybody had one in their sample applications. So Volker and I coded at the "hackers lounge" with a few energy drinks. In this post I want to show you, how easy it is to integrate a RESTful Webservice with JSON in an ADF Mobile application.

Let's assume we have a plain little ADF Mobile application with one feature based on a task flow which consists of a single AMX-View. The first thing we need is the connection to the webservice we want to use. In our example we are going to use the twitter GET search API from here https://dev.twitter.com/docs/api/1/get/search.

So create a URL connection and let it reference to http://search.twitter.com.


 Your connections.xml should now look like this.


When you want to see the structure of the JSON String we are going to receive, you can use the HTTP-Analyzer from JDeveloper. See at Tools->HTTP Analyzer and create a new Request. Make sure to make a HTTP Request (tab at the bottom) and choose GET request. For example we are going to get a tweet from OC_WIRE - the OPITZ CONSULTING twitter account. Therefore we have to add a /search.json?q=OC_WIRE at the end of the URL.


Now we have all we need to get this String. Let's create a bean to call our service. We name it Tweets and get the response in the constructor for debugging. 


This should call our service when the bean gets instanced. Therefor we have to add it to our task flow.


To make our task flow useable we have to add a feature in the adfmf-feature.xml and use the task flow as content. 


Now we are nearly ready to test our service call. All thats left is to create some interaction with our bean so it get initiated. Therefore let's create a button that calls some method on the page. I'll use our Button in the second facet and map it to a new method in the bean.


Now we can start out App, push the button an stop the debugger when we receive the response.


And there it is. A response String with JSON formatted Data. In a next step we will parse this string and create a beautiful ListView based on this JSON Data. But that's something for PART II.

1 Kommentar :