Membuat Pemutar Musik di Android: Mempersiapkan Proyek

Indonesian (Bahasa Indonesia) translation by Cucu Deri Mulyani (you can also view the original English article)

Platform Android menyediakan kebutuhan untuk menangani pemutar media, yang bisa digunakan aplikasi anda untuk membuat antar muka antara pengguna dan file musik mereka. Dalam rangkaian tutorial ini, kita akan membuat aplikasi sederhana pemutar musik untuk Android. Aplikasi ini akan menampilkan daftar lagu pada perangkat pengguna, sehingga pengguna dapat memilih lagu yang akan diputar. Aplikasinya juga akan menampilkan kontrol untuk berinteraksi dengan pemutar ulang dan akan terus diputar saat pengguna berpindah dari aplikasi, dengan menampilkan pemberitahuan sementara pemutaran berlangsung.

Kata Pengantar

Membuat pemutar musik akan melibatkan penggunaan kelas ContentResolver untuk menampilkan trek pada perangkat, kelas MediaPlayer untuk memutar suara dankelas MediaController untuk mengontrol pemutaran ulang. Kita juga akan menggunakan Service untuk memutar suara saat pengguna tidak berinteraksi secara langsung dengan aplikasi. Anda harus bisa menyelesaikan seri ini jika Anda adalah developer menengah Android, jadi jika Anda sudah membuat beberapa aplikasi, maka pada bahasan kali ini seharusnya tidak menjadi masalah bagi Anda. Berikut tampilan dari aplikasi yang akan dibuat:

Dalam tutorial ini, kita akan membuat aplikasi dan melihat perangkat pengguna untuk mencari file audio menggunakan kelas ContentResolver dan Cursor. Pada bagian selanjutnya, kita akan menggunakan Adapter untuk menyajikan daftar lagu, memulai pemutaran saat pengguna memilih lagu dari daftar. Pada bagian akhir seri ini, kita akan menggunakan kelas MediaController untuk memberi pengguna kontrol untuk memutar ulang, menerapkan fungsi untuk melompat maju dan mundur, termasuk fungsi acak. Setelah bahasan ini, kita akan mengeksplorasi aspek lain dari pemutar media yang dapat meningkatkan fungsi aplikasi, seperti menangani fokus suara, menyajikan file media dengan cara yang berbeda, dan memutar streaming media.

1. Buat dan Konfigurasi Proyek Baru

Langkah 1

Buat proyek baru Android. Jika Anda menggunakan Eclipse, maka biarkan IDE (Integrated Development Environment) membuat kelas utama Activity and file layout untuk Anda. Untuk beberapa kode yang kita gunakan dalam seri ini, Anda memerlukan tingkat API minimal 16, jadi Anda perlu melakukan langkah tambahan untuk mendukung versi lama. Setelah proyek dibuat, buka file Manifest proyek. Di dalam elemen manifest, tambahkan pengaturan izin sebagai berikut:

<uses-permission android:name="android.permission.WAKE_LOCK" />

Kita akan menggunakan pengaturan izin ini untuk membiarkan pemutar musik berlangsung ketika perangkat pengguna diam. Manifest Anda sudah harus berisi elemen untuk kelas activity utama Anda. Tambahkan atribut berikut ke unsur activity untuk mengatur screenOrientation dan launchMode:

<activity
  android:name="com.example.musicplayer.MainActivity"
  android:label="@string/app_name"
  android:launchMode="singleTop"
  android:screenOrientation="portrait" >

Kita akan menggunakan orientasi portrait untuk lebih mudahnya. LaunchMode akan membantu proses navigasi kembali setelah berpindah dari aplikasi. Kita akan menampilkan pemberitahuan yang menunjukkan lagu sedang dimainkan, menekan pemberitahuan akan membawa pengguna kembali ke aplikasi. Kami juga akan menggunakan kelas Service untuk pemutar musik. Tambahkan baris berikut ke proyek Manifest di dalam unsur application dan setelah unsur activity :

<service android:name="com.example.musicplayer.MusicService" />

Ubah nama paket sesuai keinginan dan juga ubah nama kelas kalau mau.

Langkah 2

Buka file proyek layout utama dan ganti isinya dengan layout berikut:

<LinearLayout xmlns:android="https://schemas.android.com/apk/res/android"
  xmlns:tools="http://schemas.android.com/tools"
  android:layout_width="fill_parent"
  android:layout_height="fill_parent"
  android:orientation="vertical"
  android:background="#FF330000"
  tools:context=".MainActivity" >

  <ListView
    android:id="@+id/song_list"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content" >
  </ListView>

</LinearLayout>

Pastikan untuk mengubah atribut tools:context jika Activity class utama Anda diberi nama yang berbeda. Layoutnya mencakup ListView dimana kita akan menyajikan daftar lagu.

Kami akan menyertakan dua item menu untuk pilihan fungsi acak dan untuk keluar dari aplikasi. Buka file menu utama (res/menu/main.xml) dan mengganti isinya dengan berikut:

<menu xmlns:android="http://schemas.android.com/apk/res/android" >

  <item
    android:id="@+id/action_shuffle"
    android:icon="@drawable/rand"
    android:orderInCategory="1"
    android:showAsAction="always"
    android:title="Shuffle"/>

  <item
    android:id="@+id/action_end"
    android:icon="@drawable/end"
    android:orderInCategory="2"
    android:showAsAction="always"
    android:title="End"/>

</menu>

Jika Anda mau, Anda dapat menyimpan deretan judul di file res/values/strings.xml. Dua item mengacu pada file drawable. Buat sendiri atau gunakan kedua gambar ini untuk langkah awal:

Kita juga akan menggunakan ikon untuk ditampilkan dalam pemberitahuan pemutaran. Buat satu sekarang atau gunakan yang berikut ini:

Kode akan mengacu pada gambar bernama rand, end, dan play jadi pastikan Anda menggunakan nama file yang sama. Salin gambar ke folder drawable pada proyek Anda. Kita akan menerapkan aksinya nanti.

2. Penelusuran Perangkat berisi Lagu

Langkah 1

Mari kita telusuri perangkat pengguna yang berisi file suara. Pertama, tambahkan kelas baru ke proyek Anda, lalu beri nama Song. Kami akan menggunakan kelas ini untuk memodelkan data untuk satu file suara. Di dalam deklarasi kelas, tambahkan tiga variabel untuk data yang ingin kami simpan untuk setiap lagunya:

private long id;
private String title;
private String artist;

Selanjutnya, tambahkan metode konstruktor di mana kita memanggil variable:

public Song(long songID, String songTitle, String songArtist) {
  id=songID;
  title=songTitle;
  artist=songArtist;
}

Terakhir, tambahkan metode get untuk variabel berikut:

public long getID(){return id;}
public String getTitle(){return title;}
public String getArtist(){return artist;}

Jika Anda berencana untuk menggunakan lebih banyak jalur informasi, maka Anda bebas menambahkan tipe variabel tambahan ke kelas.

Langkah 2

Buka kelas utama Activity dan tambahkan impor sebagai berikut:

import java.util.ArrayList;
import java.util.Collections;
import java.util.Comparator;
import android.net.Uri;
import android.content.ContentResolver;
import android.database.Cursor;
import android.widget.ListView;

Deklarasikan tipe variabel berikut sebelum metode onCreate:

private ArrayList<Song> songList;
private ListView songView;

Kita akan menyimpan lagu-lagu dalam daftar dan menampilkannya dalam tipe ListView di dalam layout utama. Di onCreate, setelah mengatur tampilan konten, ambil tipeListView menggunakan ID yang kita sematkan di dalam layout utama:

songView = (ListView)findViewById(R.id.song_list);

Panggil daftarnya seperti yang ditunjukkan di bawah ini:

songList = new ArrayList<Song>();

Selanjutnya, dalam deklarasi kelas utama Activity , dengan metode yang ada, buat metode pembantu untuk mengambil informasi file suara:

public void getSongList() {
  //retrieve song info
}

Dalam metode ini, buat fungsi ContentResolver, ambil URI untuk file musik eksternal, dan buat fungsiCursor dengan menggunakan fungsi ContentResolver untuk menghadirkan file-file musik:

ContentResolver musicResolver = getContentResolver();
Uri musicUri = android.provider.MediaStore.Audio.Media.EXTERNAL_CONTENT_URI;
Cursor musicCursor = musicResolver.query(musicUri, null, null, null, null);

Sekarang kita dapat menampilkan hasil di atas, pertama pastikan bahwa kita memiliki data yang valid:

if(musicCursor!=null && musicCursor.moveToFirst()){
  //get columns
  int titleColumn = musicCursor.getColumnIndex
    (android.provider.MediaStore.Audio.Media.TITLE);
  int idColumn = musicCursor.getColumnIndex
    (android.provider.MediaStore.Audio.Media._ID);
  int artistColumn = musicCursor.getColumnIndex
    (android.provider.MediaStore.Audio.Media.ARTIST);
  //add songs to list
  do {
    long thisId = musicCursor.getLong(idColumn);
    String thisTitle = musicCursor.getString(titleColumn);
    String thisArtist = musicCursor.getString(artistColumn);
    songList.add(new Song(thisId, thisTitle, thisArtist));
  }
  while (musicCursor.moveToNext());
}

Pertama kita mengambil kolom indeks untuk item data yang kami minati untuk setiap lagu, lalu kita menggunakannya untuk membuat objek lagu baru dan menambahkannya ke daftar, sebelum lanjut menyimpulkan hasilnya.

Kembali ke onCreate, setelah kode kita tambahkan, lanjut ke metode baru ini:

getSongList();

3. Menampilkan Lagu

Langkah 1

Sekarang kita dapat menampilkan daftar lagu di antarmuka pengguna. Pada metode onCreate, setelah memanggil metode pembantu yang kita buat beberapa saat yang lalu, mari urutkan data sehingga lagu disajikan menurut abjad:

Collections.sort(songList, new Comparator<Song>(){
  public int compare(Song a, Song b){
    return a.getTitle().compareTo(b.getTitle());
  }
});

Kita gunakan variabel title pada kelas Song, menggunakan metode get yang kami tambahkan, untuk menerapkan metode compare, menyortir lagu berdasarkan judul.

Langkah 2

Mari kita definisikan sebuah layout untuk mewakili setiap lagu dalam daftar. Tambahkan file baru ke folder res/layout pada proyek Anda, beri nama song.xml dan masukkan yang berikut ini:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
  xmlns:tools="http://schemas.android.com/tools"
  android:layout_width="fill_parent"
  android:layout_height="wrap_content"
  android:onClick="songPicked"
  android:orientation="vertical"
  android:padding="5dp" >

  <TextView
    android:id="@+id/song_title"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:textColor="#FFFFFF99"
    android:textSize="20sp"
    android:textStyle="bold" />

  <TextView
    android:id="@+id/song_artist"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:textColor="#FFFFFF99"
    android:textSize="18sp" />

</LinearLayout>

Jangan ragu untuk mengubah layout yang sesuai dengan preferensi Anda. Setiap lagu dalam daftar akan diwakili oleh deretan judul dan nama artis, jadi kita akan menggunakan TextViews untuk menampilkan data ini. Perhatikan tag pembuka LinearLayout terdapat atribut onClick. Kami akan menggunakan metode ini di kelas utama activity untuk bereaksi ketika pengguna memilih lagu dalam daftar, lalu memainkan lagu yang terpilih.

Langkah 3

Kami akan menggunakan adapter untuk memetakan lagu pada tampilan daftar. Tambahkan kelas baru ke aplikasi Anda, beri nama SongAdapter atau nama lain pilihan Anda. Saat membuat kelas, berikan superclass android.widget.BaseAdapter. Eclipse akan menampilkan kode berikut:

public class SongAdapter extends BaseAdapter {

  @Override
  public int getCount() {
    // TODO Auto-generated method stub
    return 0;
  }

  @Override
  public Object getItem(int arg0) {
    // TODO Auto-generated method stub
    return null;
  }

  @Override
  public long getItemId(int arg0) {
    // TODO Auto-generated method stub
    return 0;
  }

  @Override
  public View getView(int arg0, View arg1, ViewGroup arg2) {
    // TODO Auto-generated method stub
    return null;
  }

}

Anda harus menambahkan impor sebagai berikut:

import java.util.ArrayList;
import android.content.Context;
import android.view.LayoutInflater;
import android.widget.LinearLayout;
import android.widget.TextView;

Di dalam deklarasi kelas, nyatakan variabel berikut:

private ArrayList<Song> songs;
private LayoutInflater songInf;

Kita akan memindahkan daftar lagu dari kelas utama Activity dan menggunakan LayoutInflater untuk memetakan deretan judul dan artis ke TextViews dalam layout lagu yang kita buat sebelumnya.

Setelah konteks variabel, beri adaptor sebuah metode konstruktor untuk memanggil variabelnya.

public SongAdapter(Context c, ArrayList<Song> theSongs){
  songs=theSongs;
  songInf=LayoutInflater.from(c);
}

Ubah isi metode getCount untuk mengembalikan ukuran daftar:

@Override
public int getCount() {
  return songs.size();
}

Anda tidak perlu mengubah metode getItem dan getItemId. Perbaharui implementasi metode getView seperti yang ditunjukkan di bawah ini

@Override
public View getView(int position, View convertView, ViewGroup parent) {
  //map to song layout
  LinearLayout songLay = (LinearLayout)songInf.inflate
      (R.layout.song, parent, false);
  //get title and artist views
  TextView songView = (TextView)songLay.findViewById(R.id.song_title);
  TextView artistView = (TextView)songLay.findViewById(R.id.song_artist);
  //get song using position
  Song currSong = songs.get(position);
  //get title and artist strings
  songView.setText(currSong.getTitle());
  artistView.setText(currSong.getArtist());
  //set position as tag
  songLay.setTag(position);
  return songLay;
}

Kita atur judul dan artis dengan mengambil konteks Song yang benar dari daftar dengan menggunakan indeks posisi, memetakan deretan judul dan artis ke tampilan yang kita tambahkan ke file layout lagu. Kita atur juga posisinya sebagai tag tampilan, yang memungkinkan ita memainkan lagu yang benar saat pengguna mengklik item dalam daftar. Ingatlah bahwa file layout song.xml disertai atribut onClick. Kita akan menggunakan metode yang tercantum di sana untuk mengambil tag di Activity

Langkah 3

Kembali ke kelas utama Activity, dalam metode onCreate setelah memilah daftar, buat fungsi baru kelas Adapter dan sematkan di ListView:

SongAdapter songAdt = new SongAdapter(this, songList);
songView.setAdapter(songAdt);

Saat menjalankan aplikasi, perangkat akan menampilkan daftar lagu, dengan mengkliknya akan menampilkan kesalahan saat ini, namun kita akan menerapkan metode klik di tutorial berikutnya.

Kesimpulan

Kita sekarang telah mengatur aplikasi agar dapat membaca lagu dari perangkat pengguna. Dalam bagian selanjutnya, kita akan memutar ulang lagu ketika pengguna memilih lagu menggunakan kelas MediaPlayer. Kita akan menerapkan pemutar ulang menggunakan kelas Service sehingga akan berlanjut saat pengguna berinteraksi dengan aplikasi lain. Terakhir, kita akan menggunakan kelas MediaController untuk memberi kontrol pada pengguna selama pemutaran ulang.