|
|
Sermon Ohakwe (@admin) |
You’ve created your first project and created the run and debug configurations for it. Before making any changes, test your installation and configurations by running and debugging the Hello World project.
From the Run menu, select Run or Debug to launch the most recently selected configuration, or select Open Run Dialog … or Open Debug Dialog … to select a configuration to use.
If you’re using the ADT plug-in, running or debugging your application:
❑ Compiles the current project and converts it to an Android executable (.dex). ❑ Packages the executable and external resources into an Android package (.apk). ❑ Starts the emulator (if it’s not already running).
❑ Installs your application onto the emulator. ❑ Starts your application.
If you’re debugging, the Eclipse debugger will then be attached, allowing you to set breakpoints and debug your code.
If everything is working correctly, you’ll see a new Activity running in the emulator, as shown in Figure 2-6.
With that confirmed, let’s take a step back and have a real look at your first Android application.
Activity is the base class for the visual, interactive components of your application; it is roughly equivalent to a Form in traditional desktop development. The following snippet shows the skeleton code for an Activity-based class; note that it extends Activity, overriding the onCreate method.
package com.paad.helloworld;
import android.app.Activity;
import android.os.Bundle;
public class HelloWorld extends Activity {
/** Called when the activity is first created. */ @Override
public void onCreate(Bundle icicle) {
super.onCreate(icicle);
}
}What’s missing from this template is the layout of the visual interface. In Android, visual components are called Views, which are similar to controls in traditional desktop development.
In the Hello World template created by the wizard, the onCreate method is overridden to call setContentView, which lays out the user interface by inflating a layout resource, as highlighted below:
@Override
public void onCreate(Bundle icicle) {
super.onCreate(icicle);
setContentView(R.layout.main);
}The resources for an Android project are stored in the res folder of your project hierarchy, which includes drawable, layout, and values subfolders. The ADT plug-in interprets these XML resources to provide design time access to them through the R variable as described in Chapter 3.
The following code snippet shows the UI layout defined in the main.xml file created by the Android project template:
<?xml version=”1.0” encoding=”utf-8”?>
<LinearLayout xmlns:android=”http://schemas.android.com/apk/res/android”
android:orientation=”vertical”
android:layout_width=”fill_parent”
android:layout_height=”fill_parent”>
<TextView
android:layout_width=”fill_parent”
android:layout_height=”wrap_content”
android:text=”Hello World, HelloWorld”
/>
</LinearLayout>Defining your UI in XML and inflating it is the preferred way of implementing your user interfaces, as it neatly decouples your application logic from your UI design.
To get access to your UI elements in code, you add identifier attributes to them in the XML definition.
You can then use the findViewById method to return a reference to each named item. The following
XML snippet shows an ID attribute added to the TextView widget in the Hello World template:
<TextView
android:id=”@+id/myTextView”
android:layout_width=”fill_parent”
android:layout_height=”wrap_content”
android:text=”Hello World, HelloWorld”
/>And the following snippet shows how to get access to it in code:
TextView myTextView = (TextView)findViewById(R.id.myTextView);Alternatively (although it’s not considered good practice), if you need to, you can create your layout directly in code as shown below:
public void onCreate(Bundle icicle) {
super.onCreate(icicle);
LinearLayout.LayoutParams lp;
lp = new LinearLayout.LayoutParams(LayoutParams.FILL_PARENT, LayoutParams.FILL_PARENT);
LinearLayout.LayoutParams textViewLP;
textViewLP = new LinearLayout.LayoutParams(LayoutParams.FILL_PARENT, LayoutParams.WRAP_CONTENT);
LinearLayout ll = new LinearLayout(this); ll.setOrientation(LinearLayout.VERTICAL); TextView myTextView = new TextView(this); myTextView.setText(“Hello World, HelloWorld”); ll.addView(myTextView, textViewLP); this.addContentView(ll, lp);
}All the properties available in code can be set with attributes in the XML layout. As well as allowing easier substitution of layout designs and individual UI elements, keeping the visual design decoupled from the application code helps keep the code more concise.