This weekend was cloudy and it rained so I decided to give some more time to play with my android phone. Even since I got the phone some time ago I tried on several occasions to do some fun development on it but it never seemed quite fun as expected so beside some play with the sensors, gps and camera I did not do much. However this time I was decided to do a different kind of test. I had in mind a simple application and I wanted to try how nice it is to develop it using the java android libraries from google and the air libraries from adobe.

The application

It is quite a simple application. In the first screen a login window is presented, the info is used to authenticate with a remote server, the response is evaluated and if the login is successful the JSESSION cookie is passed to a new view which connects to a service which returns a list of tasks which are displayed in a list. The server part existed and returned XML streams as response.

Conclusions

I will start with the conclusions and then show some examples of code. Note that this is a very basic application I did from scratch. First the time. Developing the android app took me about 3h and most of the time I searched the web various examples, the google doc was not enough. For the Air app it took me about 1h30 45min from which I spent downloading and installing the air env in a Windows virtual machine since they are not supported on linux. Second the code. For me the shorter the code the better the program and in this case there is absolutely no comparison, I wrote 4-5 times more code in order to the same think in android both in terms of java versus as and android xml versus mxml. Writing the android part proved much more frustrating for me mainly because all the things seems not to have the meaning you would expect, all the names are wrong. Take for instance the name of the function to set the query parameters: “setEntity” and the name of the function to set the headers: “setParams”.

XML gui definition

Android

<pre lang="xml">
<?xml version="1.0" encoding="utf-8"??>
<linearlayout android:layout_height="fill_parent" android:layout_width="fill_parent" android:orientation="vertical" xmlns:android="http://schemas.android.com/apk/res/android">
	<tablelayout android:id="@+id/tableLayout1" android:layout_height="wrap_content" android:layout_width="match_parent">
		<tablerow android:id="@+id/tableRow1" android:layout_height="wrap_content" android:layout_width="wrap_content">
			<textview android:id="@+id/textView2" android:layout_height="wrap_content" android:layout_span="2" android:layout_width="wrap_content" android:text="Diapason login" android:textappearance="?android:attr/textAppearanceLarge"></textview>
		</tablerow>
		<tablerow android:id="@+id/tableRow1" android:layout_height="wrap_content" android:layout_width="wrap_content">
			<textview android:id="@+id/textView2" android:layout_height="wrap_content" android:layout_width="wrap_content" android:text="Username" android:textappearance="?android:attr/textAppearanceLarge"></textview>
			<edittext android:id="@+id/username" android:layout_weight="1">
				<requestfocus></requestfocus>
			</edittext>
		</tablerow>
		<tablerow android:id="@+id/tableRow2" android:layout_height="wrap_content" android:layout_width="wrap_content">
		<textview android:id="@+id/textView1" android:layout_height="wrap_content" android:layout_width="wrap_content" android:text="Password" android:textappearance="?android:attr/textAppearanceLarge"></textview>
		<edittext android:id="@+id/password" android:inputtype="textPassword" android:layout_height="wrap_content" android:layout_weight="1" android:layout_width="match_parent"></edittext>
		</tablerow>
		<tablerow android:id="@+id/tableRow3" android:layout_height="wrap_content" android:layout_width="wrap_content">
			<button android:id="@+id/login" android:layout_column="1" android:layout_height="wrap_content" android:layout_width="wrap_content" android:text="Login"></button>
		</tablerow>
	</tablelayout>
</linearlayout>

Air (flex)

<pre lang="xml">
<?xml version="1.0" encoding="utf-8"??>
<view title="HomeView" xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:mx="library://ns.adobe.com/flex/mx" xmlns:s="library://ns.adobe.com/flex/spark">	
	<declarations>
		<httpservice id="loginService" method="POST" result="onLoginService(event)" resultformat="e4x" url="http://localhost:8080/tasks/tasks"></httpservice>
	</declarations>
	
	<vgroup height="100%" horizontalalign="center" width="100%">
		<label text="Diapason login"></label>
		<spacer height="10"></spacer>
		<label text="Username"></label>
		<textinput id="username"></textinput>
		<label text="Password"></label>
		<textinput displayaspassword="true" id="password"></textinput>
		<button click="onLogin(event)" id="login" label="Login"></button>
	</vgroup>
</view>

Can you compare these two? Which is more readable? As a side note I agree that I simplified the flex part a bit because I could not find a grid component (the equivalent of the flex 3 mx:grid)

Making a request

Android

<pre lang="java">
HttpPost post = new HttpPost(DpsnDroidActivity.dpsnURL);
List<namevaluepair> params = new ArrayList<namevaluepair>();
params.add(new BasicNameValuePair("defaultLocale", "en_US"));
params.add(new BasicNameValuePair("locale", "--"));
params.add(new BasicNameValuePair("pass",((EditText)findViewById(R.id.password)).getText().toString()));
params.add(new BasicNameValuePair("user", ((EditText)findViewById(R.id.username)).getText().toString()));
params.add(new BasicNameValuePair("service", "login"));
post.setEntity(new UrlEncodedFormEntity(params));
				
HttpResponse response = httpClient.execute(post, httpContext);
InputStream contentResponse = response.getEntity().getContent();
</namevaluepair></namevaluepair>

Flex

<pre lang="actionscript">
var params:Object = {
	locale: '--',
	defaultLocale: 'en_US',
	user: username.text,
	pass: password.text,
	service: 'login'
};
loginService.send(params);

The loginService was already defined in the mxml part.

XML parsing

It’s a bit pointless to compare the amount of code required to parse XML in java and in flex using e4x.

Filling a list

Android

<pre lang="java">
NodeList nodes = (NodeList) xpath.evaluate(expression, inputSource, XPathConstants.NODESET);
List<hashmap string="">> listData = new ArrayList<hashmap>>();
for(int n=0; n<nodes.getlength hashmap="" n="" node="" string=""> entry = new HashMap<string string="">();
	entry.put("name", node.getAttributes().getNamedItem("name").getNodeValue());
	entry.put("description", node.getAttributes().getNamedItem("description").getNodeValue());
	//Log.i(TAG, node.getAttributes().getNamedItem("id").getNodeValue());
	listData.add(entry);
}
SimpleAdapter tasksAdapter = new SimpleAdapter(this, listData, R.layout.listitem,
					new String[]{"name","description"}, new int[]{R.id.name, R.id.description});
ListView tasks = (ListView)findViewById(R.id.tasks);
tasks.setAdapter(tasksAdapter);
</string></nodes.getlength></hashmap></hashmap>

<pre lang="xml">
<?xml version="1.0" encoding="utf-8"??>
<linearlayout android:id="@+id/linearLayout1" android:layout_height="fill_parent" android:layout_width="fill_parent" android:orientation="vertical" xmlns:android="http://schemas.android.com/apk/res/android">
    <textview android:id="@+id/name" android:layout_height="wrap_content" android:layout_width="wrap_content" android:text="TextView" android:textappearance="?android:attr/textAppearanceMedium"></textview>
    <textview android:id="@+id/description" android:layout_height="wrap_content" android:layout_width="wrap_content" android:text="TextView"></textview>
</linearlayout>

Flex

<pre lang="xml">
<xmllistcollection id="tasksData" source="{tasksService.lastResult.task}"></xmllistcollection>
...
<list dataprovider="{tasksData}" height="100%" id="tasks" width="100%">
<itemrenderer>
	<component>
		<itemrenderer>
			<vgroup>
				<label text="{data.@name}"></label>
				<label text="{data.@description}"></label>
			</vgroup>
		</itemrenderer>
	</component>
</itemrenderer>
</list>

Final conclusions

I’m not saying here that one way of developing applications is better than the other or even faster after you get used to them not to mention in terms of deployment, hardware access and so many other criteria related to mobile development. My observations are personal and somehow aesthetic and from an aesthetic point of view android code is a very ugly code.

Comments:

Etravel -

So, what brand and model did you say your Android phone was?

len -

HTC Desire

Etravel -

Thanks, great piece of hardware.