APLIKASI PEMUTAR MUSIK SEDERHANA MENGGUNAKAN ECLIPSE

Pada kesempatan kali ini saya akan membuat aplikasi Android menggunakan Eclipse. Aplikasi yang saya buat adalah aplikasi pemutar musik sederhana yang terdiri dari buat 8 activity. Untuk lebih jelasnya sebelum membuat aplikasinya perhatikan deskripsi di bawah:

Nama Activity: 

1. Login_Activity
2. Menu_Activity
3. PilihanLaguIndonesiaActivity
4. PilihanLaguBaratActivity
5. LaguBarat1Activity
6. LaguBarat2Activity
7. LaguIndonesia1Activity
8. LaguIndonesia2Activity

Elemen-element yang digunakan:

1. TextView
2. Button
3. Personal Name
4. Password
5. ListView
6. ImageButton

File Pendukung:

1. Siapkan satu lagu Indonesia dan satu lagu Barat.
2. Siapkan beberapa gambar/icon yaitu Play,Pause,dan Stop.

Setelah memahami deskripsi di atas dan telah mempersiapkan file yang di perlukan kita akan membuat aplikasinya, berikut ini adalah langkanya:

1. Saya membuat sebuah projec dengan nama  LexyLumiling_161011400103 dan buatlah activity yang pertama dengan nama "Login_Activity".

2. Pada folder res buat lagi sebuah folder dengan nama "raw" dan masukkan file lagu kedalam folder raw yang telah kita buat. Untuk lebih jelasnya perhatikan gambar dibawah ini:

3. Pada awal membuat projec kita telah membuat sebuah activity dengan nama Activity_Login Selanjudnya kita akan membuat beberapa activity lagi yaitu: PilihanLaguIndonesiaActivity, PilihanLaguBaratActivity, LaguBarat1Activity, LaguBarat2Activity, LaguIndonesia1Activity, dan LaguIndonesia2Activity. Untuk lebih jelasnya perhatikan gambar di bawah ini:

4. Selanjudnya buka folder layout > activity_login.xml lalu buatlah tampilan Graphical Layout dan buat source code activity_login.xml seperti langkah di bawah ini :

Graphical Layout:

1. Pada tampilan ini menggunakan  Form Widgeds yaitu 3 TextView dan 2 Button, serta menggunakan Text Fields yaitu Personal Name dan Password.
2. TextField 1 menggunakan Personal Name dengan nama id txtusername.
3. TextField 2 Menggunakan Password dengan nama id password.
4. Mengunakan 2 Button Login dan Close.

activity_login.xml:

<RelativeLayout 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"

    tools:context=".Login_Activity" >

    <TextView

        android:id="@+id/textView3"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:layout_alignLeft="@+id/textView2"

        android:layout_below="@+id/textView2"

        android:layout_marginTop="44dp"

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

    <EditText

        android:id="@+id/password"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:layout_alignBaseline="@+id/textView3"

        android:layout_alignBottom="@+id/textView3"

        android:layout_alignRight="@+id/user_name"

        android:layout_toRightOf="@+id/textView3"

        android:ems="10"

        android:hint="@string/masukkanpassword"

        android:inputType="textPassword" />

    <Button

        android:id="@+id/button2"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:layout_alignBaseline="@+id/button1"

        android:layout_alignBottom="@+id/button1"

        android:layout_marginLeft="22dp"

        android:layout_toRightOf="@+id/button1"

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

    <Button

        android:id="@+id/button1"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:layout_alignLeft="@+id/textView3"

        android:layout_below="@+id/password"

        android:layout_marginLeft="48dp"

        android:layout_marginTop="63dp"

        android:onClick="Login"

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

    <TextView

        android:id="@+id/textView2"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:layout_alignParentLeft="true"

        android:layout_alignParentTop="true"

        android:layout_marginLeft="27dp"

        android:layout_marginTop="113dp"

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

    <TextView

        android:id="@+id/textView1"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:layout_alignParentTop="true"

        android:layout_centerHorizontal="true"

        android:layout_marginTop="39dp"

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

    <EditText

        android:id="@+id/user_name"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:layout_alignBaseline="@+id/textView2"

        android:layout_alignBottom="@+id/textView2"

        android:layout_toRightOf="@+id/textView3"

        android:ems="10"

        android:hint="@string/masukkanusername"

        android:inputType="textPersonName" />

</RelativeLayout>

5. Buka folder src > Login_Activity.java dan isikan sourcecode di bawah:

Login_Activity.java:

package com.lexyalfanol_161011400103;

import android.app.Activity;

import android.content.Intent;

import android.os.Bundle;

import android.view.View;

import android.widget.Button;

import android.widget.EditText;

public class Login_Activity extends Activity {

EditText editUserName;

    EditText editPassword;

    Button buttonLogin;

    Button buttonExit;

    @Override

    protected void onCreate(Bundle savedInstanceState) {

        super.onCreate(savedInstanceState);

        setContentView(R.layout.activity_login_);

        

        editUserName = (EditText) findViewById(R.id.user_name);

        editPassword = (EditText) findViewById(R.id.password);

    }

    public void Login (View view) { 

  // TODO Auto-generated method stub 

    String user = editUserName.getText().toString();

         String pwd = editPassword.getText().toString();

         if (user.equals("lexy") && pwd.equals("123")) {

                Intent i = new Intent(this, Menu_Activity.class);

                startActivityForResult (i, 0);

         }

    }

}        

6. Selanjudnya buka folder layout > activity_menu.xml lalu buatlah tampilan Graphical Layout dan buat source code activity_menu.xml seperti langkah di bawah ini :

Graphical Layout:

1. Menggunaka Composite yaitu ListView

activity_menu.xml:

<RelativeLayout 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"

    tools:context=".Menu_Activity" >

    <ListView

        android:id="@+id/listView1"

        android:layout_width="match_parent"

        android:layout_height="wrap_content"

        android:layout_alignParentLeft="true"

        android:layout_alignParentTop="true" >

    </ListView>

</RelativeLayout>

7. Buka folder src > Menu_Activity.java dan isikan sourcecode di bawah:

Menu_Activity.java:

package com.lexyalfanol_161011400103;

import android.os.Bundle;

import android.app.Activity;

import android.content.Intent;

import android.view.View;

import android.widget.AdapterView;

import android.widget.ArrayAdapter;

import android.widget.ListView;

import android.widget.Toast;

public class Menu_Activity extends Activity {

ListView LV;

String [] Menu={"Lagu Indonesia","Lagu Barat"};

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_menu_);

LV=(ListView) findViewById(R.id.listView1);

        ArrayAdapter adapter=new ArrayAdapter (this, android.R.layout.simple_list_item_single_choice,Menu);

        LV.setAdapter(adapter);

        

        LV.setOnItemClickListener(new AdapterView.OnItemClickListener() {

@Override

public void onItemClick(AdapterView<?> arg0, View arg1, int arg2,

long arg3) {

// TODO Auto-generated method stub

String itemText=(String) LV.getItemAtPosition(arg2);

Toast.makeText(getBaseContext(),"anda mengklik" +itemText, Toast.LENGTH_LONG).show();

       

        if(itemText.equals("Lagu Indonesia")){

        Intent IndonesiaIntent=new Intent(arg0.getContext(),PilihanLaguIndonesiaActivity.class);

        startActivityForResult(IndonesiaIntent,0);

        }

        if(itemText.equals("Lagu Barat")){

        Intent BaratIntent=new Intent(arg1.getContext(),PilihanLaguBaratActivity.class);

        startActivityForResult(BaratIntent,0);

       

        }

       }

});

}}

8. Selanjudnya dengan menggunakan ListView yang sama seperti gambar di atas kita akan membuat tampilan PilihanLaguIndonesiaActivity.java dan PilihanLaguBaratActivity.java.

PilihanLaguBaratActivity.xml :

<RelativeLayout 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"

    tools:context=".PilihanLaguBaratActivity" >

    <ListView

        android:id="@+id/listView1"

        android:layout_width="match_parent"

        android:layout_height="wrap_content"

        android:layout_alignParentLeft="true"

        android:layout_alignParentTop="true" >

    </ListView>

</RelativeLayout>

PilihanLaguBaratActivity.java :

package com.lexyalfanol_161011400103;

import android.os.Bundle;

import android.app.Activity;

import android.content.Intent;

import android.view.View;

import android.widget.AdapterView;

import android.widget.ArrayAdapter;

import android.widget.ListView;

import android.widget.Toast;

public class PilihanLaguBaratActivity extends Activity {

ListView LV;

String [] Menu={"Lagu Barat 1","Lagu Barat 2"};

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_pilihan_lagu_barat);

LV=(ListView) findViewById(R.id.listView1);

        ArrayAdapter adapter=new ArrayAdapter (this, android.R.layout.simple_list_item_single_choice,Menu);

        LV.setAdapter(adapter);

        

        LV.setOnItemClickListener(new AdapterView.OnItemClickListener() {

@Override

public void onItemClick(AdapterView<?> arg0, View arg1, int arg2,

long arg3) {

// TODO Auto-generated method stub

String itemText=(String) LV.getItemAtPosition(arg2);

Toast.makeText(getBaseContext(),"anda mengklik" +itemText, Toast.LENGTH_LONG).show();

       

        if(itemText.equals("Lagu Barat 1")){

        Intent IndonesiaIntent=new Intent(arg0.getContext(),LaguBarat1Activity.class);

        startActivityForResult(IndonesiaIntent,0);

        }

        if(itemText.equals("Lagu Barat 2")){

        Intent BaratIntent=new Intent(arg1.getContext(),LaguBarat2Activity.class);

        startActivityForResult(BaratIntent,0);

       

        }

       }

});

}}

PilihanLaguIndonesiaActivity.xml :

<RelativeLayout 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"

    tools:context=".PilihanLaguIndonesiaActivity" >

    <ListView

        android:id="@+id/listView1"

        android:layout_width="match_parent"

        android:layout_height="wrap_content"

        android:layout_alignParentLeft="true"

        android:layout_alignParentTop="true" >

    </ListView>

</RelativeLayout>

PilihanLaguIndonesiaActivity.java :

package com.lexyalfanol_161011400103;

import android.os.Bundle;

import android.app.Activity;

import android.content.Intent;

import android.view.View;

import android.widget.AdapterView;

import android.widget.ArrayAdapter;

import android.widget.ListView;

import android.widget.Toast;

public class PilihanLaguIndonesiaActivity extends Activity {

ListView LV;

String [] Menu={"Lagu Indonesia 1","Lagu Indonesia 2"};

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_pilihan_lagu_indonesia);

LV=(ListView) findViewById(R.id.listView1);

        ArrayAdapter adapter=new ArrayAdapter (this, android.R.layout.simple_list_item_single_choice,Menu);

        LV.setAdapter(adapter);

        

        LV.setOnItemClickListener(new AdapterView.OnItemClickListener() {

@Override

public void onItemClick(AdapterView<?> arg0, View arg1, int arg2,

long arg3) {

// TODO Auto-generated method stub

String itemText=(String) LV.getItemAtPosition(arg2);

Toast.makeText(getBaseContext(),"anda mengklik" +itemText, Toast.LENGTH_LONG).show();

       

        if(itemText.equals("Lagu Indonesia 1")){

        Intent IndonesiaIntent=new Intent(arg0.getContext(),LaguIndonesia1Activity.class);

        startActivityForResult(IndonesiaIntent,0);

        }

        if(itemText.equals("Lagu Indonesia 2")){

        Intent BaratIntent=new Intent(arg1.getContext(),LaguIndonesia2Activity.class);

        startActivityForResult(BaratIntent,0);

       

        }

       }

});

}}

9.  Selanjudnya kita akan membuat tampilan Lagubarat1 seperti gambar dibawah:

 Graphical Layout:

1. Tampilan ini menggunakan  Form Widgeds yaitu 1 TextView dan Images & Media yaitu 3 ImageButton.
2. Gunakan 3 buah gambar yang sudah di persiapkan tadi sebagai background image button. 

Activity_Lagu_Barat1.xml:

<RelativeLayout 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"

    tools:context=".LaguBarat1Activity" >

    <TextView

        android:id="@+id/textView1"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:layout_alignParentTop="true"

        android:layout_centerHorizontal="true"

        android:layout_marginTop="44dp"

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

    <ImageButton

        android:id="@+id/btnplaybarat1"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:layout_alignLeft="@+id/textView1"

        android:layout_centerVertical="true"

        android:src="@drawable/play" />

    <ImageButton

        android:id="@+id/btnpausebarat1"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:layout_centerHorizontal="true"

        android:layout_centerVertical="true"

        android:src="@drawable/pause" />

    <ImageButton

        android:id="@+id/btnstopbarat1"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:layout_centerVertical="true"

        android:layout_marginLeft="14dp"

        android:layout_toRightOf="@+id/btnpausebarat1"

        android:src="@drawable/stop" />

</RelativeLayout>

LaguBarat1Activity.java :

package com.lexyalfanol_161011400103;

import java.io.IOException;

import android.app.Activity;

import android.os.Bundle;

import android.view.View;

import android.widget.Button;

import android.widget.ImageButton;

import android.widget.ImageView;

import android.widget.TextView;

import android.media.MediaPlayer;

import android.media.MediaPlayer.OnCompletionListener;

public class LaguBarat1Activity extends Activity {

private ImageButton btnPlay;

    private ImageButton btnPause;

    private ImageButton btnStop;

    private MediaPlayer mp;

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_lagu_barat1);

mp = new MediaPlayer();

        

        btnPlay = (ImageButton) findViewById(R.id.btnpausebarat1);

        btnPause = (ImageButton) findViewById(R.id.btnplaybarat1);

        btnStop = (ImageButton) findViewById(R.id.btnstopbarat1);

        stateAwal();

        btnPlay.setOnClickListener(new View.OnClickListener() {

            @Override

            public void onClick(View v) {

                play();

                btnPlay.setEnabled(false);

                btnPause.setEnabled(true);

                btnStop.setEnabled(true);

            }

        });

        btnPause.setOnClickListener(new View.OnClickListener() {

            @Override

            public void onClick(View v) {

                pause();

            }

        });

        btnStop.setOnClickListener(new View.OnClickListener() {

            @Override

            public void onClick(View v) {

                stop();

            }

        });

    }

    /** State Awal / Pertama Dijalankan */

    public void stateAwal(){

        btnPlay.setEnabled(true);

        btnPause.setEnabled(false);

        btnStop.setEnabled(false);

    }

    /** Dijalankan Oleh Tombol Play */

    private void play() {

        /** Memanggil File MP3 "indonesia.mp3" */

        mp = MediaPlayer.create(this,R.raw.barat1);

        try {

            mp.prepare();

        } catch (IllegalStateException e) {

            e.printStackTrace();

        } catch (IOException e) {

            e.printStackTrace();

        }

        /** Mendajalankan Audio */

        mp.start();

        /** Penanganan Ketika Suara Berakhir */

        mp.setOnCompletionListener(new OnCompletionListener() {

            @Override

            public void onCompletion(MediaPlayer mp) {

                stateAwal();

            }

        });

    }

    /** Dijalankan Oleh Tombol Pause */

    public void pause(){

        if(mp.isPlaying()){

            if(mp!=null){

                mp.pause();

                btnPause.setImageResource(R.drawable.play);

            }

        } else {

            if(mp!=null){

                mp.start();

                btnPause.setImageResource(R.drawable.pause);

            }

        }

    }

    /** Dijalankan Oleh Tombol Stop */

    public void stop(){

        mp.stop();

        try{

            mp.prepare();

            mp.seekTo(0);

        }catch (Throwable t) {

            t.printStackTrace();

        }

        stateAwal();

    }

}

10.  Selanjudnya kita akan membuat tampilan Lagubarat2 seperti gambar dibawah:

Graphical Layout:

1. Tampilan ini menggunakan  Form Widgeds yaitu 1 TextView dan Images & Media yaitu 3 ImageButton.
2. Gunakan 3 buah gambar yang sudah di persiapkan tadi sebagai background image button. 

Activity_Lagu_Barat2.xml:

<RelativeLayout 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"

    tools:context=".LaguBarat2Activity" >

    <TextView

        android:id="@+id/textView1"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:layout_alignParentTop="true"

        android:layout_centerHorizontal="true"

        android:layout_marginTop="55dp"

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

    <ImageButton

        android:id="@+id/btnplaybarat2"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:layout_centerVertical="true"

        android:layout_toLeftOf="@+id/btnpausebarat2"

        android:src="@drawable/play" />

    <ImageButton

        android:id="@+id/btnpausebarat2"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:layout_alignTop="@+id/btnplaybarat2"

        android:layout_centerHorizontal="true"

        android:src="@drawable/pause" />

    <ImageButton

        android:id="@+id/btnstopbarat2"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:layout_centerVertical="true"

        android:layout_toRightOf="@+id/btnpausebarat2"

        android:src="@drawable/stop" />

</RelativeLayout>

LaguBarat2Activity.java :

package com.lexyalfanol_161011400103;

import java.io.IOException;

import android.app.Activity;

import android.os.Bundle;

import android.view.View;

import android.widget.Button;

import android.widget.ImageButton;

import android.widget.ImageView;

import android.widget.TextView;

import android.media.MediaPlayer;

import android.media.MediaPlayer.OnCompletionListener;

public class LaguBarat2Activity extends Activity {

private ImageButton btnPlay;

    private ImageButton btnPause;

    private ImageButton btnStop;

    private MediaPlayer mp;

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_lagu_barat2);

mp = new MediaPlayer();

        

        btnPlay = (ImageButton) findViewById(R.id.btnplaybarat2);

        btnPause = (ImageButton) findViewById(R.id.btnpausebarat2);

        btnStop = (ImageButton) findViewById(R.id.btnstopbarat2);

        stateAwal();

        btnPlay.setOnClickListener(new View.OnClickListener() {

            @Override

            public void onClick(View v) {

                play();

                btnPlay.setEnabled(false);

                btnPause.setEnabled(true);

                btnStop.setEnabled(true);

            }

        });

        btnPause.setOnClickListener(new View.OnClickListener() {

            @Override

            public void onClick(View v) {

                pause();

            }

        });

        btnStop.setOnClickListener(new View.OnClickListener() {

            @Override

            public void onClick(View v) {

                stop();

            }

        });

    }

    /** State Awal / Pertama Dijalankan */

    public void stateAwal(){

        btnPlay.setEnabled(true);

        btnPause.setEnabled(false);

        btnStop.setEnabled(false);

    }

    /** Dijalankan Oleh Tombol Play */

    private void play() {

        /** Memanggil File MP3 "indonesia.mp3" */

        mp = MediaPlayer.create(this,R.raw.barat1);

        try {

            mp.prepare();

        } catch (IllegalStateException e) {

            e.printStackTrace();

        } catch (IOException e) {

            e.printStackTrace();

        }

        /** Mendajalankan Audio */

        mp.start();

        /** Penanganan Ketika Suara Berakhir */

        mp.setOnCompletionListener(new OnCompletionListener() {

            @Override

            public void onCompletion(MediaPlayer mp) {

                stateAwal();

            }

        });

    }

    /** Dijalankan Oleh Tombol Pause */

    public void pause(){

        if(mp.isPlaying()){

            if(mp!=null){

                mp.pause();

                btnPause.setImageResource(R.drawable.play);

            }

        } else {

            if(mp!=null){

                mp.start();

                btnPause.setImageResource(R.drawable.pause);

            }

        }

    }

    /** Dijalankan Oleh Tombol Stop */

    public void stop(){

        mp.stop();

        try{

            mp.prepare();

            mp.seekTo(0);

        }catch (Throwable t) {

            t.printStackTrace();

        }

        stateAwal();

    }

}

11. Hasil Aplikasi yang sudah berhasil saya jalankan: