Eclipse Accessing Sound (EAS)


EAS:   SOLD       



We will create a simple application to play .mp3 files via a play button. The scenario is, if the play button is clicked, the mp3 will be played. At the same time the play button becomes disabled. However, if the mp3 is finished playing, then the play button is enabled again. See Figure 10.1.


How to Access Android Sound in Eclipse 

Are you ready? Let's get started!


Figure 10.1

1. Run Enclipse, create a new project. Fill in the parameters as follows

| Project name     | playingAudio        |
|------------------|---------------------|
| Build Target     | Android 2.2         |
| Application name | Memutar file audio  |
| Package name     | contoh.playingAudio |
| Create Activity  | playingAudio        |
| Min SDK version  | 8                   |

2. In the res folder, create a new folder named drawable. Insert the play image (or anything to represent the play icon) in *.png format (figure 10.2).


Figure 10.2 Image play.png


Figure 10.3

3. Create another new folder in res, this time name it raw. Put the mp3 file into the raw folder. This exercise uses the kautsar.mp3 file.


Figure 10.4

4. Then type the following script in main.xml

<?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:textSize="15px"
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:id="@+id/textView"
 android:text="Memainkan Musik"></TextView>
 <ImageButton android:id="@+id/putarMusik"
 android:layout_height="wrap_content"
 android:adjustViewBounds="false"
 android:src="@drawable/play"
 android:layout_gravity="center_vertical|center_horizontal"
 android:layout_width="fill_parent"></ImageButton>
 <TextView android:text=""
 android:id="@+id/ket"
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:layout_gravity="center_horizontal"
 android:textSize="15px"></TextView>
</LinearLayout>

5. Type the playingAudio.java code as follows

package contoh.playingAudio;
import java.io.IOException;
 import android.app.Activity;
 import android.media.MediaPlayer;
 import android.media.MediaPlayer.OnCompletionListener;
 import android.os.Bundle;
 import android.view.View;
 import android.view.View.OnClickListener;
 import android.widget.ImageButton;
 import android.widget.TextView;

 public class playingAudio extends Activity{
 ImageButton mainkan;
 TextView keterangan;
 MediaPlayer mp;
 /** Called when the activity is first created. */
 @Override
 public void onCreate(Bundle savedInstanceState) {
 super.onCreate(savedInstanceState);
 setContentView(R.layout.main);

 keterangan=(TextView)findViewById(R.id.ket);
 keterangan.setText("Silakan klik tombol play");

 mainkan=(ImageButton)findViewById(R.id.putarMusik);
 mainkan.setOnClickListener(new OnClickListener(){
 public void onClick(View arg0){
 mainkan.setEnabled(false);
 keterangan.setText("Tombol play tidak aktif");
 go();
 }
 });
 }
 public void go(){
 mp=MediaPlayer.create(playingAudio.this, R.raw.kautsar);
 try {
 mp.prepare();
 } catch (IllegalStateException e) {
 // TODO Auto-generated catch block
 e.printStackTrace();
 } catch (IOException e) {
 // TODO Auto-generated catch block
 e.printStackTrace();
 }
 mp.start();
 mp.setOnCompletionListener(new OnCompletionListener(){
 public void onCompletion(MediaPlayer arg0){
 mainkan.setEnabled(true);
 keterangan.setText("Silakan klik tombol play");
 }
 });
 }
}

6. If the script is messy, do Format (source > format).

7. Do a RUN and see the results.

Program Explanation

  1. In the main.xml layout, we insert 3 widgets, namely 1. TextView on lines 7-11 to display the text "Playing Music"
  2. ImageButton on lines 12-17 to create a button that can contain an image. 
  3. TextView again on lines 18-23 to display the status of the button is active or not.

ImageButton takes an image from the res/drawable folder, shown in line 15. Is that clear?

Now we go to the activity. To make it easier to understand, I made this activity into 3 parts, namely;

  1. Lines 12-14 are the object declarations.
  2. Line 21-31 is the object synchronization to the widget in xml while activating the ImageButton. When the ImageButton is clicked, the go() method is called. 
  3. Lines 33-51 are the go() method, which contains functions for playing the media player.

The go() method contains a sequence of commands to call the MediaPlayer class. The MediaPlayer class is responsible for calling and playing audio files that we save in the raw folder. In this exercise, the author uses the kautsar.mp3 file. Actually, there are stages (state diagrams) in playing audio files, but they are not explained in this book because they are considered complicated for beginners. So the author presents it in simple and easy-to-understand exercise examples.

How to call it through line 34. Mp is a MediaPlayer object that has been declared at the beginning of the program. After the mp3 file is called, the audio file enters the prepared stage (mp.prepared()). At this stage using try-catch. Trycatch is a Java way to execute a command that is in try. If the execution fails, it is immediately handled by the command in catch.

After entering mp.prepared(), then use mp.start() to start playing mp3. Up to here it is seen, once ImageButton is clicked, mp3 file will be played, ImageButton becomes inactive and the text that appears is "Play button is inactive". The next idea is to reactivate ImageButton if mp3 file has finished playing. So use setOnCompletionListener() method.

To find out whether the mp3 has finished playing or not, we use the onCompletion() method. This is where we reactivate the imageButton (line 47) and change the imageButton status to "Please click the play button" (line 48). Thus, once the mp3 has finished playing, the play ImageButton is active again, and the caption TextView displays the text "Please click the play button" again.


Post a Comment

Previous Next

نموذج الاتصال