Cara Membuat Navigation Drawer Seperti BBM Android

by farizdotid · Published December 2, 2016 · Updated January 26, 2017

farizdotid code – Apa itu Navigation Drawer ? Secara singkatnya Navigation Drawer ini biasa disebut oleh para Android Developer adalah Navbar. Navbar ini biasanya ditandai dengan icon berbentuk 3 garis berbentuk seperti hamburger, Jika icon hamburger itu di klik maka Navbar itu akan muncul dari sebelah kiri layar dan menampilan berbagai menu navigasi seperti Help, Contact Us, Profil dan sebagainya. Nah untuk contoh kasus kali ini ane mau meng-share Cara Membuat Navigation Drawer / Navbar Seperti di Aplikasi BBM.

Oke kita mulai langsung saja ya Cara Membuat Navigation Drawer Seperti BBM ini.

Pertama,

Pada saat pemilihan wizard Activity, pastikan pilih yang Navigation Drawer Activity dan jangan lupa kasih nama activity tersebut . Jika sudah terlanjur membuat Empty Activity silahkan buat kembali Activity hanya saja pilih yang Navigation Drawer Activity.

Kedua,

compile 'de.hdodenhof:circleimageview:2.1.0'

1	compile 'de.hdodenhof:circleimageview:2.1.0'

Tambahkan dependencies library tersebut di build.gradle ( Module : app ). Kegunaan library tersebut untuk membuat foto kita berbentuk bulat.

Ketiga,

Tambahkan beberapa icon untuk dijadikan icon menu navigasi kita nanti seperti BBM. Nah disini kita bisa menggunakan plugin Android Drawable Importer, Jika belum tau bisa ke post ini dulu ( Install dan Cara Penggunaan Plugin Android Drawable Importer ) . Jika agan sudah meng-installnya silahkan menuju ke res → drawable → New → Icon Pack Drawable dibagian bawah. Lalu tambahkan icon-icon berikut ini :

ic_action_achievement (24dp) (black)

ic_action_barcode_2 (24dp) (black)

ic_device_hub (24dp) (black)

ic_info (24 dp) (black)

ic_person_add (24dp) (black)

ic_settings (24dp) (black)

dan 1 icon/gambar bebas untuk dijadikan foto profil di navbar.

Keempat,

Jika sudah membuat Navigation Drawer Activity silahkan agan ke res → menu → activity_main_drawer.xml . Lalu ganti dengan kode berikut ini :

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

    <group android:checkableBehavior="single">
        <item
            android:id="@+id/nav_undangan"
            android:icon="@drawable/ic_person_add"
            android:title="Undangan" />
        <item
            android:id="@+id/nav_saluran"
            android:icon="@drawable/ic_device_hub"
            android:title="Saluran" />
        <item
            android:id="@+id/nav_setelan"
            android:icon="@drawable/ic_settings"
            android:title="Setelan" />
        <item
            android:id="@+id/nav_laporkan"
            android:icon="@drawable/ic_info"
            android:title="Laporkan Masalah" />

        <item
            android:id="@+id/nav_bantuan"
            android:icon="@drawable/ic_info"
            android:title="Bantuan" />
    </group>
</menu>

<?xml version="1.0" encoding="utf-8"?>

<item

android:id="@+id/nav_undangan"

android:icon="@drawable/ic_person_add"

android:title="Undangan" />

<item

android:id="@+id/nav_saluran"

android:icon="@drawable/ic_device_hub"

android:title="Saluran" />

<item

android:id="@+id/nav_setelan"

android:icon="@drawable/ic_settings"

android:title="Setelan" />

<item

android:id="@+id/nav_laporkan"

android:icon="@drawable/ic_info"

android:title="Laporkan Masalah" />

<item

android:id="@+id/nav_bantuan"

android:icon="@drawable/ic_info"

android:title="Bantuan" />

</group>

</menu>

Kelima,

Kita sekarang edit xml bagian header navbarnya. Caranya res → layout → nav_header_main.xml . Lalu samakan dengan kode berikut ini :

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@drawable/side_nav_bar"
    android:gravity="bottom"
    android:orientation="vertical"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/nav_header_vertical_spacing"
    android:theme="@style/ThemeOverlay.AppCompat.Dark">

    <ImageView
        android:paddingTop="16dp"
        android:id="@+id/imgview_barcode"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/ic_action_barcode_2"
        android:layout_gravity="right"/>

    <de.hdodenhof.circleimageview.CircleImageView
        xmlns:app="http://schemas.android.com/apk/res-auto"
        android:id="@+id/imgview_fotoprofil"
        android:layout_width="60dp"
        android:layout_height="60dp"
        android:src="@drawable/logofariz" />

    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:paddingTop="8dp"
        android:text="Farizdotid Code"
        android:textAppearance="@style/TextAppearance.AppCompat.Body1" />

    <TextView
        android:id="@+id/textView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Ada - www.farizdotid.com" />

</LinearLayout>

<?xml version="1.0" encoding="utf-8"?>

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

xmlns:app="http://schemas.android.com/apk/res-auto"

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:background="@drawable/side_nav_bar"

android:gravity="bottom"

android:orientation="vertical"

android:paddingBottom="@dimen/activity_vertical_margin"

android:paddingLeft="@dimen/activity_horizontal_margin"

android:paddingRight="@dimen/activity_horizontal_margin"

android:paddingTop="@dimen/nav_header_vertical_spacing"

android:theme="@style/ThemeOverlay.AppCompat.Dark">

<ImageView

android:paddingTop="16dp"

android:id="@+id/imgview_barcode"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:src="@drawable/ic_action_barcode_2"

android:layout_gravity="right"/>

<de.hdodenhof.circleimageview.CircleImageView

xmlns:app="http://schemas.android.com/apk/res-auto"

android:id="@+id/imgview_fotoprofil"

android:layout_width="60dp"

android:layout_height="60dp"

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

<TextView

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:paddingTop="8dp"

android:text="Farizdotid Code"

android:textAppearance="@style/TextAppearance.AppCompat.Body1" />

<TextView

android:id="@+id/textView"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:text="Ada - www.farizdotid.com" />

</LinearLayout>

Keenam,

Sekarang kita edit bagian warna background header navbar tersebut. Caranya res → drawable → side_nav_bar.xml . Lalu samakan dengan kode berikut :

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

    <solid
        android:color="#1976D2"/>
</shape>

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

android:shape="rectangle">

<solid

android:color="#1976D2"/>

</shape>

Ketujuh,

Nah setelah kita selesai membuat xmlnya sekarang kita koding bagian MainActivitynya.

Dibagian method onNavigationItemSelected itu samakan dengan kode berikut :

@SuppressWarnings("StatementWithEmptyBody")
    @Override
    public boolean onNavigationItemSelected(MenuItem item) {
        // Handle navigation view item clicks here.
        int id = item.getItemId();

        if (id == R.id.nav_undangan) {
            showToast("undangan");
        } else if (id == R.id.nav_saluran) {
            showToast("saluran");
        } else if (id == R.id.nav_setelan) {
            showToast("setelan");
        } else if (id == R.id.nav_laporkan) {
            showToast("laporkan masalah");
        } else if (id == R.id.nav_bantuan) {
            showToast("bantuan");
        }

        DrawerLayout drawer = (DrawerLayout) findViewById(R.id.drawer_layout);
        drawer.closeDrawer(GravityCompat.START);
        return true;
    }

@SuppressWarnings("StatementWithEmptyBody")

@Override

public boolean onNavigationItemSelected(MenuItem item) {

// Handle navigation view item clicks here.

int id = item.getItemId();

if (id == R.id.nav_undangan) {

showToast("undangan");

} else if (id == R.id.nav_saluran) {

showToast("saluran");

} else if (id == R.id.nav_setelan) {

showToast("setelan");

} else if (id == R.id.nav_laporkan) {

showToast("laporkan masalah");

} else if (id == R.id.nav_bantuan) {

showToast("bantuan");

}

DrawerLayout drawer = (DrawerLayout) findViewById(R.id.drawer_layout);

drawer.closeDrawer(GravityCompat.START);

return true;

}

Jika ada error dibagian showToastnya biarkan saja terlbih dahulu karena kita belum membuat method tersebut. Sekaran kita buat method tersebut dengan kode berikut ini :

private void showToast(String message){
        Toast.makeText(this, message, Toast.LENGTH_SHORT).show();
    }

private void showToast(String message){

Toast.makeText(this, message, Toast.LENGTH_SHORT).show();

}

Kedelapan,

Sampai langkah ketujuh tersebut agan sudah berhasil membuat Menu Navigation Drawer seperti BBM, nah dilangkah ini kita akan membuat Navigation Drawer Header itu bisa di klik seperti aplikasi BBM. Jika mengklik barcode maka akan menuju ke activity barcode, dan sebagainya.

Pertama agan harus men-deklarasikan dahulu ImageView dan CircleImageView yang tadi sudah dibuat di xml. Caranya tambahkan diatas method onCreate kode berikut ini :

private ImageView imgview_barcode;
private CircleImageView imgview_fotoprofil;

1 2	private ImageView imgview_barcode; private CircleImageView imgview_fotoprofil;

Jika sudah di deklarasikan sekarang kita harus meng-init komponen tersebut di onCreate. Untuk mempermudah ( versi ane ) kita membuat method khusus untuk menampilkan komponen Navigation Drawer Header tersebut. Buat method bernama initComponentsNavHeader, kodenya berikut ini :

private void initComponentsNavHeader(){
        NavigationView navigationView = (NavigationView) findViewById(R.id.nav_view);
        navigationView.setNavigationItemSelectedListener(this);
        View headerView = navigationView.getHeaderView(0);

        imgview_barcode = (ImageView) headerView.findViewById(R.id.imgview_barcode);
        imgview_barcode.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                showToast("barcode");
            }
        });

        imgview_fotoprofil = (CircleImageView) headerView.findViewById(R.id.imgview_fotoprofil);
        imgview_fotoprofil.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                showToast("Foto Profil");
            }
        });

    }

private void initComponentsNavHeader(){

NavigationView navigationView = (NavigationView) findViewById(R.id.nav_view);

navigationView.setNavigationItemSelectedListener(this);

View headerView = navigationView.getHeaderView(0);

imgview_barcode = (ImageView) headerView.findViewById(R.id.imgview_barcode);

imgview_barcode.setOnClickListener(new View.OnClickListener() {

@Override

public void onClick(View v) {

showToast("barcode");

}

});

imgview_fotoprofil = (CircleImageView) headerView.findViewById(R.id.imgview_fotoprofil);

imgview_fotoprofil.setOnClickListener(new View.OnClickListener() {

@Override

public void onClick(View v) {

showToast("Foto Profil");

}

});

}

Jika sudah membuat method tersebut silahkan panggil method initComponentsNavHeader tersebut di onCreate. Kurang lebih kode di onCreate jadi seperti ini :

 @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
        setSupportActionBar(toolbar);

        DrawerLayout drawer = (DrawerLayout) findViewById(R.id.drawer_layout);
        ActionBarDrawerToggle toggle = new ActionBarDrawerToggle(
                this, drawer, toolbar, R.string.navigation_drawer_open, R.string.navigation_drawer_close);
        drawer.setDrawerListener(toggle);
        toggle.syncState();

        initComponentsNavHeader();
    }

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_main);

Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);

setSupportActionBar(toolbar);

DrawerLayout drawer = (DrawerLayout) findViewById(R.id.drawer_layout);

ActionBarDrawerToggle toggle = new ActionBarDrawerToggle(

this, drawer, toolbar, R.string.navigation_drawer_open, R.string.navigation_drawer_close);

drawer.setDrawerListener(toggle);

toggle.syncState();

initComponentsNavHeader();

}

Kesembilan,

Selesai. Silahkan run aplikasi tersebut di emulator ataupun device android agan dan lihat hasilnya 🙂 Kurang lebih kode di MainActivity adalah sebagai berikut :

package com.farizdotid.navigationdrawerbbm;

import android.os.Bundle;
import android.support.design.widget.FloatingActionButton;
import android.support.design.widget.Snackbar;
import android.view.View;
import android.support.design.widget.NavigationView;
import android.support.v4.view.GravityCompat;
import android.support.v4.widget.DrawerLayout;
import android.support.v7.app.ActionBarDrawerToggle;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.widget.Toolbar;
import android.view.Menu;
import android.view.MenuItem;
import android.widget.ImageView;
import android.widget.Toast;

import de.hdodenhof.circleimageview.CircleImageView;

public class MainActivity extends AppCompatActivity
        implements NavigationView.OnNavigationItemSelectedListener {

    private ImageView imgview_barcode;
    private CircleImageView imgview_fotoprofil;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
        setSupportActionBar(toolbar);

        DrawerLayout drawer = (DrawerLayout) findViewById(R.id.drawer_layout);
        ActionBarDrawerToggle toggle = new ActionBarDrawerToggle(
                this, drawer, toolbar, R.string.navigation_drawer_open, R.string.navigation_drawer_close);
        drawer.setDrawerListener(toggle);
        toggle.syncState();

        initComponentsNavHeader();
    }

    private void initComponentsNavHeader(){
        NavigationView navigationView = (NavigationView) findViewById(R.id.nav_view);
        navigationView.setNavigationItemSelectedListener(this);
        View headerView = navigationView.getHeaderView(0);

        imgview_barcode = (ImageView) headerView.findViewById(R.id.imgview_barcode);
        imgview_barcode.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                showToast("barcode");
            }
        });

        imgview_fotoprofil = (CircleImageView) headerView.findViewById(R.id.imgview_fotoprofil);
        imgview_fotoprofil.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                showToast("Foto Profil");
            }
        });

    }
    @Override
    public void onBackPressed() {
        DrawerLayout drawer = (DrawerLayout) findViewById(R.id.drawer_layout);
        if (drawer.isDrawerOpen(GravityCompat.START)) {
            drawer.closeDrawer(GravityCompat.START);
        } else {
            super.onBackPressed();
        }
    }

    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        // Inflate the menu; this adds items to the action bar if it is present.
        getMenuInflater().inflate(R.menu.main, menu);
        return true;
    }

    @Override
    public boolean onOptionsItemSelected(MenuItem item) {
        // Handle action bar item clicks here. The action bar will
        // automatically handle clicks on the Home/Up button, so long
        // as you specify a parent activity in AndroidManifest.xml.
        int id = item.getItemId();

        //noinspection SimplifiableIfStatement
        if (id == R.id.action_settings) {
            return true;
        }

        return super.onOptionsItemSelected(item);
    }

    @SuppressWarnings("StatementWithEmptyBody")
    @Override
    public boolean onNavigationItemSelected(MenuItem item) {
        // Handle navigation view item clicks here.
        int id = item.getItemId();

        if (id == R.id.nav_undangan) {
            showToast("undangan");
        } else if (id == R.id.nav_saluran) {
            showToast("saluran");
        } else if (id == R.id.nav_setelan) {
            showToast("setelan");
        } else if (id == R.id.nav_laporkan) {
            showToast("laporkan masalah");
        } else if (id == R.id.nav_bantuan) {
            showToast("bantuan");
        }

        DrawerLayout drawer = (DrawerLayout) findViewById(R.id.drawer_layout);
        drawer.closeDrawer(GravityCompat.START);
        return true;
    }

    private void showToast(String message){
        Toast.makeText(this, message, Toast.LENGTH_SHORT).show();
    }
}

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

package com.farizdotid.navigationdrawerbbm;

import android.os.Bundle;

import android.support.design.widget.FloatingActionButton;

import android.support.design.widget.Snackbar;

import android.view.View;

import android.support.design.widget.NavigationView;

import android.support.v4.view.GravityCompat;

import android.support.v4.widget.DrawerLayout;

import android.support.v7.app.ActionBarDrawerToggle;

import android.support.v7.app.AppCompatActivity;

import android.support.v7.widget.Toolbar;

import android.view.Menu;

import android.view.MenuItem;

import android.widget.ImageView;

import android.widget.Toast;

import de.hdodenhof.circleimageview.CircleImageView;

public class MainActivity extends AppCompatActivity

implements NavigationView.OnNavigationItemSelectedListener {

private ImageView imgview_barcode;

private CircleImageView imgview_fotoprofil;

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_main);

Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);

setSupportActionBar(toolbar);

DrawerLayout drawer = (DrawerLayout) findViewById(R.id.drawer_layout);

ActionBarDrawerToggle toggle = new ActionBarDrawerToggle(

this, drawer, toolbar, R.string.navigation_drawer_open, R.string.navigation_drawer_close);

drawer.setDrawerListener(toggle);

toggle.syncState();

initComponentsNavHeader();

}

private void initComponentsNavHeader(){

NavigationView navigationView = (NavigationView) findViewById(R.id.nav_view);

navigationView.setNavigationItemSelectedListener(this);

View headerView = navigationView.getHeaderView(0);

imgview_barcode = (ImageView) headerView.findViewById(R.id.imgview_barcode);

imgview_barcode.setOnClickListener(new View.OnClickListener() {

@Override

public void onClick(View v) {

showToast("barcode");

}

});

imgview_fotoprofil = (CircleImageView) headerView.findViewById(R.id.imgview_fotoprofil);

imgview_fotoprofil.setOnClickListener(new View.OnClickListener() {

@Override

public void onClick(View v) {

showToast("Foto Profil");

}

});

}

@Override

public void onBackPressed() {

DrawerLayout drawer = (DrawerLayout) findViewById(R.id.drawer_layout);

if (drawer.isDrawerOpen(GravityCompat.START)) {

drawer.closeDrawer(GravityCompat.START);

} else {

super.onBackPressed();

}

@Override

public boolean onCreateOptionsMenu(Menu menu) {

// Inflate the menu; this adds items to the action bar if it is present.

getMenuInflater().inflate(R.menu.main, menu);

return true;

}

@Override

public boolean onOptionsItemSelected(MenuItem item) {

// Handle action bar item clicks here. The action bar will

// automatically handle clicks on the Home/Up button, so long

// as you specify a parent activity in AndroidManifest.xml.

int id = item.getItemId();

//noinspection SimplifiableIfStatement

if (id == R.id.action_settings) {

return true;

}

return super.onOptionsItemSelected(item);

}

@SuppressWarnings("StatementWithEmptyBody")

@Override

public boolean onNavigationItemSelected(MenuItem item) {

// Handle navigation view item clicks here.

int id = item.getItemId();

if (id == R.id.nav_undangan) {

showToast("undangan");

} else if (id == R.id.nav_saluran) {

showToast("saluran");

} else if (id == R.id.nav_setelan) {

showToast("setelan");

} else if (id == R.id.nav_laporkan) {

showToast("laporkan masalah");

} else if (id == R.id.nav_bantuan) {

showToast("bantuan");

}

DrawerLayout drawer = (DrawerLayout) findViewById(R.id.drawer_layout);

drawer.closeDrawer(GravityCompat.START);

return true;

}

private void showToast(String message){

Toast.makeText(this, message, Toast.LENGTH_SHORT).show();

}

Kesepuluh,

Agan bisa mendownload / mengclone project yang tadi sudah dibuat di akun github ane ( https://github.com/farizdotid/Navigation-Drawer-Looks-Like-BBM-App-Android )

Sekian tutorial mengenai Cara Membuat Navigation Drawer Seperti BBM Android. Semoga bermanfaat dan seperti biasa jika ada pertanyaan bisa langsung berkomentar di artikel ini atau bisa kontak media sosial ane 🙂

Tags: Android Cara Membuat Aplikasi Android Pemrograman Android

farizdotid

Seorang manusia biasa yang mempunyai fokus ke bidang pemrograman android dan ngeblog mengenai teknologi.

Adam syf says:

December 3, 2016 at 4:32 am

Good idea, boleh dicoba 🙂

Reply
- farizadmin says:
  
  December 3, 2016 at 5:07 am
  
  silahkan om hihi 🙂
  
  Reply
Endar Fernandes says:

December 3, 2016 at 6:16 am

Wah keren nih tutorialnya. Hasil nya benar-benar mirip sama bbm.. kalau dikembangkan bisa jadi saingan bbm nih. Hehe.
Terima kasih gan tutorialnya.

Reply
- farizadmin says:
  
  December 3, 2016 at 6:18 am
  
  agan aja yang buat app saingan bbm hihi 🙂 terimakasih kembali gan 🙂
  
  Reply
Machtal says:

December 4, 2016 at 8:21 am

screensho kodenya ada yang kepotong gan, jadinya gak kelihatan, tolong diperbaiki. nice article !

Reply
- farizadmin says:
  
  December 7, 2016 at 2:54 am
  
  kepotong gimana maksudnya gan? kalau pun ada code yang terpotong masih bisa liat langsung ke Github ane kok gan 🙂
  
  Reply
  - Machtal says:
    
    February 25, 2017 at 1:24 pm
    
    maaf, baru tahu ternyata tempat kodenya bisa di geser :p
    
    Reply
    - farizdotid says:
      
      May 3, 2017 at 1:22 pm
      
      butuh aqua ga gan ? 😀
      
      Reply
Bagus Javaneze says:

April 28, 2017 at 12:39 pm

gan kalo misal action menu di navigation drawernya ketika diklik akan menampilkan fragment activity gmm caranya ya gan? soalnya ane mau buat action nya seperti

Reply
- farizdotid says:
  
  May 3, 2017 at 1:23 pm
  
  bisa gan, kasih action di klik menu navbarnya dengan kodingan manggil fragment.
  
  Reply
  - Bagus Javaneze says:
    
    May 4, 2017 at 5:53 am
    
    oke gan makasih
    
    Reply
Alfin Auzikri says:

June 29, 2017 at 2:31 am

thank you mas

Reply
- farizdotid says:
  
  July 3, 2017 at 9:06 am
  
  sama-sama mas, semoga bermanfaat 🙂
  
  Reply
Baskoro says:

August 5, 2017 at 7:58 am

mas mau nanya koding untuk “action di klik menu navbarnya dengan kodingan manggil fragment” itu gimna ya soalnya saya bingung terus penempatan nya dimana mohon pencerahan??

Reply
- farizdotid says:
  
  August 7, 2017 at 1:41 pm
  
  if (id == R.id.nav_undangan) {
  showToast(“undangan”);
  } else if (id == R.id.nav_saluran) {
  showToast(“saluran”);
  } else if (id == R.id.nav_setelan) {
  showToast(“setelan”);
  } else if (id == R.id.nav_laporkan) {
  showToast(“laporkan masalah”);
  } else if (id == R.id.nav_bantuan) {
  showToast(“bantuan”);
  }
  
  dibagian itu mas, tinggal ganti code yang showtoast itu sama sesuai dengan kebutuhan mas.
  
  Reply
Mahayasa says:

August 26, 2017 at 5:47 am

mas mau tanya nih misalnya kan aku milih menu saluran, trus di layout saluran ada menu lagi misalnya saluran a, b, c, dsb
nah gmna caranya supaya ketika menu saluran a di klik masuk ke layout saluran a?
trus di atasnya isi tombol back?
terimakasih

Reply
- farizdotid says:
  
  August 26, 2017 at 4:20 pm
  
  bukannya tinggal start activity layout saluran a aja ya mas? terus untuk tombol backnya bisa lihat disini mas : https://stackoverflow.com/questions/26651602/display-back-arrow-on-toolbar-android
  
  Reply
Maskur says:

October 16, 2017 at 7:43 am

mas kalo di gabung dengan activity login terus di parse pake Intent, gimana cara merubah TextView dan photo di NavHeader mas..?

terima kasih

Reply
- farizdotid says:
  
  October 16, 2017 at 9:39 am
  
  Di intent harus bawa data. Bisa pakai put extra get extra, Nah untuk kodingannya mungkin bisa referensi dari sini :
  imgview_fotoprofil = (CircleImageView) headerView.findViewById(R.id.imgview_fotoprofil);
  imgview_fotoprofil.setOnClickListener(new View.OnClickListener() {
  @Override
  public void onClick(View v) {
  showToast(“Foto Profil”);
  }
  });
  
  imgview_fotoprofil.setImageResource(hasil intent extra).
  
  Untuk textviewnya pun sama kurang lebih metodenya mas 🙂
  
  Reply

Cara Membuat Navigation Drawer Seperti BBM Android

You may also like...

19 Responses

Leave a Reply Cancel reply

Tutorial Terbaru

Komentar Terbaru

Cara Membuat Navigation Drawer Seperti BBM Android

Pertama,

Kedua,

Ketiga,

Keempat,

Kelima,

Keenam,

Ketujuh,

Kedelapan,

Kesembilan,

Kesepuluh,

Share this:

You may also like...

Cara Mendapatkan API Key Google Lengkap dan Mudah

Library Glide, Library untuk Menampilkan Gambar dari Internet

Tutorial CRUD Rest API Menggunakan Retrofit 2 Android

19 Responses

Leave a Reply Cancel reply

Tutorial Terbaru

Komentar Terbaru