Membuat panel navigasi di android

Membuat navigation drawer android

Apa itu Navigation Drawer?

Panel samping navigasi adalah panel UI yang menampilkan menu navigasi utama aplikasi Anda. Panel yang disembunyikan saat tidak digunakan, tetapi muncul saat pengguna menggesekkan jari dari tepi kiri layar atau pengguna menyentuh ikon navigasi di toolbar atau bilah aplikasi.

Bagaimana Cara membuat panel navigasi atau navigation drawer?

• Tambahkan dependesi

Halaman ini menggunakan API dari Android Support Library, jadi kita perlu menambahkan dependensi compile 'com.android.support:design:+' compile 'com.android.support:appcompat-v7:+' compile 'com.android.support:support-v4:+' ke dalam file build.gradle.

dependencies {
        compile 'com.android.support:design:+'
        compile 'com.android.support:appcompat-v7:+'
        compile 'com.android.support:support-v4:+'
        compile fileTree(dir: 'libs', include: ['*.jar'])
}
    
    

• Tambahkan panel ke tata letak

Sebelum Menambahkan panel ke tata letak.. Jangan lupa untuk mengimpor android.support.v4.widget.DrawerLayout dan android.support.design.widget.NavigationView ke MainActivity.java:

import android.support.v4.widget.DrawerLayout;
import android.support.design.widget.NavigationView
    
    

• Ganti tema bawaan

kita harus Menambahkan tema AppCompat.Light.NoActionBar di AndroidManifest.xml , Kita disini tidak akan menggunakan toolbar atau bilah tindakan :

android:theme="@style/Theme.AppCompat.Light.NoActionBar
    
    

• Tambhkan tata letak panel navigasi

Untuk menambahkan panel samping navigasi, deklarasikan tata letak Anda dengan DrawerLayout sebagai tampilan root. Di dalam DrawerLayout, tambahkan tata letak untuk konten utama UI (tata letak utama Anda saat panel samping disembunyikan) dan tampilan lain yang berisi konten pada panel navigasi.

Misalnya, tata letak berikut menggunakan DrawerLayout dengan dua tampilan turunan: RelativeLayout untuk memuat konten utama dan NavigationView untuk konten panel samping navigasi atau navigation drawer.

    
<?xml version="1.0" encoding="utf-8"?>
<!-- Main Drawer -->
<android.support.v4.widget.DrawerLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true">
<!-- Wrapper -->
<RelativeLayout
android:id="@+id/content_frame"
android:layout_width="match_parent"
android:layout_height="match_parent" >

<!-- Main Content -->

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center">

<TextView
android:text="@string/hello_world"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />

</LinearLayout>

</RelativeLayout>
<!-- Navigation Drawer / left drawer-->
<android.support.design.widget.NavigationView
android:id="@+id/navigation"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"
/>
</android.support.v4.widget.DrawerLayout>