Tuesday, October 13, 2015

Tutorial Menu Drawable (Menu Samping) Android Part 2

Postingan kali ini adalah lanjutan dari menu drawable Part 1 tentang fungsi-fungsi menu samping yang sebelumnya telah kita buat tampilan untuk:
  • Home
  • Profile
  • Email
  • Share
















Kali ini saya akan tambahkan fungsi panggil menu selanjutnya yaitu :
  • Facebook
  • Website
  • Telp
Dimana menu Facebook dan Website berfungsi jika kita memilih salah satu menu tersebut akan membuka halaman webpage sesuai dengan alamat yang kita tujukan di coding, sedangkan menu Telp akan melakukan panggilan telephone sesuai nomor yang kita tentukan

1. Tambahkan Permission CALL_PHONE di  AndroidManifest.xml untuk melakukan panggilan telepon
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
<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"/>
    <uses-permission android:name="android.permission.CALL_PHONE"/>

    <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>

2. Lalu tambahkan/lanjutkan script pada fungsi onNavigationDrawerItemSelected pada file 
MainActivity.java


 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
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
 @Override
 public void onNavigationDrawerItemSelected(int position) {
  // update the main content by replacing fragments
  Fragment fragment = null;
  Intent intent;
  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; 
  ////////////////////part 2////////////// 
  case 4:
   intent=new Intent(Intent.ACTION_VIEW);
   intent.setData(Uri.parse("https://m.facebook.com/hendro.pardiyanto"));
   startActivity(intent);
   break; 

  case 5:
   intent=new Intent(Intent.ACTION_VIEW);
   intent.setData(Uri.parse("http://hendrolib.blogspot.co.id"));
   startActivity(intent);
   break; 
   
  case 6:
   intent=new Intent(Intent.ACTION_CALL);
   intent.setData(Uri.parse("tel:0815915xxxx")); // isi nomor telepon yang valid
   startActivity(intent);
   break; 
 

  }
  FragmentManager fragmentManager = getFragmentManager();// PENTING
  fragmentManager.beginTransaction().replace(R.id.container,fragment).commit(); //PENTING
 }


Disni saya hanya menggunakan Intent untuk menjalankan fungsi tersebut,jadi tidak diperlukan membuat class java dan fragment/layout xml untuk tampilannya.
Selanjutnya silakan kreasikan. Selamat mencoba, semoga berguna.

Wednesday, October 7, 2015

Menu Drawable (Menu Samping) Android Part 1

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

 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
menjadi Seperti ini agar tidak error
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>

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

 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 

My First Post

Hello world


1
2
3
4
5
<?php

echo "Hello World!";

?>