Online Android and IPhone Application builder in English

Your profile
Log out
Online Android and IPhone Application builder in English
Online Android and IPhone Application builder in French
Online Android and IPhone Application builder in Chinese
Online Android and IPhone Application builder in Danish
Online Android and IPhone Application builder in Swedish
alt_image_de_flag
Make me Droid

Advertisement
JSON data sources
Some screens or controls of the designer can and/or have to be associated to a data source, which represents the main source for their content.

For example, the dynamic list screen needs a data source that provides a list of items, and this list is then converted and displayed on screen nicely. But those sources can also be used in many other places of your apps.

Among several data sources, JSON format can be used in Make me Droid.

If you own a website and have some programming knowledge, JSON format lets you have total remote control of your application content. Otherwise, you can also find JSON content everywhere on the web, and use it in your apps.
What is JSON?
This is a very useful format to organize and store data. This helps websites and mobile devices to exchange data.

Information are either objects made of "a identifier" + "a value" pairs, or lists (array of values). Each "value" can be a string, a number, a sub-object or a list.

Let's take an example:
		{
			"name" : "doe",
			"firstname" : "john",
			"addresses" : [
				{"street" : "3, st. james road", "city" : "london"},
				{"street" : "kings av.", "city" : "new york"}
			]
		}
	
In this example, our JSON is an object (uses the {...} format) containing a name, a firstname, and a list (uses the [...] format) of addresses.
Why using JSON?
Nowadays, many famous websites (Youtube, Flickr, Soundcloud, Facebook, Twitter, ...) provide APIs to their users, allowing them to retrieve content in JSON format.

That content can be lists of pictures, of comments, user information, sounds in a library, number of "likes" about an article, etc. Those JSON APIs allow you retrieving all those information dynamically!

On the Make me Droid side, we provide you with an easy way to read such content, through keywords that you can use on your screens.
How to start?
If you build your own JSON content, use your URL as a data source somewhere in your app.

If you use an existing API provided for example by Youtube, Flickr or another popular website, you will usually have to be a user of their sites, and registered in their developer section, in order to obtain an API key. That key is mostly used to know who use what.

Then, you have to understand how each API work, reading the documentation on such sites. For example, Flickr provides a large number of APIs, as listed on their documentation. Among them, the flickr.people.getPublicPhotos API lets you retrieve the list of pictures of a user. After reading more, you will then find out that the following URL has to be called:

http://api.flickr.com/services/rest/?method=flickr.people.getPublicPhotos&api_key=YOUR_API_KEY&user_id=TARGETED_USER_ID&format=json

You will then get the following response:
		jsonFlickrApi({
			"photos" : {
				"page":1,
				"pages":4,
				"perpage":100,
				"total":"340",
				"photo": [
					{"id":"10175341775", "title":"wooden planks ... [explored]"},
					{"id":"10158609995", "title":"29 - what a strange house number [explored]"}
				]
			}
		}
	
In your application you can then, for example:
  • Use that URL as a data source for a horizontal gallery. As galleries need a list (not an object), you will then have to write down photos->photo in the List field area, in order to let the gallery know that the "photo" field of the "photos" object will be used as a base for building gallery pages.
  • In your gallery, you can then use a text item with the $[title] keyword.
  • You will then get a gallery, showing a picture title on each page (only the title for now, not the picture itself).
  • After a bit of practice, you will be able to display the pictures, the associated comments, the number of "likes" or open the author web page on click.
Keywords format to access JSON fields
See the documentation about data sources.
It's quite difficult! I need help...
JSON content is very powerful and makes your application dynamic therefore attractive. Nevertheless, it's not always so easy to start using it.
  • Find information on forums and documentation pages of websites that provide JSON APIs.
  • Look for examples on your favorite search engine.
  • Try by yourself in your application.
  • Look for answers, and ask your questions on our forum. Be accurate about what you are trying to do, what you have tried, what didn't work, and provide your application/screen name, so we can help.
List JSON content block after block
From your website, you can provide a web page that returns JSON content, block after block, in case you have a lot of information to provide. That page will be called by the application whenever needed to fill the screen content.

The following example uses the PHP language, but you can of course generate the JSON output the way you want.

Web page input data:
  • Parameters format: GET method (parameters passed inside the URL).
  • Parameter "si" (number): Position within your full item list at which you have to start returning the items. First index is 0. Users scroll the content down and doing so, your web page will be called multiple times with different start indexes, in order to append new items to the list.
  • Parameter "cnt" (number): Number of items to return.
  • Parameter "s" (characters): Keyword(s) searched by the user. You have to filter the returned items to match this query.
  • Parameter "sort": Field on which results have to be sorted.
  • Parameter "sortdir": Results have to be sorted in ascending (sortdir=0) or descending (sortdir=1) order.

Returned data structure format:
  • The JSON-encoded string, containing the following items:
    • totalItems: Total number of items available in your database or array (matching the search query).
    • itemCount: Number of items returned by this response.
    • items: List of sub-items made of "identifier":"value" pairs, or any other complex JSON content. These identifiers are used in designer screens using for example the $[identifier] keyword.
Output example:

success{"items":[{"title":"First title", "picture":"http:\/\/myserver.com\/img.jpg"}, {"title":"Second title", "picture":"http:\/\/myserver.com\/img2.jpg"}], "totalItems":3, "itemCount":2}


PHP source code sample:
The array will probably be replaced with a database content in a real situation.

<?

$si = $_GET["si"];
$cnt = $_GET["cnt"];

$outputArray["items"] = array();

$items = array(
    array("titre"=>"First title", "picture"=>"http://myserver.com/img.jpg"),
    array("titre"=>"Second title", "picture"=>"http://myserver.com/img2.jpg"),
    array("titre"=>"Third title", "picture"=>"http://myserver.com/img3.jpg")
);

$pos = 0;
for ($i=$si;$i<count($items) && $pos<$cnt;$i++)
{
    $outputArray["items"][$pos] = $items[$i];
    $pos++;
}

$outputArray["totalItems"] = count($items);
$outputArray["itemCount"] = min(count($items), count($outputArray["items"]));

// TODO: Don't forget to sort results if needed.

$encodedJSONList = json_encode($outputArray);

print_r($encodedJSONList);

?>

PHP sample code for accessing MySQL database content:

Download