• Android Beginner: Implementing Click Handler

    Welcome to the third part of “The Beginner’s Guide to Android Development“. In this tutorial, we will continue our tutorial, implementing click handler to the button that we added in previous tutorial. If you haven’t already, be sure to read the previous tutorial of this series first!
    The source code we are going to use in today lesson is what we have working on the previous published post called “Android Beginner: Adding Button Using XML Layout“. Let’s open up the source code in Eclipse editor and start our tutorial!

    Step 1: Set onClick Listener To Button

    We will bind an onClick listener to the button and bring users to a new screen(activity) when users click on the button.
    Choosing /src/com.tutorial.myapp/, then double click on the “myMainScreen.java” to open it. Then insert the following codes into the file:
    package com.tutorial.myapp;
    
    import android.app.Activity;
    import android.content.Intent;
    import android.os.Bundle;
    import android.view.View;
    import android.widget.Button;
    
    public class myMainScreen extends Activity {
    
    	@Override
    	protected void onCreate(Bundle savedInstanceState) {
    		// TODO Auto-generated method stub
    		super.onCreate(savedInstanceState);
    		setContentView(R.layout.main);
    		
    		Button button1 = (Button) findViewById(R.id.sound_efx);
    		button1.setOnClickListener(new View.OnClickListener() {
    			
    			@Override
    			public void onClick(View v) {
    				// TODO Auto-generated method stub
    				startActivity(new Intent("com.tutorial.SOUND_EFFECTS_DETAILS"));
    			}
    		});
    	}
    
    }
    

    Description:

    • Line 4,6,7:
      Import the library of Intent, View and Button. This is required, because we have implemented related methods such as intended to start a new activity when click on the button.
    • Line 17:
      We create an Instance of Button named “button1“. We ask Android system to find the button that has id “sound_efx“, which we defined in main.xml.
    • Line 18:
      We bind an onClick listener to the button.
    • Line 20-25:
      An onClick function will start a new activity named “SOUND_EFFECTS_DETAILS” when user click on the button.

    Step 2: Creating A New XML Layout For Sound Effects Details Screen

    Ok, now we need a XML layout for the sound effects details screen, which users come from clicking on the sound effects button. Right click /res/layout/ folder, and choose “New -> Android XML File”, then insert following details:
    Creating New XML
    • Enter “sound.xml” for File
    • Select Linear Layout as root element
    Press “Finish” to complete the process. Then insert a Text View for displaying a message to users that this is sound effects details screen. Here is how we create a Text View for sound.xml:
    <?xml version="1.0" encoding="utf-8"?>
    <LinearLayout
      xmlns:android="http://schemas.android.com/apk/res/android"
      android:layout_width="fill_parent"
      android:layout_height="fill_parent">
      
      <TextView  
        android:layout_width="fill_parent" 
        android:layout_height="wrap_content" 
        android:text="@string/sound_details"
        />
    </LinearLayout>
    
    Then go to /res/values/ folder and open up strings.xml file. Insert the displaying message as shown below:
    <?xml version="1.0" encoding="utf-8"?>
    <resources>
        <string name="hello">Hello World, MainActivity!</string>
        <string name="app_name">myApp</string>
        <string name="btn_sound_efx">Sound Effects!</string>
        <string name="sound_details">This is Sound Effects Details Screen!</string>
    </resources>
    

    Step 3: Creating A New Class For Sound Effects Details Screen

    We have the XML layout for the sound effects details screen, but we need a Java class to set the content view for us. Creating a new class by choosing “File -> New -> Class”, then insert the following details into the dialog:
    Creating New Java Class
    • Enter “myApp/src” for Source Folder
    • Enter “com.tutorial.myapp” for Package
    • Enter “soudnEfxDetailsScreen” for Name
    • Choose “public” for Modifiers
    You will see a new Java class created and placed under your /src/ folder when pressing “Finish” button. Open it up and set content view for the sound effects details screen using following codes:
    package com.tutorial.myapp;
    
    import android.app.Activity;
    import android.os.Bundle;
    
    public class soundEfxDetailsScreen extends Activity {
    	@Override
    	protected void onCreate(Bundle savedInstanceState) {
    		// TODO Auto-generated method stub
    		super.onCreate(savedInstanceState);
    		setContentView(R.layout.sound);
    	}
    }
    
    First of all, import Activity and Bundle library. This is a new screen, so we want this class to extends Activity class. Next, we tells Android system to look for sound.xml file in /res/layout/ folder.

    Step 4: Configuring New Activity in AndroidManifest.xml

    Ok, now everything has ready, the last step is to tells Android system to start a new activity(sound effects details screen) based on the request named “SOUND_EFFECTS_DETAILS“, which we specified in “myMainScreen.java” class.
    Open up AndroidManifest.xml and insert the following codes:
    <?xml version="1.0" encoding="utf-8"?>
    <manifest xmlns:android="http://schemas.android.com/apk/res/android"
          package="com.tutorial.myapp"
          android:versionCode="1"
          android:versionName="1.0">
        <application android:icon="@drawable/icon" android:label="@string/app_name">
            <activity android:name=".MainActivity"
                      android:label="@string/app_name">
                <intent-filter>
                    <action android:name="android.intent.action.MAIN" />
                    <category android:name="android.intent.category.LAUNCHER" />
                </intent-filter>
            </activity>
            
            <activity
                android:name=".myMainScreen"
                android:label="@string/app_name" >
                <intent-filter>
                    <action android:name="com.tutorial.CLEARSCREEN" />
                    <category android:name="android.intent.category.DEFAULT" />
                </intent-filter>
            </activity>
            
            <activity
                android:name=".soundEfxDetailsScreen"
                android:label="@string/app_name" >
                <intent-filter>
                    <action android:name="com.tutorial.SOUND_EFFECTS_DETAILS" />
                    <category android:name="android.intent.category.DEFAULT" />
                </intent-filter>
            </activity>
    
        </application>
    
    
    </manifest>
    
    Save all the codes, run it in emulator and click on the button. Your app should works as the following picture:
    Result

    Conclusion

    You’ve just learned to add click handler and start a new activity for your Android application. In the next tutorial, we will learn to adding soudn effects that respond to user’s input. Stay tunes!
  • You might also like

    No comments:

    Post a Comment

    Good day precious one, We love you more than anything.

Powered by Blogger.