Membuat tab menu di aplikasi android

Transkripsi

1

2 Membuat tab menu di aplikasi android Oleh: Jefri Rendra Wiratmaja Salam jagocoding. Dikesempatan kali ini saya akan menjelaskan bagaimana membuat menu tab di aplikasi android. Menu tab seringkali digunakan untuk menampilkan menu pada aplikasi. Banyak aplikasi yang menggunakan menu tab seperti media player bawaan android. Ternyata membuat menu tab ini tidak terlalu... Salam jagocoding. Dikesempatan kali ini saya akan menjelaskan bagaimana membuat menu tab di aplikasi android. Menu tab seringkali digunakan untuk menampilkan menu pada aplikasi. Banyak aplikasi yang menggunakan menu tab seperti media player bawaan android. Ternyata membuat menu tab ini tidak terlalu sulit. Lansung saja kita. Buat project baru dengan nama MenuTab Kemudian buka folder res => layout => activity_main.xml. Disini ada 3 komponen yaitu TabHost,TabWidget dan FrameLayout. TabWidget digunakan untuk menampilkan menu - menu tab yang kita buat. Dan FrameLayout digunakan untuk menampilkan isi dari menu tab. Berikut kode lengkapnya. <TabHost xmlns:android=" android:id="@android:id/tabhost" > <LinearLayout android:orientation="vertical" > <TabWidget android:id="@android:id/tabs" android:layout_height="wrap_content" android:layout_gravity="bottom" /> <FrameLayout android:id="@android:id/tabcontent" android:layout_gravity="bottom" /> </LinearLayout> </TabHost> Selanjutnya masuk ke folder src -> MainActivity.java untuk membuat menu - menu tab. MainActivity dibawah memakai extends TabActivity yang dimana artinya class yang terdapat di TabActivity bisa diturunkan ke MainActivity.

3 package com.example.menutab; import android.app.tabactivity; import android.content.intent; import public class MainActivity extends TabActivity { public void oncreate(bundle savedinstancestate) { setcontentview(r.layout.activity_main); TabHost tabhost = gettabhost(); TabHost.TabSpec spec; Intent intent; intent = new Intent().setClass(this, BerandaActivity.class);//content pada tab yang akan kita buat spec = tabhost.newtabspec("beranda").setindicator("beranda",null).setcontent(intent);//mengeset nama tab dan mengisi content pada menu tab anda. tabhost.addtab(spec);//untuk membuat tabbaru disini bisa diatur sesuai keinginan anda intent = new Intent().setClass(this, BeritaActivity.class); spec = tabhost.newtabspec("berita").setindicator("berita",null).setcontent(intent); tabhost.addtab(spec); intent = new Intent().setClass(this, TemanActivity.class); spec = tabhost.newtabspec("teman").setindicator("teman",null).setcontent(intent); tabhost.addtab(spec); Kemudian kita menyiapkan layout untuk ditampilkan di menu tab. Source beranda.xml. Layout ini digunakan untuk menampilkan menu beranda. <?xml version="1.0" encoding="utf-8"?> <DigitalClock xmlns:android=" android:gravity="center_vertical center" android:textsize="50sp" > </DigitalClock> Source berita.xml. Layout ini digunakan untuk menampilkan menu berita. <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android=" android:layout_width="match_parent" android:layout_height="match_parent"

4 android:orientation="vertical" > <ListView /> </LinearLayout> Source teman.xml. Layout ini digunakan untuk menampilkan menu teman. <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android=" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" > <ListView /> </LinearLayout> Selanjutnya membuat class baru untuk memanggil layout" yang sudah kita buat. Source BerandaActivity.java. package com.example.menutab; import android.app.activity; public class BerandaActivity extends Activity public void oncreate(bundle savedinstancestate){ setcontentview(r.layout.beranda); Source BeritaActivity.java package com.example.menutab; import android.app.listactivity; import android.widget.arrayadapter; public class BeritaActivity extends ListActivity { String [] berita ={"Jadwal Piala Dunia 2014", "Capres Indonesia", "Debat Capres", "Debat public void oncreate(bundle savedinstancestate){ setcontentview(r.layout.berita);

5 berita)); setlistadapter(new ArrayAdapter<String>(this, android.r.layout.simple_list_item_1, Source TemanActivity.java package com.example.menutab; import android.app.listactivity; import android.widget.arrayadapter; public class TemanActivity extends ListActivity { String [] teman ={"Andra", "Dina", "Edo", public void oncreate(bundle savedinstancestate){ setcontentview(r.layout.teman); teman)); setlistadapter(new ArrayAdapter<String>(this, android.r.layout.simple_list_item_1, Jangan lupa untuk mendaftarkan activity yang kita buat ke Androidmanifest.xml kodenya seperti berikut. <activity android:name="berandaactivity"></activity> <activity android:name="beritaactivity"></activity> <activity android:name="temanactivity"></activity> Kode lengkapnya dapat dilihat seperti ini. <?xml version="1.0" encoding="utf-8"?> <manifest xmlns:android=" package="com.example.menutab" android:versioncode="1" android:versionname="1.0" > <uses-sdk android:minsdkversion="8" android:targetsdkversion="18" /> <application android:allowbackup="true" android:icon="@drawable/ic_launcher" android:label="@string/app_name" android:theme="@style/apptheme" > <activity android:name="com.example.menutab.mainactivity" android:label="@string/app_name" > <intent-filter> <action android:name="android.intent.action.main" /> <category android:name="android.intent.category.launcher" />

6 </intent-filter> </activity> <activity android:name="berandaactivity"></activity> <activity android:name="beritaactivity"></activity> <activity android:name="temanactivity"></activity> </application> </manifest> Berikut saya sertakan screenshot dari aplikasi diatas Gambar Tab Beranda Gambar Tab Berita

7 Gambar Tab Teman Tentang Penulis Jefri Rendra Wiratmaja Harus bisa banyak berkarya semasih lagi mud :)