Blog Tutorial Android Bagi Pemula

Sunday, May 31, 2020

Cara Membuat Options Menu di Android Studio

Options Menu Android Studio

Disini akan di bahas cara membuat Options Menu dengan template Empty Activity. Sebenarnya, saat kita membuat sebuah proyek baru, terdapat pilihan template yang sudah memiliki Options Menu, yaitu template Basic Activity. Mungkin karena proyek Anda sudah cukup jauh progressnya sehingga bisa dibilang konyol jika memulai dari awal lagi dengan Basic Activity...
Berikut gambarnya yang menunjukkan keberadaan template tersebut saat dalam proses pembuatan proyek baru :

memilih template basic activity di android studio
Gambar 1 :  Menunjukkan template Basic Activity

Pada pembahasan ini, kita akan membuat Options Menu yang berisi 3 items yaitu : item Share, item Umpan Balik (Feedback), dan item Exit. Pada setiap item yang di klik, implementasinya juga akan dibuat sesuai nama item masing-masing. Jelasnya, saat item Share di klik, maka akan memunculkan aksi share, begitu juga pada Feedback yang akan memunculkan aksi feedback dan Exit yang akan menghakiri aplikasi.

Penerapan Options Menu

Persiapkan project Anda! Jika belum pernah membuat project, bisa melihat pada postingan ini. Seperti biasa, disini saya pakai project proyekpertama.
Pertama-tama tujukan mouse pada folder res, klik kanan pada folder res tersebut lalu pilih New > Android Resource File. Seperti terlihat pada gambar dibawah ini :

panduan membuat android resource filedi android studio
Gambar 2 : Panduan membuat Android Resource File

Kemudian pada File name isikan nama dari menu yang diinginkan, disini kita buat dengan nama first_menu. Pada baris kedua; Resource type pilih Menu pada opsi yang tersedia lalu klik OK. Berikut gambarnya :

cara membuat options menu di android studio
Gambar 3 : Panduan membuat file Menu

Setelah proses diatas, maka pada folder res akan otomatis terbuat subfolder baru yaitu folder menu yang berisi sebuah file xml yaitu first_menu yang dibuat tadi. File first_menu tersebut juga secara otomatis langsung terbuka pada jendela editor. Langkah selanjutnya adalah membuat item-item pada first_menu tersebut. Untuk menambahkan sebuah item adalah dengan tag <item lalu tambahkan atribut android:id dan atribut android:title pada setiap item, kemudian tutup dengan tag </item> atau cukup dengan />.

Untuk 2 item yaitu Share dan Feedback, kita akan menambahkan 2 atribut lagi yaitu app:showAsAction dan android:icon. Fungsi dari atribut app:showAsAction yang kita buat ini adalah untuk menampilkan item tersebut disebelah kanan icon Options Menu, sedangkan android:icon akan memberi icon kepada 2 item tersebut. Sehingga nantinya hanya ada 1 item yaitu item Exit yang ada pada Options Menu. Dan pada item Share dan Feedback tidak akan muncul titlenya melainkan hanya icon karena sudah diletakan disebelah kanan pada Options Menu.

Sebelumnya, kita akan membuat 2 buah icon terlebih dahulu untuk item Share dan item Feedback tersebut. Cara membuat icon adalah dengan memperluas lagi folder res lalu klik kanan pada folder drawable kemudian New > Vector Asset, seperti terlihat pada gambar dibawah :

cara membuat icon vector asset android studio
Gambar 4 :  Panduan membuat icon Vector Asset

Pada baris Name beri nama ic_share, pada baris Clip Art cari icon share dan pada baris Color silahkan pilih warnanya, disini kita pakai warna biru, yang lainnya biarkan apa adanya. Kemudian klik Next lalu klik Finish.

langkah-langkah membuat icon vector asset android studio
Gambar 5 : Panduan membuat icon Vector Asset

Lakukan langkah yang sama untuk icon Feedback, dengan memulainya lagi dari klik kanan folder drawable. Beri nama ic_feedback. Saat memilih icon, agar cepat gunakan mode search; ketikkan share dan feedback saat mencari icon untuk masing-masing item.
Kedua icon yang dibuat tersebut akan berada di dalam folder drawable dengan tipe file xml, yaitu ic_share.xml dan ic_feedback.xml. 
Selanjutnya adalah membuat item-item tersebut di dalam menu first_menu.xml, yang sudah diterangkan diatas sebelumnya. Berikut kode lengkap pada first_menu.xml :

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto">

    <item

        android:id="@+id/share"
        android:title="Share"
        android:icon="@drawable/ic_share"
        app:showAsAction="ifRoom"/>

    <item

        android:id="@+id/feedback"
        android:title="Feedback"
        android:icon="@drawable/ic_feedback"
        app:showAsAction="ifRoom"/>

    <item

        android:id="@+id/exit"
        android:title="Exit"/>

</menu>

Disini kita tidak membuat apa-apa pada activity_main.xml. Jadi tidak ada apa-apa disana, hanya layar putih dengan ActionBar yang berisikan label dan Options Menu.
Setelah semua langkah-langkah diatas, langkah berikutnya adalah melakukan coding pada file java MainActivity.java. Dalam file java tersebut sudah dituliskan sedikit penjelasan mengenai masing-masing metode, yang ditandai dengan /*...........*/, Anda hanya perlu sedikit membaca-baca pada kodingan tersebut dan coba untuk memahaminya.
Berikut kode lengkap pada MainActivity.java :

package com.example.proyekpertama;

import android.content.ActivityNotFoundException;
import android.content.Intent;
import android.os.Build;
import android.os.Bundle;
import android.view.Menu;
import android.view.MenuInflater;
import android.view.MenuItem;
import android.widget.Toast;

import androidx.annotation.RequiresApi;
import androidx.appcompat.app.AppCompatActivity;

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
    }

    @Override
    /*Memanggil first_menu agar muncul di activity_main.xml*/
    public boolean onCreateOptionsMenu(Menu menu) {
        MenuInflater inflater = getMenuInflater();
        inflater.inflate(R.menu.first_menu, menu);
        return true;
    }

    /*menangani saat user mengklik pilihan item pada menu*/
    @RequiresApi(api = Build.VERSION_CODES.JELLY_BEAN)
    public boolean onOptionsItemSelected(MenuItem item) {
        if (item.getItemId() ==R.id.share) {

            /*menangani saat Share di klik*/
            Intent share = new Intent(Intent.ACTION_SEND);
            share.setType("text/plain");
            share.putExtra(Intent.EXTRA_SUBJECT,
                    "Download Aplikasinya");
            share.putExtra(Intent.EXTRA_TEXT,
                    "Ayo segera download" +
                    "aplikasi kami gratis-tis!!");
            startActivity(Intent.createChooser(share,
                    "Bagikan Aplikasi ini"));
                return true;
        }

        /*menangani saat Feedback di klik*/
        if (item.getItemId() ==R.id.feedback) {
            Intent intent = new Intent(Intent.ACTION_SEND);
            intent.setType("text/plain");
            intent.putExtra(Intent.EXTRA_EMAIL, new String[]
                    {"gwnbstudio@gmail.com"});
            intent.putExtra(Intent.EXTRA_CC, new String[]
                    {"birwinecheese@gmail.com"});
            intent.putExtra(Intent.EXTRA_SUBJECT,
                    "Download App Kami");
            intent.putExtra(Intent.EXTRA_TEXT,
                    "Hadir! Aplikasi keren dan" +
                    "Wow.. Segera download di Playstore!");
            try {
                startActivity(Intent.createChooser(intent,
                        "Kirim Feedback"));
            }
            catch (ActivityNotFoundException ex) {
                Toast.makeText(MainActivity.this,
                        "Dibatalkan",Toast.LENGTH_SHORT).show();
            }
            return true;
        }

        /*menangani saat Exit di klik*/
        if (item.getItemId() ==R.id.exit) {
            finishAffinity();
        }
        return true;
    }
}


Pengujian Options Menu

Langkah terakhir adalah menguji aplikasi. Berikut dibawah ini video singkat setelah aplikasi dijalankan pada Android Smartphone.
Sekian. Jika ada pertanyaan, silahkan posting di komentar atau hubungi melalui email atau media lain yang dapat dilihat pada halaman Contact.


Share:

0 comments:

Post a Comment

Hubungi Saya

Name

Email *

Message *

Terlaris 30 Hari Terakhir