Membuat Aplikasi Android dengan Navigation Drawer Material Design

,
Hai sobat, pada artikel sebelumnya yang berjudul Membuat Gallery Foto di Android, kita telah mencoba membuat aplikasi gallery foto dengan penerapan komponen ViewPager. Dan kali ini kita akan mencoba membuat aplikasi sederhana menggunakan material design. Bagaimana membuatnya, berikut caranya.

Membuat Aplikasi Android Sederhana dengan Material Design


Saat ini, aplikasi android telah banyak menggunakan desain material dari google. Desain ini memiliki kelebihan tersendiri dalam UI/UX. Tampilan pada Material Design akan tampak seperti kertas yang saling bertumpukan, karena desain ini memiliki z-level atau evaluasi dan tampilannya juga memiliki animasi yang atraktif dan bagus dibanding desain-desain sebelumnya.

Banyak kemudahan yang diberikan oleh material design, tampilanya yang simple, ringan dan atraktif membuatnya mudah digunakan oleh pengguna dan memberikan dampak yang bagus untuk UI/UX suatu aplikasi. Material design telah diresmikan oleh Google pada saat Google I/O 2014 tepatnya bulan Juni dan dilanjutkan dengan diluncurkanya android Lollipop dan SDK 21 pada bulan Agustus. Untuk lebih jelasnya tentang Material Design, sobat bisa baca di sini.

Baca juga "Cara Mengecek Score SEO Blog"

Di dalam desain material desain, terdapat fitur dan tampilan yang diperbaharui contohnya seperti tampilan Floating Action Button, Navigation Drawer, dan masih banyak lagi. Dan dalam artikel ini kita akan membuat aplikais sederhana dengan fitut tampilan Navigation Drawer. Fitur ini untuk manampilkan menu pilihan yang ada dalam aplikasi. Biasanya Navigation Drawer dibuat digunakan untuk menampilkan fitur yan gdimiliki oleh aplikasi, atau Navigation Drawer dalam aplikasi digunakan untuk menampilkan kategori halaman atau activity di dalam apikasi android.

Tampilan navigation drawer tersembunyi dan biasaya berada di sisi kiri aplikasi. Untuk menampilkan navigation drawer, atau Sliding Menu pengguna tinggal menggeser dari sisi kiri ke sisi kanan. Atau untuk menampilkan navigation drawer dengan memilih tombol hamburger atau garis tiga di sisi kiri atas aplikasi. Fitur navigation drawer ini sangat dibutuhkan jika kita aplikasi sudah memiliki kategori activity atau memiliki fitur yang banyak.

Baca juga "Cara Menampilkan Kode HTML pada Komponen WebView Android"

Pada kesempatan kali ini kita akan mencoba membuat aplikasi sederhana menggunakan material design. Dengan sedikit tambahan warna dan gaya agar tampil bagus dan sesuai dengan standard Google. Untuk membuatnya, silahkan sobat simak langka-langkah di bawah ini :

Pertama sobat buat project baru denga nnama Blog Setya Aji, dan untuk packagenya silahkan beri nama blogsetyaaji.com

Klik next dan pilih target SDK yang sobat inginkan, lalu klik next dan pilih Navigation Drawer Activity. Klik finish, dan tampilan layout akan muncul.

Jika kita mengunakan Navigation Darawer Activity, maka akan terbentuk beberapa layout dan activity berikut layout yang terbentuk dan fungsinya :

  • activity_main.xml : Berguna untuk menampilkan layar utama dan memanggil layout dari content_main.xml
  • app_bar_main.xml : Berguna untuk mengatur bagian menu item pada navigation bar
  • content_main.xml : Berguna untuk menampilkan apa yang ingin kita tampilkan di dalam aplikasi seperti Label atau gambar. Layput ini nantinya akan dipanggil dan dimasukkan ke layout activity_main.xml
  • nav_header_main.xml : Berguna untuk membentuk layout header pada menu navigasi.
Dan itu sedikit penjelasan untuk file yang secara default terbentuk. Dan sekarang, kita pergi ke pembuatan layout.

Untuk mengubah layout pada bagian header menu navigasi, sobat tinggal buka layout nav_header_main.xml dan ubah komponen yang sobat mau.

Pindah ke menu navigasi, jika sobat inginmengubah menu apa saja yang ingin ditampilkan di menu navigasi dan mengubah icon menu, silahkan sobat pilih directory menu dan pilih activity_main_drawer.xml dan buat kodenya seperti 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/home"
            android:icon="@drawable/home"
            android:title="Home" />
        <item
            android:id="@+id/profil"
            android:icon="@drawable/about"
            android:title="Profil" />
        <item
            android:id="@+id/youtube"
            android:icon="@drawable/youtube"
            android:title="Youtube" />
        <item
            android:id="@+id/fb"
            android:icon="@drawable/facebook"
            android:title="Facebook" />
    </group>

    <item android:title="Communicate">
        <menu>
            <item
                android:id="@+id/kontak"
                android:icon="@drawable/contact"
                android:title="Kontak" />
            <item
                android:id="@+id/tentang"
                android:icon="@drawable/about"
                android:title="Tentang" />
        </menu>
    </item>

</menu>

Jangan lupa memasukkan gambar icon ke dalam folder drawable.

Selanjutnya beralih ke content_main.xml pada directory layout, buat kodenya seperti berikut ini


<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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:layout_width="match_parent"
    android:layout_height="match_parent"
    app:layout_behavior="@string/appbar_scrolling_view_behavior"
    tools:context="com.blogsetyaaji.smafuturegate.MainActivity"
    tools:showIn="@layout/app_bar_main">

    <FrameLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:id="@+id/container">

    <TextView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:text="WELCOME"
        android:textAppearance="?android:attr/textAppearanceLarge"
        android:gravity="center"/>

    </FrameLayout>
</RelativeLayout>

Jika sudah, silahkan sobat buat file layout lagi dengan nama tentang.xml, dan buat kodenya seperti berikut ini


<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#FFF8E1">

    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/imageView"
        android:layout_gravity="center_horizontal"
        android:src="@mipmap/ic_launcher"
        android:layout_marginTop="35dp"
        android:layout_marginBottom="25dp"/>

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Blog Setya Aji"
        android:id="@+id/textView"
        android:layout_gravity="center_horizontal"
        android:textStyle="bold"
        android:textColor="#000000"/>

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="versi 1.0"
        android:id="@+id/textView2"
        android:layout_gravity="center_horizontal" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Oleh :"
        android:id="@+id/textView3"
        android:textAppearance="?android:attr/textAppearanceMedium"
        android:layout_gravity="center_horizontal"
        android:textStyle="bold"
        android:textColor="#000000"
        android:layout_marginTop="75dp"/>

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Aji Setya"
        android:id="@+id/textView4"
        android:layout_gravity="center_horizontal"
        android:textStyle="bold"
        android:textColor="#000000"/>

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="www.blogsetyaaji.blogspot.com"
        android:id="@+id/textView5"
        android:layout_gravity="center_horizontal"/>
</LinearLayout>

Selanjutnya silahkan sobat buat Fragment baru untuk menampilkan WebView dari halaman suatu website dengan cara seperti berikut ini

Membuat Aplikasi Android Sederhana dengan Material Design

Pertama klik kanan pada directory Layout > new > Layout resource file, beri nama dengan frag_web.xml dan buat kodenya seperti berikut ini


<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="match_parent"
    android:layout_height="match_parent">

    <ProgressBar
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/progressBar"
        style="?android:attr/progressBarStyleHorizontal"/>

    <WebView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:id="@+id/webView"/>

</LinearLayout>

Tahap membuat layout sudah selesai, tahap selanjutnya adalah membuat fragment dan class untuk memanggil layout yang kita buat.

Membuat Aplikasi Android Sederhana dengan Material Design

Dalam artikel Navigation Drawer Material Design ini kita akan menampilkan alamat web dalam komponen WebView di dalam masing-masing fragment. Jika sobat belum tahu bagaimana cara menampilkan web di android menggunakan komponen WebView, sobat bisa membacanya di link berikut.

Baca juga "Cara Menampilkan Web di Komponen WebView Android"

Pertama sobat tambahkan class baru, caranya dengan klik kanan pada directory java dan pilih new > java class. Beri nama dengan Frag_web dan buat kodenya seperti berikut ini


package com.blogsetyaaji.smafuturegate;

import android.annotation.TargetApi;
import android.content.Context;
import android.net.Uri;
import android.os.Build;
import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.webkit.WebChromeClient;
import android.webkit.WebView;
import android.webkit.WebViewClient;
import android.widget.ProgressBar;
import android.widget.TextView;

public class Frag_web extends Fragment {

    WebView wb;
    ProgressBar pg;

    @TargetApi(Build.VERSION_CODES.JELLY_BEAN)
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
                             Bundle savedInstanceState) {
        View v = inflater.inflate(R.layout.frag_web, null);
        wb = (WebView)v.findViewById(R.id.webView);
        pg = (ProgressBar)v.findViewById(R.id.progressBar);
        wb.getSettings().setJavaScriptEnabled(true);
        wb.setWebViewClient(new WebViewClient());

        wb.getSettings().setDomStorageEnabled(true);
        wb.getSettings().setLoadWithOverviewMode(true);
        wb.getSettings().setUseWideViewPort(true);
        wb.getSettings().setSupportMultipleWindows(true);
        wb.getSettings().setJavaScriptCanOpenWindowsAutomatically(true);
        wb.setHorizontalScrollBarEnabled(false);
        wb.setScrollBarStyle(WebView.SCROLLBARS_OUTSIDE_OVERLAY);
        wb.getSettings().setAllowFileAccessFromFileURLs(true);
        wb.getSettings().setAllowUniversalAccessFromFileURLs(true);

        wb.setWebChromeClient(new WebChromeClient() {
            @Override
            public void onProgressChanged(WebView view, int newProgress) {
                pg.setVisibility(View.VISIBLE);
                pg.setProgress(newProgress);
                if (newProgress == 100) {
                    pg.setVisibility(View.GONE);
                }
            }
        });

        pg.setVisibility(View.VISIBLE);
        wb.loadUrl("http://blogsetyaaji.blogspot.com");
        return v;
    }

    @Override
    public void onPause() {
        wb.onPause();
        super.onPause();
    }
}

Selanjutnya sobat tambahkan beberapa class lagi dan buat kodenya seperti kolom kode di bawah ini

Frag_Tentang.java


package com.blogsetyaaji.smafuturegate;

import android.content.Context;
import android.net.Uri;
import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.TextView;

import java.util.zip.Inflater;

public class Frag_Tentang extends Fragment {

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
                             Bundle savedInstanceState) {
        View v = inflater.inflate(R.layout.tentang, null);
        return v;
    }

}

Frag_Profil.java


package com.blogsetyaaji.smafuturegate;

import android.annotation.TargetApi;
import android.content.Context;
import android.net.Uri;
import android.os.Build;
import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.webkit.WebChromeClient;
import android.webkit.WebView;
import android.webkit.WebViewClient;
import android.widget.ProgressBar;
import android.widget.TextView;


public class Frag_Profil extends Fragment {

    WebView wb;
    ProgressBar pg;

    @TargetApi(Build.VERSION_CODES.JELLY_BEAN)
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
                             Bundle savedInstanceState) {
        View v = inflater.inflate(R.layout.frag_web, null);
        wb = (WebView)v.findViewById(R.id.webView);
        pg = (ProgressBar)v.findViewById(R.id.progressBar);
        wb.getSettings().setJavaScriptEnabled(true);
        wb.setWebViewClient(new WebViewClient());

        wb.getSettings().setDomStorageEnabled(true);
        wb.getSettings().setLoadWithOverviewMode(true);
        wb.getSettings().setUseWideViewPort(true);
        wb.getSettings().setSupportMultipleWindows(true);
        wb.getSettings().setJavaScriptCanOpenWindowsAutomatically(true);
        wb.setHorizontalScrollBarEnabled(false);
        wb.setScrollBarStyle(WebView.SCROLLBARS_OUTSIDE_OVERLAY);
        wb.getSettings().setAllowFileAccessFromFileURLs(true);
        wb.getSettings().setAllowUniversalAccessFromFileURLs(true);

        wb.setWebChromeClient(new WebChromeClient() {
            @Override
            public void onProgressChanged(WebView view, int newProgress) {
                pg.setVisibility(View.VISIBLE);
                pg.setProgress(newProgress);
                if (newProgress == 100) {
                    pg.setVisibility(View.GONE);
                }
            }
        });

        pg.setVisibility(View.VISIBLE);
        wb.loadUrl("https://plus.google.com/u/0/+AjiSetya");
        return v;
    }

    @Override
    public void onPause() {
        wb.onPause();
        super.onPause();
    }
}

Frag_Kontak.java


package com.blogsetyaaji.smafuturegate;

import android.annotation.TargetApi;
import android.content.Context;
import android.net.Uri;
import android.os.Build;
import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.webkit.WebChromeClient;
import android.webkit.WebView;
import android.webkit.WebViewClient;
import android.widget.ProgressBar;
import android.widget.TextView;

public class Frag_Kontak extends Fragment {

    WebView wb;
    ProgressBar pg;

    @TargetApi(Build.VERSION_CODES.JELLY_BEAN)
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
                             Bundle savedInstanceState) {
        View v = inflater.inflate(R.layout.frag_web, null);
        wb = (WebView)v.findViewById(R.id.webView);
        pg = (ProgressBar)v.findViewById(R.id.progressBar);
        wb.getSettings().setJavaScriptEnabled(true);
        wb.setWebViewClient(new WebViewClient());

        wb.getSettings().setDomStorageEnabled(true);
        wb.getSettings().setLoadWithOverviewMode(true);
        wb.getSettings().setUseWideViewPort(true);
        wb.getSettings().setSupportMultipleWindows(true);
        wb.getSettings().setJavaScriptCanOpenWindowsAutomatically(true);
        wb.setHorizontalScrollBarEnabled(false);
        wb.setScrollBarStyle(WebView.SCROLLBARS_OUTSIDE_OVERLAY);
        wb.getSettings().setAllowFileAccessFromFileURLs(true);
        wb.getSettings().setAllowUniversalAccessFromFileURLs(true);

        wb.setWebChromeClient(new WebChromeClient() {
            @Override
            public void onProgressChanged(WebView view, int newProgress) {
                pg.setVisibility(View.VISIBLE);
                pg.setProgress(newProgress);
                if (newProgress == 100) {
                    pg.setVisibility(View.GONE);
                }
            }
        });

        pg.setVisibility(View.VISIBLE);
        wb.loadUrl("https://plus.google.com/u/0/+AjiSetya");
        return v;
    }

    @Override
    public void onPause() {
        wb.onPause();
        super.onPause();
    }
}

Frag_Facebook.java


package com.blogsetyaaji.smafuturegate;

import android.annotation.TargetApi;
import android.content.Context;
import android.net.Uri;
import android.os.Build;
import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.webkit.WebChromeClient;
import android.webkit.WebView;
import android.webkit.WebViewClient;
import android.widget.ProgressBar;
import android.widget.TextView;

public class Frag_Facebook extends Fragment {

    WebView wb;
    ProgressBar pg;

    @TargetApi(Build.VERSION_CODES.JELLY_BEAN)
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
                             Bundle savedInstanceState) {
        View v = inflater.inflate(R.layout.frag_web, null);
        wb = (WebView)v.findViewById(R.id.webView);
        pg = (ProgressBar)v.findViewById(R.id.progressBar);
        wb.getSettings().setJavaScriptEnabled(true);
        wb.setWebViewClient(new WebViewClient());

        wb.getSettings().setDomStorageEnabled(true);
        wb.getSettings().setLoadWithOverviewMode(true);
        wb.getSettings().setUseWideViewPort(true);
        wb.getSettings().setSupportMultipleWindows(true);
        wb.getSettings().setJavaScriptCanOpenWindowsAutomatically(true);
        wb.setHorizontalScrollBarEnabled(false);
        wb.setScrollBarStyle(WebView.SCROLLBARS_OUTSIDE_OVERLAY);
        wb.getSettings().setAllowFileAccessFromFileURLs(true);
        wb.getSettings().setAllowUniversalAccessFromFileURLs(true);

        wb.setWebChromeClient(new WebChromeClient() {
            @Override
            public void onProgressChanged(WebView view, int newProgress) {
                pg.setVisibility(View.VISIBLE);
                pg.setProgress(newProgress);
                if (newProgress == 100) {
                    pg.setVisibility(View.GONE);
                }
            }
        });

        pg.setVisibility(View.VISIBLE);
        wb.loadUrl("https://www.facebook.com/BlogSetyaAji/");
        return v;
    }

    @Override
    public void onPause() {
        wb.onPause();
        super.onPause();
    }
}

Frag_Youtube.java


package com.blogsetyaaji.smafuturegate;

import android.annotation.TargetApi;
import android.content.Context;
import android.net.Uri;
import android.os.Build;
import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.webkit.WebChromeClient;
import android.webkit.WebView;
import android.webkit.WebViewClient;
import android.widget.ProgressBar;
import android.widget.TextView;


public class Frag_Youtube extends Fragment {

    WebView wb;
    ProgressBar pg;

    @TargetApi(Build.VERSION_CODES.JELLY_BEAN)
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
                             Bundle savedInstanceState) {
        View v = inflater.inflate(R.layout.frag_web, null);
        wb = (WebView)v.findViewById(R.id.webView);
        pg = (ProgressBar)v.findViewById(R.id.progressBar);
        wb.getSettings().setJavaScriptEnabled(true);
        wb.setWebViewClient(new WebViewClient());

        wb.getSettings().setDomStorageEnabled(true);
        wb.getSettings().setLoadWithOverviewMode(true);
        wb.getSettings().setUseWideViewPort(true);
        wb.getSettings().setSupportMultipleWindows(true);
        wb.getSettings().setJavaScriptCanOpenWindowsAutomatically(true);
        wb.setHorizontalScrollBarEnabled(false);
        wb.setScrollBarStyle(WebView.SCROLLBARS_OUTSIDE_OVERLAY);
        wb.getSettings().setAllowFileAccessFromFileURLs(true);
        wb.getSettings().setAllowUniversalAccessFromFileURLs(true);

        wb.setWebChromeClient(new WebChromeClient() {
            @Override
            public void onProgressChanged(WebView view, int newProgress) {
                pg.setVisibility(View.VISIBLE);
                pg.setProgress(newProgress);
                if (newProgress == 100) {
                    pg.setVisibility(View.GONE);
                }
            }
        });

        pg.setVisibility(View.VISIBLE);
        wb.loadUrl("https://www.youtube.com/channel/UCVmlZdBiB6fx4i7PtFhwwsg");
        return v;
    }

    @Override
    public void onPause() {
        wb.onPause();
        super.onPause();
    }
}

MainActivity.java


package com.blogsetyaaji.smafuturegate;

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;

public class MainActivity extends AppCompatActivity
        implements NavigationView.OnNavigationItemSelectedListener {

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

        /*FloatingActionButton fab = (FloatingActionButton) findViewById(R.id.fab);
        fab.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                Snackbar.make(view, "Replace with your own action", Snackbar.LENGTH_LONG)
                        .setAction("Action", null).show();
            }
        });*/

        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();

        NavigationView navigationView = (NavigationView) findViewById(R.id.nav_view);
        navigationView.setNavigationItemSelectedListener(this);
    }

    @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.home) {
            Frag_web rr = new Frag_web();
            rr.setArguments(getIntent().getExtras());
            getSupportFragmentManager().beginTransaction().add(R.id.container, rr, "Home").commit();
            getSupportFragmentManager().popBackStack();
        } else if (id == R.id.profil) {
            Frag_Profil rr = new Frag_Profil();
            rr.setArguments(getIntent().getExtras());
            getSupportFragmentManager().beginTransaction().add(R.id.container, rr, "Profil").commit();
            getSupportFragmentManager().popBackStack();

        } else if (id == R.id.youtube) {
            Frag_Youtube rr = new Frag_Youtube();
            rr.setArguments(getIntent().getExtras());
            getSupportFragmentManager().beginTransaction().add(R.id.container, rr, "Youtube").commit();
            getSupportFragmentManager().popBackStack();

        } else if (id == R.id.fb) {
            Frag_Facebook rr = new Frag_Facebook();
            rr.setArguments(getIntent().getExtras());
            getSupportFragmentManager().beginTransaction().add(R.id.container, rr, "Facebook").commit();
            getSupportFragmentManager().popBackStack();

        } else if (id == R.id.kontak) {
            Frag_Kontak rr = new Frag_Kontak();
            rr.setArguments(getIntent().getExtras());
            getSupportFragmentManager().beginTransaction().add(R.id.container, rr, "Kontak").commit();
            getSupportFragmentManager().popBackStack();

        } else if (id == R.id.tentang) {
            Frag_Tentang rr = new Frag_Tentang();
            rr.setArguments(getIntent().getExtras());
            getSupportFragmentManager().beginTransaction().add(R.id.container, rr, "Tentang").commit();
            getSupportFragmentManager().popBackStack();

        }

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


Sekarang beralih ke AndroidManifest, tambahkan user permission ke dalam Manifest dengan kode seperti di bawah ini


<uses-permission android:name="android.permission.INTERNET"/>
    <uses-permission android:name="android.permission.ACCESS_WIFI_STATE"/>
    <uses-permission android:name="android.permission.CHANGE_WIFI_STATE"/>


Kode di atas adalah kode java fragent dan layout yang ditampilkan oleh fragment. Jika sobat ingin membuat fragment baru, sobat bisa klik kanan pada folder java -> new -> fragment -> blank fragment.

Jika sudah semuanya, silahkan sobat jalankan aplikasinya, dan tampilannya akan seperti berikut ini

Membuat Aplikasi Android Sederhana dengan Material Design

Membuat Aplikasi Android Sederhana dengan Material Design

Membuat Aplikasi Android Sederhana dengan Material Design

Dalam aplikasi yang telah kita buat, pada intinya adalah kita membuat menu terlebih dahulu dan memasukkannya ke dalam aplikasi. Dan menu yang ditampilkan merupakan kategori atau fitur yang ada pada aplikasi.

Dan sekian artikel tentang Membuat Aplikasi Android Sederhana dengan Material Design semoga bermanfaat, Silahkan jika sobat memiliki pertanyaan, kritik, atau pun saran. silahkan berkomentar di bawah.. Share artikel ini jika sobat mneyukainya.. sampai jumpa



loading...

Post a Comment

Tidak ada komentar

Langganan: Posting Komentar ( Atom )
Diberdayakan oleh Blogger.