Membuat TabHost Pada Aplikasi Android

Assalamualaiqum ☺

Di hari yang cerah ini saya akan kembali memposting tentang android. Kali ini saya akan membagikan tentang cara membuat TabHost pada aplikasi android.

Ok langsung saja.

1. Buat project baru dengan nama TabHost.
2. Isikan source code file activity_main.xml

<RelativeLayout xmlns:android=”http://schemas.android.com/apk/res/android”

  xmlns:tools=”http://schemas.android.com/tools”

  android:layout_width=”match_parent”

  android:layout_height=”match_parent”

  android:paddingBottom=”@dimen/activity_vertical_margin”  

  android:paddingLeft=”@dimen/activity_horizontal_margin”

  android:paddingRight=”@dimen/activity_horizontal_margin”

  android:paddingTop=”@dimen/activity_vertical_margin”

  tools:context=”.MainActivity” >   <TabHost

      android:id=”@android:id/tabhost”

      android:layout_width=”match_parent”

      android:layout_height=”match_parent” >

   <LinearLayout

      android:layout_width=”match_parent”

      android:layout_height=”match_parent”

      android:orientation=”vertical” >

     <TabWidget

         android:id=”@android:id/tabs”

         android:layout_width=”match_parent”

         android:layout_height=”wrap_content” >

      </TabWidget>

      <FrameLayout

         android:id=”@android:id/tabcontent”

         android:layout_width=”match_parent”

         android:layout_height=”match_parent” >

         <LinearLayout

            android:id=”@+id/tab1″

            android:layout_width=”match_parent”

            android:layout_height=”match_parent”

            android:orientation=”horizontal” >

        </LinearLayout>

        <LinearLayout

            android:id=”@+id/tab2″

            android:layout_width=”match_parent”

            android:layout_height=”match_parent”

         android:orientation=”horizontal” >

     </LinearLayout></FrameLayout>

  </LinearLayout></TabHost></RelativeLayout>

Hasilnya:

3. Buatlah dua buat file xml baru dengan nama activity_home.xml dan activity_about.xml.
4. Source code  activity_home.xml.

<?xml version=”1.0″ encoding=”utf-8″?>

<RelativeLayout xmlns:android=”http://schemas.android.com/apk/res/android”

  android:layout_width=”match_parent”

  android:layout_height=”match_parent”

  android:orientation=”vertical” >

  <TextView

     android:id=”@+id/textView1″

     android:layout_width=”wrap_content”

     android:layout_height=”wrap_content”

     android:layout_alignParentTop=”true”

     android:layout_centerHorizontal=”true”

     android:layout_marginTop=”143dp”

     android:text=”@string/hal1″

     android:textSize=”20sp” />

</RelativeLayout>

Hasilnya:

5. File activity_about.xml

<?xml version=”1.0″ encoding=”utf-8″?>

<RelativeLayout xmlns:android=”http://schemas.android.com/apk/res/android”

  android:layout_width=”match_parent”

  android:layout_height=”match_parent”

  android:orientation=”vertical” >

  <TextView

     android:id=”@+id/textView1″

     android:layout_width=”wrap_content”

     android:layout_height=”wrap_content”

     android:layout_alignParentTop=”true”

     android:layout_centerHorizontal=”true”

     android:layout_marginTop=”171dp”

     android:text=”@string/hal2″

     android:textSize=”20sp” />

</RelativeLayout>

Hasilnya:

6. Selanjutnya, bukalah file MainActivity.java. Salinlah source code dibawah ini, dan sesuaikan dengan project yang anda buat.

package com.putri.tabhost;

import android.os.Bundle;

import android.app.TabActivity;

import android.content.Intent;

import android.view.Menu;

import android.widget.TabHost;

@SuppressWarnings("deprecation")

public class MainActivity extends TabActivity {

  @Override

  protected void onCreate(Bundle savedInstanceState) {

     super.onCreate(savedInstanceState);

     setContentView(R.layout.activity_main);

     TabHost tabhost = getTabHost();

     TabHost.TabSpec spec;

     Intent intent;

     intent = new Intent().setClass(this, Home.class);//content pada tab yang akan kita buat

     spec = tabhost.newTabSpec("home").setIndicator("Home",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, About.class);

     spec = tabhost.newTabSpec("about").setIndicator("About",null).setContent(intent);

     tabhost.addTab(spec);

  }

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

   }

}

7. Buatlah dua buah java class baru dengan nama Home.java dan About.java.
8. Berikut source code file Home.java.

package com.irmarismay.tabhost;

import android.app.Activity;

import android.os.Bundle;

import android.widget.TextView;

public class Home extends Activity {

  TextView textView1;

  protected void onCreate(Bundle savedInstanceState) {

     super.onCreate(savedInstanceState);

     setContentView(R.layout.activity_home);

     textView1 = (TextView)findViewById(R.id.textView1);

  }

}

9. Source code file About.java

package com.irmarismay.tabhost;

import android.app.Activity;

import android.os.Bundle;

import android.widget.TextView;

public class About extends Activity {

  TextView textView1;

  protected void onCreate(Bundle savedInstanceState) {

     super.onCreate(savedInstanceState);

     setContentView(R.layout.activity_about);

    

     textView1 = (TextView)findViewById(R.id.textView1);

  }

}

10. Setelah selesai menyelesaikan program diatas, bukalah file AndroidManifest.xml, salinlah dan sesuaikan source code dibawah ini dengan project yang anda buat.

<?xml version=”1.0″ encoding=”utf-8″?>

<manifest xmlns:android=”http://schemas.android.com/apk/res/android”

  package=”com.irmarismay.tabhost”

  android:versionCode=”1″

  android:versionName=”1.0″ >

  <uses-sdk

     android:minSdkVersion=”8″

     android:targetSdkVersion=”17″ />

  <application

     android:allowBackup=”true”

     android:icon=”@drawable/ic_launcher”

     android:label=”@string/app_name”

     android:theme=”@style/AppTheme” >

     <activity

        android:name=”com.irmarismay.tabhost.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>

      <activity

         android:name=”com.irmarismay.tabhost.Home”

         android:label=”@string/app_name”>

      </activity>

      <activity

         android:name=”com.irmarismay.tabhost.About”

         android:label=”@string/app_name”>

      </activity>

  </application>

</manifest>

11. Jalankan di emulator atau smartphone anda.

Selesai..