Tutorial Membuat Aplikasi Zikir sederhana untuk Android menggunakan Android Studio

Assalamualaikum Wr Wb

Pertama-tama kita mulai terlebih dahulu dengan mengucap bismillahirohmanirohim, supaya pada tutorial kali ini kita mendapatkan berkah. Amiin amiin ya robbal alamin..

Yang harus kalian siapkan terlebih dahulu adalah software Android Studio yang bisa kalian download melalui link berikut ini https://developer.android.com/studio/index.html dan asset suara nya melalui link https://drive.google.com/open?id=0B8Mj8B7e4uZTR3pBdW5tRnNScWs

Jika sudah langsung saja ikuti tutorial nya berikut ini:

Buka aplikasi android studio nya.. lalu buat aplikasi baru dengan memilih "Start a new Android Studio project"

Setelah itu akan muncul window baru dan isi informasi tentang aplikasi yang ingin kalian buat, seperti contoh berikut

Kemudian ceklis Phone and Tablet dan pilih Minimum SDK untuk menentukan versi terkecil yang bisa dapat menginstall aplikasi kalian

Kemudian pilih type layout yang ingin kalian buat pertama kali, karena disini masih tahap pemula kita pilih "Empty Activity"

Untuk selanjutnya biarkan default saja dan langsung klik "Finish"

Setelah itu tunggu proses pembuatan project baru nya, dan jika sudah akan muncup tampilan seperti berikut ini..

Liat pada bagian navigasi disebelah kiri, disana terdapat file file dari project aplikasi kalian.. Untuk membuat sebuah tampilan, kalian dapat mengedit dan membuat file pada folder /res/layout, dan untuk membuat sebuah perintah-perintah dari aplikasi kalian, dapat kalian liat pada folder /java..

Untuk sekarang kita edit terlebih dahulu untuk tampilan dari aplikasi nya, buka file activity_main.xml yang ada pada folder /res/layout.. Sesuaikan kode nya seperti berikut ini

<?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="vertical"    tools:context="es.esy.android_inyourhand.tasbihku.MainActivity">
    <TextView        android:background="@android:color/holo_red_light"        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:textSize="70sp"        android:gravity="center"        android:onClick="subhanallah"        android:text="سُبْحَانَ اللهِ" />
    <TextView        android:background="@android:color/holo_orange_light"        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:textSize="70sp"        android:gravity="center"        android:onClick="alhamdulillah"        android:text="اَلْحَمْدُ ِللهِ" />
    <TextView        android:background="@android:color/holo_green_light"        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:textSize="70sp"        android:gravity="center"        android:onClick="lailahaillalloh"        android:text="لاَ إِلَهَ إِلاَّ اللهُ" />
    <TextView        android:background="@android:color/holo_blue_light"        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:textSize="70sp"        android:gravity="center"        android:onClick="allohuakbar"        android:text="اللهُ أَكْبَرُ" />
    <TextView        android:id="@+id/dzikir"        android:background="@drawable/round"        android:layout_width="match_parent"        android:layout_height="match_parent"        android:textSize="70sp"        android:gravity="center"        android:text="0" />
</LinearLayout>

Jangan kalian copy paste, tapi melainkan kalian ketik dan pahami dari setiap baris agar kalian mengerti kegunaan dari code tersebut.

Jika terdapat error pada script android:background="@drawable/round" itu terjadi karena kita belum membuat sebuah background yang menggunakan kode xml dan terdapat pada folder /res/drawable. Buat lah dengan cara klik kanan pada folder drawable, kemudian pilih New lalu Drawable Resource File dan kalian beri nama round.xml. Lalu sesuaikan kode nya seperti berikut

<?xml version="1.0" encoding="utf-8"?><shape    xmlns:android="http://schemas.android.com/apk/res/android"    android:shape="oval">
    <solid        android:color="@color/colorAccent"/>
    <size        android:width="120dp"        android:height="120dp"/></shape>

Sekarang kita beralih ke sisi kontroller nya, buka folder /java/package.aplikasi.kalian dan pilih MainActivity.java

Nah disini kita akan membuat kontroller dari aplikasi kalian, mulai dari saat aplikasi kalian di klik dan sebgaianya.. Seseuaikan isi kode nya seperti berikut

public class MainActivity extends AppCompatActivity {

    TextView dzikir;    int zikir = 0;    Vibrator vibe;    MediaPlayer mediaPlayer;
    @Override    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_main);
        dzikir = (TextView)findViewById(R.id.dzikir);        vibe = (Vibrator) getSystemService(Context.VIBRATOR_SERVICE);
    }

    public void subhanallah(View view){
        mediaPlayer = MediaPlayer.create(getApplicationContext(), R.raw.tasbih);        mediaPlayer.start();        zikir = zikir + 1;        tampil(zikir);        vibe.vibrate(100);    }

    public void alhamdulillah(View view){
        mediaPlayer = MediaPlayer.create(getApplicationContext(), R.raw.tahmid);        mediaPlayer.start();        zikir = zikir + 1;        tampil(zikir);        vibe.vibrate(100);    }

    public void lailahaillalloh(View view){
        mediaPlayer = MediaPlayer.create(getApplicationContext(), R.raw.tahlil);        mediaPlayer.start();        zikir = zikir + 1;        tampil(zikir);        vibe.vibrate(100);    }

    public void allohuakbar(View view){
        mediaPlayer = MediaPlayer.create(getApplicationContext(), R.raw.takbir);        mediaPlayer.start();        zikir = zikir + 1;        tampil(zikir);        vibe.vibrate(100);    }

    public void tampil(int z){
        dzikir.setText(""+z);    }

    @Override    public boolean onCreateOptionsMenu(Menu menu) {
        MenuInflater inflater = getMenuInflater();        inflater.inflate(R.menu.menu_main, menu);        return true;    }

    @Override    public boolean onOptionsItemSelected(MenuItem item) {
        switch (item.getItemId()){
            case R.id.reset:
                mediaPlayer.stop();                zikir = 0;                tampil(zikir);            default:
                return super.onOptionsItemSelected(item);        }
    }

}

Jika terdapat error karena library belum di import, kalian dapat mengklik alt+enter. Dan jika masih ada error, itu karena file sound nya belum kita masukkan ke project kalian.. Kalian dapat membuka directory file sound hasil download kalian, dan mencopy nya seperti mencopy file biasanya.. Lalu kembali ke android studio dan buatlah folder raw pada folder res untuk tempat menyimpan file sound zikir nya. Jika sudah langsung saja kalian paste pada folder raw tersebut.

Jika masih ada error, biarkan saja dahulu.. Karena masih ada yang belum di buat, yaitu menu untuk me reset hitungan zikir.. Buat sebuah folder menu pada res, lakukan seperti membuat folder raw. Jika sudah klik kanan pada folder menu, kemudian pilih New lalu Menu Resource File dan kalian beri nama menu_main.xml. Lalu sesuaikan kode nya seperti berikut

<?xml version="1.0" encoding="utf-8"?><menu xmlns:android="http://schemas.android.com/apk/res/android">    <item android:id="@+id/reset"        android:title="Reset"/></menu>

Langkah terakhir adalah menambah satu baris script pada file AndroidManifest.xml dimana kode ini berfungsi untuk memberikan hak akses atau izin ke android kalian..

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

AndroidManifest.xml berfungsi sebagai tempat informasi dan konfigurasi dari aplikasi yang ingin kalian buat..

Jika sudah kalian dapat menjalankannya atau membuildnya menjadi apk dengan memilih menu build.. Dan jika masih terdapat error, kalian dapat menanyakan nya pada kolom komentar postingan ini..

Untuk yang ingin mencoba aplikasi Zikir yang ada dalam tutorial ini kalian dapat mendownload nya melalui link berikut ini https://drive.google.com/open?id=0B8Mj8B7e4uZTSlFMQnVkZlpXTzQ

Oke cukup sekian dan Terimakasih.. Semoga bermanfaat untuk kalian semua, serta bermanfaat bagi nusa dan bangsa.. Allohu Akbar...

Author : Robby Akbar

Share this

Berlangganan via email

Related Posts