Disini kita akan membuat menu samping Android menggunakan Eclipse Juno.
Yang tampilannya seperti ini:
list menu yang ditampilkan
Jika menu Profile dipilih
Jika menu Email dipilih, maka muncul pop up list aplikasi email yang akan kita pakai untuk compose email
Begitu juga seterusnya jika menu lain yang dipilih.
Jadi setiap menu yang kita pilih akan ditampilkan sesuai dengan fragment buatan kita sendiri, kalau pada web istilahnya seperti frame
1.Create new android application dengan nama MenuDrawable
disini saya menggunakan Target SDK dan Compile With : API 19
dan pada pilihan Create Activity pilih
Navigation Drawer Activity
2. Pada res/values/strings.xml edit code seperti ini
3. Edit NavigationDrawerFragment.java pada function onCreateView
4.Edit MainActivity.java pada function onNavigationDrawerItemSelected
*Catatan: Script "getActionBar().setTitle(R.string.****)" (line 8,13,17,21) terkadang menyebabkan error jika anda pada pertama kali create new android application dengan setting Compile With diatas API 19 , Jadi lebih baik tidak usah digunakan/diremarks jika terjadi error, fungsi ini untuk menampilkan judul diatas fragment/halaman
5. pada MainActivity.java ubah code ini
menjadi Seperti ini agar tidak error
6. Selanjutnya kita buat desain tampilan home dengan membuat file fragment_home.xml di dalam folder layout (disini saya hanya menampilkan textview tulisan Home saja, selanjutnya silahkan kreasikan sesuka anda )
7. Buat juga fragment_profile.xml di folder layout untuk desain tampilan profile
Untuk menu Email tidak diperlukan tampilan karena kita akan panggil fungsi compose email yang sudah tersedia dari android, begitu juga dengan menu Share. Selanjutnya kita tinggal membuat Class Java nya untuk memanggil fragment/layout dari menu tersebut
8.Buat Class Java di folder setara MainActivity.java
Class Home.java
Class Profile.java
Class Email.java
Class Share.java
Jangan lupa beri Permission internet karena kita harus akses internet dalam aplikasi ini dan minSdkVersion ke 11, agar menu berfungsi di file AndroidManifest.xml
9. AndroidManifest.xml
Pada dasarnya Untuk Menu lainnya dapat dikembangkan dari contoh diatas, untuk source code menu lainnya nanti akan saya lanjutkan di part 2.
Untuk SourceCode dapat diunduh disini
Yang tampilannya seperti ini:
list menu yang ditampilkan
Jika menu Email dipilih, maka muncul pop up list aplikasi email yang akan kita pakai untuk compose email
Begitu juga seterusnya jika menu lain yang dipilih.
Jadi setiap menu yang kita pilih akan ditampilkan sesuai dengan fragment buatan kita sendiri, kalau pada web istilahnya seperti frame
1.Create new android application dengan nama MenuDrawable
disini saya menggunakan Target SDK dan Compile With : API 19
dan pada pilihan Create Activity pilih
Navigation Drawer Activity
2. Pada res/values/strings.xml edit code seperti ini
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 | <?xml version="1.0" encoding="utf-8"?> <resources> <string name="app_name">MenuDrawable</string> <string name="menu">Menu</string> <string name="home">Home</string> <string name="profile">Profile</string> <string name="profile_content">Hendro Pardiyanto</string> <string name="email">Email</string> <string name="share">Share</string> <string name="facebook">Facebook</string> <string name="website">Website</string> <string name="telp">Telp</string> <string name="navigation_drawer_open">Open navigation drawer</string> <string name="navigation_drawer_close">Close navigation drawer</string> <string name="action_example">Example action</string> <string name="action_settings">Settings</string> <string-array name="nav_drawer_item"> <item >Home</item> <item >Email</item> <item >Share</item> <item >Facebook</item> <item >Website</item> <item >Telp</item> </string-array> </resources> |
3. Edit NavigationDrawerFragment.java pada function onCreateView
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 | @Override public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) { mDrawerListView = (ListView) inflater.inflate( R.layout.fragment_navigation_drawer, container, false); mDrawerListView.setOnItemClickListener(new AdapterView.OnItemClickListener() { @Override public void onItemClick(AdapterView<?> parent, View view, int position, long id) { selectItem(position); } }); mDrawerListView.setAdapter(new ArrayAdapter<String>( getActionBar().getThemedContext(), android.R.layout.simple_list_item_1, android.R.id.text1, new String[]{ getString(R.string.home), getString(R.string.profile), getString(R.string.email), getString(R.string.share), getString(R.string.facebook), getString(R.string.website), getString(R.string.telp) })); mDrawerListView.setItemChecked(mCurrentSelectedPosition, true); return mDrawerListView; } |
4.Edit MainActivity.java pada function onNavigationDrawerItemSelected
*Catatan: Script "getActionBar().setTitle(R.string.****)" (line 8,13,17,21) terkadang menyebabkan error jika anda pada pertama kali create new android application dengan setting Compile With diatas API 19 , Jadi lebih baik tidak usah digunakan/diremarks jika terjadi error, fungsi ini untuk menampilkan judul diatas fragment/halaman
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 | @Override public void onNavigationDrawerItemSelected(int position) { // update the main content by replacing fragments Fragment fragment = null; switch (position) { case 0: fragment = new Home(); getActionBar().setTitle(R.string.home); break; case 1: fragment = new Profile(); getActionBar().setTitle(R.string.profile); break; case 2: fragment = new Email(); getActionBar().setTitle(R.string.email); break; case 3: fragment = new Share(); getActionBar().setTitle(R.string.share); break; } FragmentManager fragmentManager = getFragmentManager();// PENTING fragmentManager.beginTransaction().replace(R.id.container,fragment).commit(); //PENTING } |
5. pada MainActivity.java ubah code ini
1 2 | import android.support.v4.app.Fragment; //PENTING import android.supprot.v4.app.FragmentManager; //PENTING |
1 2 | import android.app.Fragment; //PENTING import android.app.FragmentManager; //PENTING |
6. Selanjutnya kita buat desain tampilan home dengan membuat file fragment_home.xml di dalam folder layout (disini saya hanya menampilkan textview tulisan Home saja, selanjutnya silahkan kreasikan sesuka anda )
1 2 3 4 5 6 7 8 9 10 11 12 13 14 | <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:layout_margin="16dp" android:orientation="vertical" > <TextView android:id="@+id/tv_home" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/home" /> </LinearLayout> |
7. Buat juga fragment_profile.xml di folder layout untuk desain tampilan profile
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 | <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:layout_margin="16dp" android:orientation="vertical" > <TextView android:id="@+id/tv_profile" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/profile" /> <TextView android:id="@+id/tv_profile_content" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/profile_content" /> </LinearLayout> |
8.Buat Class Java di folder setara MainActivity.java
Class Home.java
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 | package com.menudrawable; import android.os.Bundle; import android.app.Fragment; import android.view.LayoutInflater; import android.view.View; import android.view.ViewGroup; public class Home extends Fragment { View view; @Override public View onCreateView(LayoutInflater inflater, ViewGroup container,Bundle savedInstanceState) { view = inflater.inflate(R.layout.fragment_home, container, false); return view; } } |
Class Profile.java
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 | package com.menudrawable; import android.os.Bundle; import android.app.Fragment; import android.view.LayoutInflater; import android.view.View; import android.view.ViewGroup; public class Profile extends Fragment{ View view; @Override public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) { view = inflater.inflate(R.layout.fragment_profile, container, false); return view; } } |
Class Email.java
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 | package com.menudrawable; import android.app.Fragment; import android.content.Intent; import android.os.Bundle; public class Email extends Fragment{ Intent intent; @Override public void onCreate(Bundle savedInstanceState){ intent=new Intent(Intent.ACTION_SEND); intent.putExtra(Intent.EXTRA_EMAIL, "hendro05@gmail.com"); intent.putExtra(Intent.EXTRA_SUBJECT, "Mengirim Email Dari Android"); intent.putExtra(Intent.EXTRA_TEXT, "Cara Mengirim Email Menggunakan Intent Di Pemrograman Danroid Dengan Java"); intent.setType("message/rfc822"); startActivity(intent.createChooser(intent, "Pilih Aplikasi Mengirim Email")); super.onCreate(savedInstanceState); } } |
Class Share.java
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 | package com.menudrawable; import android.app.Fragment; import android.content.Intent; import android.os.Bundle; public class Share extends Fragment { Intent intent; @Override public void onCreate(Bundle savedInstanceState) { intent=new Intent(android.content.Intent.ACTION_SEND); intent.setType("text/plain"); intent.putExtra(android.content.Intent.EXTRA_SUBJECT, "Aplikasi Menu Drawer \n\n"); intent.putExtra(android.content.Intent.EXTRA_TEXT, "Pada aplikasi ini diterangkan bagaimana cara membuat menu drawable"); startActivity(intent.createChooser(intent, "Sebarkan Aplikasi Ini Dengan : ")); super.onCreate(savedInstanceState); } } |
Jangan lupa beri Permission internet karena kita harus akses internet dalam aplikasi ini dan minSdkVersion ke 11, agar menu berfungsi di file AndroidManifest.xml
9. AndroidManifest.xml
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 | <?xml version="1.0" encoding="utf-8"?> <manifest xmlns:android="http://schemas.android.com/apk/res/android" package="com.menudrawable" android:versionCode="1" android:versionName="1.0" > <uses-sdk android:minSdkVersion="11" android:targetSdkVersion="19" /> <uses-permission android:name="android.permission.INTERNET"/> <application android:allowBackup="true" android:icon="@drawable/ic_launcher" android:label="@string/app_name" android:theme="@style/AppTheme" > <activity android:name=".MainActivity" android:label="@string/app_name" > <intent-filter> <action android:name="android.intent.action.MAIN" /> <category android:name="android.intent.category.LAUNCHER" /> </intent-filter> </activity> </application> </manifest> |
Pada dasarnya Untuk Menu lainnya dapat dikembangkan dari contoh diatas, untuk source code menu lainnya nanti akan saya lanjutkan di part 2.
Untuk SourceCode dapat diunduh disini
No comments:
Post a Comment