Pages

Thursday, August 1, 2013

Android Hello World Part 2

This is a continuation from the previous post.

To respond to the button's on-click event, open theactivity_main.xml layout file and add theandroid:onClick attribute to the <Button> element:

<Button
   
android:layout_width="wrap_content"
   
android:layout_height="wrap_content"
   
android:text="@string/button_send"
   
android:onClick="sendMessage" />

The android:onClick attribute’s value, "sendMessage", is the name of a method in your activity that the system calls when the user clicks the button.

Open the MainActivity class (located in the project's src/ directory) and add the corresponding method:

/** Called when the user clicks the Send button */
public void sendMessage(View view) {
   
// Do something in response to button
}

This requires that you import the View class:

import android.view.View;

Build an Intent


An Intent is an object that provides runtime binding between separate components (such as two activities). The Intent represents an app’s "intent to do something." You can use intents for a wide variety of tasks, but most often they’re used to start another activity.

Inside the sendMessage() method, create an Intent to start an activity called DisplayMessageActivity:

Intent intent = new Intent(this, DisplayMessageActivity.class);

An Intent can carry a collection of various data types as key-value pairs called extras. The putExtra()method takes the key name in the first parameter and the value in the second parameter.

 

An intent not only allows you to start another activity, but it can carry a bundle of data to the activity as well. Inside thesendMessage() method, use findViewById() to get theEditText element and add its text value to the intent:

Intent intent = new Intent(this, DisplayMessageActivity.class);
EditText editText = (EditText) findViewById(R.id.edit_message);
String message = editText.getText().toString();
intent
.putExtra(EXTRA_MESSAGE, message);

Note: You now need import statements forandroid.content.Intent and android.widget.EditText.

Start the Second Activity


To start an activity, call startActivity() and pass it your Intent. The system receives this call and starts an instance of the Activity specified by the Intent.

With this new code, the complete sendMessage() method that's invoked by the Send button now looks like this:

/** Called when the user clicks the Send button */
public void sendMessage(View view) {
    Intent intent = new Intent(this, DisplayMessageActivity.class);
    EditText editText = (EditText) findViewById(R.id.edit_message);
    String message = editText.getText().toString();
    intent.putExtra(EXTRA_MESSAGE, message);
    startActivity(intent);
}

To create a new activity using Eclipse:

1.    Click New  in the toolbar.

2.    In the window that appears, open theAndroid folder and select Android Activity. Click Next.

3.    Select BlankActivity and click Next.

4.    Fill in the activity details:

o    Project: MyFirstApp

o    Activity Name: DisplayMessageActivity

o    Layout Name: activity_display_message

o    Title: My Message

o    Hierarchial Parent: com.example.myfirstapp.MainActivity

o    Navigation Type: None

Click Finish.

If you're using a different IDE or the command line tools, create a new file namedDisplayMessageActivity.java in the project's src/ directory, next to the original MainActivity.java file.

Open the DisplayMessageActivity.java file. If you used Eclipse to create this activity:

·         The class already includes an implementation of the required onCreate() method.

·         There's also an implementation of the onCreateOptionsMenu() method, but you won't need it for this app so you can remove it.

·         There's also an implementation of onOptionsItemSelected() which handles the behavior for the action bar's Up behavior. Keep this one the way it is.

Because the ActionBar APIs are available only on HONEYCOMB (API level 11) and higher, you must add a condition around the getActionBar() method to check the current platform version. Additionally, you must add the @SuppressLint("NewApi") tag to the onCreate() method to avoid lint errors.

The DisplayMessageActivity class should now look like this:

public class DisplayMessageActivity extends Activity {

   
@Override
   
protected void onCreate(Bundle savedInstanceState) {
       
super.onCreate(savedInstanceState);
        setContentView
(R.layout.activity_display_message);

       
// Make sure we're running on Honeycomb or higher to use ActionBar APIs
       
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.HONEYCOMB) {
           
// Show the Up button in the action bar.
            getActionBar
().setDisplayHomeAsUpEnabled(true);
       
}
   
}

   
@Override
   
public boolean onOptionsItemSelected(MenuItem item) {
       
switch (item.getItemId()) {
       
case android.R.id.home:
           
NavUtils.navigateUpFromSameTask(this);
           
return true;
       
}
       
return super.onOptionsItemSelected(item);
   
}
}

Add the title string

If you used Eclipse, you can skip to the next section, because the template provides the title string for the new activity.

If you're using an IDE other than Eclipse, add the new activity's title to the strings.xml file:

<resources>
    ...
    <string name="title_activity_display_message">My Message</string>
</resources>

Add it to the manifest

All activities must be declared in your manifest file, AndroidManifest.xml, using an <activity> element.

When you use the Eclipse tools to create the activity, it creates a default entry. If you're using a different IDE, you need to add the manifest entry yourself. It should look like this:

<application ... >
    ...
    <activity
        android:name="com.example.myfirstapp.DisplayMessageActivity"
        android:label="@string/title_activity_display_message"
        android:parentActivityName="com.example.myfirstapp.MainActivity" >
        <meta-data
            android:name="android.support.PARENT_ACTIVITY"
            android:value="com.example.myfirstapp.MainActivity" />
    </activity>
</application>

Receive the Intent


Every Activity is invoked by an Intent, regardless of how the user navigated there. You can get the Intentthat started your activity by calling getIntent() and retrieve the data contained within it.

In the DisplayMessageActivity class’s onCreate() method, get the intent and extract the message delivered by MainActivity:

Intent intent = getIntent();
String message = intent.getStringExtra(MainActivity.EXTRA_MESSAGE);

Display the Message


To show the message on the screen, create a TextView widget and set the text using setText(). Then add theTextView as the root view of the activity’s layout by passing it to setContentView().

The complete onCreate() method for DisplayMessageActivity now looks like this:

@Override
public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
 
    // Get the message from the intent
    Intent intent = getIntent();
    String message = intent.getStringExtra(MainActivity.EXTRA_MESSAGE);
 
    // Create the text view
    TextView textView = new TextView(this);
    textView.setTextSize(40);
    textView.setText(message);
 
    // Set the text view as the activity layout
    setContentView(textView);
}

 

The final set of code that you would have arrived could be the following

 

 

 

 

 

This enabled me to do the following J

   

Android Hello World Part 1

I learnt to develop my Andriod helloworld app from the beautiful contents of the site http://developer.android.com/training/basics/firstapp/index.html

 

Following is the understanding I obtained after creating the hello world app

 

1.      Download the Android SDK from http://developer.android.com/sdk/index.html

 

2.      Open up the sdk folder. You will see an eclipse folder inside it. Open the eclipse and click new.

Fill up the following information in it

 

3.      Click Next.

4.      Now you can select an activity template from which to begin building your app.

For this project, select BlankActivity and click Next.

5.      Leave all the details for the activity in their default state and click Finish.

 

Few directories and files in the Android project


AndroidManifest.xml - The manifest file describes the fundamental characteristics of the app and defines each of its components. 

 

One of the most important elements your manifest should include is the <uses-sdk> element. This declares your app's compatibility with different Android versions using the android:minSdkVersion andandroid:targetSdkVersion attributes. For your first app, it should look like this:

<manifest xmlns:android="http://schemas.android.com/apk/res/android" ... >
   
<uses-sdk android:minSdkVersion="8" android:targetSdkVersion="17" />
    ...
</manifest>

src/

Directory for your app's main source files. By default, it includes an Activity class that runs when your app is launched using the app icon.

res/

Contains several sub-directories for app resources. Here are just a few:

drawable-hdpi/

Directory for drawable objects (such as bitmaps) that are designed for high-density (hdpi) screens. Other drawable directories contain assets designed for other screen densities.

layout/

Directory for files that define your app's user interface.

values/

Directory for other various XML files that contain a collection of resources, such as string and color definitions.

When you build and run the default Android app, the default Activity class starts and loads a layout file that says "Hello World." The result is nothing exciting, but it's important that you understand how to run your app before you start developing.

Run on a Real Device


If you have a real Android-powered device, here's how you can install and run your app:

1.    Plug in your device to your development machine with a USB cable. If you're developing on Windows, you might need to install the appropriate USB driver for your device. For help installing drivers, see the OEM USB Drivers document.

2.    Enable USB debugging on your device.

o    On most devices running Android 3.2 or older, you can find the option under Settings > Applications > Development.

o    On Android 4.0 and newer, it's in Settings > Developer options.

Note: On Android 4.2 and newer, Developer options is hidden by default. To make it available, go toSettings > About phone and tap Build number seven times. Return to the previous screen to findDeveloper options.

To run the app from Eclipse:

1.    Open one of your project's files and click Run  from the toolbar.

2.    In the Run as window that appears, select Android Application and click OK.

Eclipse installs the app on your connected device and starts it.

 

The graphical user interface for an Android app is built using a hierarchy of View and ViewGroup objects. View objects are usually UI widgets such as buttons or text fields andViewGroup objects are invisible view containers that define how the child views are laid out, such as in a grid or a vertical list.

Android provides an XML vocabulary that corresponds to the subclasses of View and ViewGroup so you can define your UI in XML using a hierarchy of UI elements.

Building a Simple User Interface


Figure 1. Illustration of how ViewGroup objects form branches in the layout and contain other View objects.

In this lesson, you'll create a layout in XML that includes a text field and a button. In the following lesson, you'll respond when the button is pressed by sending the content of the text field to another activity.

Add a Text Field


To create a user-editable text field, add an <EditText> element inside the <LinearLayout>.

Like every View object, you must define certain XML attributes to specify the EditText object's properties. Here’s how you should declare it inside the <LinearLayout> element:

    <EditText android:id="@+id/edit_message"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:hint="@string/edit_message" />

About these attributes:

android:id

This provides a unique identifier for the view, which you can use to reference the object from your app code, such as to read and manipulate the object (you'll see this in the next lesson).

The at sign (@) is required when you're referring to any resource object from XML. It is followed by the resource type (id in this case), a slash, then the resource name (edit_message).

The plus sign (+) before the resource type is needed only when you're defining a resource ID for the first time. When you compile the app, the SDK tools use the ID name to create a new resource ID in your project's gen/R.java file that refers to the EditText element. Once the resource ID is declared once this way, other references to the ID do not need the plus sign. Using the plus sign is necessary only when specifying a new resource ID and not needed for concrete resources such as strings or layouts. See the sidebox for more information about resource objects.

android:layout_width and android:layout_height

Instead of using specific sizes for the width and height, the"wrap_content" value specifies that the view should be only as big as needed to fit the contents of the view. If you were to instead use "match_parent", then the EditText element would fill the screen, because it would match the size of the parent LinearLayout. For more information, see the Layouts guide.

android:hint

This is a default string to display when the text field is empty. Instead of using a hard-coded string as the value, the "@string/edit_message" value refers to a string resource defined in a separate file. Because this refers to a concrete resource (not just an identifier), it does not need the plus sign. However, because you haven't defined the string resource yet, you’ll see a compiler error at first. You'll fix this in the next section by defining the string.

Note: This string resource has the same name as the element ID: edit_message. However, references to resources are always scoped by the resource type (such as id or string), so using the same name does not cause collisions.

Add a Button


Now add a <Button> to the layout, immediately following the <EditText> element:

    <Button

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:text="@string/button_send" />

The height and width are set to "wrap_content" so the button is only as big as necessary to fit the button's text. This button doesn't need the android:id attribute, because it won't be referenced from the activity code.

Make the Input Box Fill in the Screen Width


The layout is currently designed so that both the EditText and Button widgets are only as big as necessary to fit their content, as shown in figure 2.

Figure 2. The EditText and Button widgets have their widths set to "wrap_content".

This works fine for the button, but not as well for the text field, because the user might type something longer. So, it would be nice to fill the unused screen width with the text field. You can do this inside a LinearLayoutwith the weight property, which you can specify using the android:layout_weight attribute.

The weight value is a number that specifies the amount of remaining space each view should consume, relative to the amount consumed by sibling views. This works kind of like the amount of ingredients in a drink recipe: "2 parts vodka, 1 part coffee liqueur" means two-thirds of the drink is vodka.

In order to improve the layout efficiency when you specify the weight, you should change the width of theEditText to be zero (0dp). Setting the width to zero improves layout performance because using"wrap_content" as the width requires the system to calculate a width that is ultimately irrelevant because the weight value requires another width calculation to fill the remaining space.

Here’s how your complete layout file should now look:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
   
xmlns:tools="http://schemas.android.com/tools"
   
android:layout_width="match_parent"
   
android:layout_height="match_parent"
   
android:orientation="horizontal">
   
<EditText android:id="@+id/edit_message"
       
android:layout_weight="1"
       
android:layout_width="0dp"
       
android:layout_height="wrap_content"
       
android:hint="@string/edit_message" />
   
<Button
       
android:layout_width="wrap_content"
       
android:layout_height="wrap_content"
       
android:text="@string/button_send" />
</LinearLayout>

In Eclipse, click Run  from the toolbar.

 

You will be able to see a screen like the following in your android. Not necessarily the same