This is part two of our Programming for Android series. See part one: A Look at the Android SDK.
Now that we have set up the Android emulator, we need to get cracking with Eclipse and the Android Development plugins. It's time to make an (admittedly simple) app!
Setting Up Eclipse
After installing JDK 6 I had to get Eclipse Ganymede from the Eclipse website. The version that comes in the Ubuntu repositories is 3.2, and you need at least 3.3 to work with Android. Once that was out of the way I installed the WST and Android plugins for Eclipse. Just go to Help > Software Updates, click Add Site, and put
https://dl-ssl.google.com/android/eclipse/
Check the developer tools box and the Web Tools. Once that is done hit Install. Go through the windows and it will automatically install. Restart Eclipse and set up the Android Project location by going to Window > Preferences > Android and add the SDK location. Mine is ~/Programs/android-sdk-linux_x86-1.0_r1/.
Hello World
Start up by opening your emulator. Go to File > New > Project > Android and fill in the project details. I called my project Hello World, with the package name of com.oxavi.hello, an activity name of HelloWorld, and application name of HelloWorld. The package name has to follow the same naming convention as Java packages. This is what it looked like right after I made the project.
On the phone an error message popped up so I hit force close and went on to changing the code. I added a few lines to HelloWorld.java to get it to do something. Lines that I added are commented.
package com.oxavi.hello;
import android.app.Activity;
import android.os.Bundle;
//you need this to get the TextView functions to work
import android.widget.TextView;
public class HelloWorld extends Activity {
/** Called when the activity is first created. */
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
//this sets TextView variable tv
TextView tv = new TextView(this);
//this sets the text of the tv variable
tv.setText("Hello, Android. This is Oxavi!");
//this displays the tv variable
setContentView(tv);
}
}
Now go to Run > Run > Android Application and hit OK. You should see something like this on the phone after a few seconds.
Starting Out With XML Layouts
Writing the layout into the code can be a problem when you later want to make a small interface change and you now have to edit code all over the place. Here enters the XML layout, which lets you separate the layout from the logic, similarly to how you separate it with HTML and CSS in web design. Eclipse already made an XML layout for us, we just haven't been using it. To use it lets go to res > layout > main.xml and change the code to in that file to:
<?xml version="1.0" encoding="utf-8"?>
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:text="Hello, Android. This is Oxavi, and we are using XML layouts!"/>
You can change the android:text="" to whatever you want it to say. res will be used a lot later, it is the folder that will contain stuff your app uses that isn't code, like images. Now open up R.java. This file contains references to some of the stuff your app needs to run. It lets you use the references as a shorthand while coding. This file is auto-generated by Eclipse, so there is no need to change it. It will get auto-updated as you change things and work on your app. Now we need to change a few lines in the HelloWorld.java file to:
package com.oxavi.hello;
import android.app.Activity;
import android.os.Bundle;
/* we no longer need this to run the XML layout so comment it out
//need this to get the textview functions to work
import android.widget.TextView;
*/
public class HelloWorld extends Activity {
/** Called when the activity is first created. */
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
//this sets the XML layout to display
setContentView(R.layout.main);
/* this is the old layout view that we dont need, so comment it out
//this sets textview variable
TextView tv = new TextView(this);
//this sets the text of the tv variable
tv.setText("Hello, Android. This is Oxavi!");
//this displays the tv variable
setContentView(tv);
*/
}
}
Now we have successfully ran our first XML based app! Here is what it should look like, a lot like before. If you check the menu you will see your HelloWorld app there, but it needs an icon! Let's do that now.
Adding Application Attributes
We can go ahead and add a description first. Go to res > values > strings.xml and click add. I named mine app_description and added the value 'This app says hello to the world.' Save your png icon to your workspace/res/drawable folder and open the AndoidManifest.xml file. This file contains all the information about your app, and makes it easy for you to edit it. Go to the Application tab and click browse next to the icon field. Browse for the icon you saved and set enabled to true. Now do the same for the description and browse to values > strings > app_description. Save everything and run it.
And you should see your shiny new icon for your app!
Thoughts
Google has taken care to make this really easy to do. I guess now it's time for me learn some more Java before I dive head first into development. Hopefully the other API's are just as easy to access as the textview. You can do quite a bit with just textview, drawables, and sql. Since we at Oxavi are considering developing a game for this platform I'll have to find out before we start if these API's will be enough, in the next post.
This is part two of our Programming for Android series. See part one: A Look at the Android SDK.









