Android ProgramlamaGenel

Android Tab Menü Oluşturma

Uzun zamandır android dersi girmediğimi farkettim bu nedenle bugün android derslerine yeni bir konuyla devam edeceğim. Önceki konularda android option menü oluşturmadan bahsetmiştim. Şimdi de birçok uygulamada kullanılan tab sekmelerinin nasıl oluşturulacağını anlatacağım.

Tab sekmelerini oluştururken Tabhost‘tan yararlanılır. Daha iyi anlaşılması için yeni bir proje yapalım. Başka kodları karıştırmayalım.

Yeni proje oluşturduktan sonra Palette kısmından Composite içerisine girin ve projenize panelden tabhost‘u tutup sürükleyin.

İlk olarak bir proje oluşturalım ve gelen sayfamızın xml dosyasına şu kodları yazalım.

activity_main.xml dosyasının içeriği ve görüntüsünün şu şekilde gelmesi lazım.

tabhost kullanımı

<LinearLayout 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"
android:baselineAligned="false">
<TabHost
android:id="@android:id/tabhost"
android:layout_width="0dip"
android:layout_height="match_parent"
android:layout_weight="1" >
<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="vertical">
</LinearLayout>
<LinearLayout
android:id="@+id/tab2"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
</LinearLayout>
<LinearLayout
android:id="@+id/tab3"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
</LinearLayout>
</FrameLayout>
</LinearLayout>
</TabHost>
</LinearLayout>

Bu kısımdan sonra Tab1, Tab2 ve Tab3 adında 3 adet yeni class ekleyelim. Ardından unutmadan hemen class’ları android manifest dosyamıza tanıtıyoruz.

<activity android:name=".Tab1"></activity>
<activity android:name=".Tab2"></activity>
<activity android:name=".Tab3"></activity>

Oluşturulan her class için de layout eklemek gerekiyor. Sırasıyla res -> layout klasörüne tab1, tab2 ve tab3 adında xml dosyaları oluşturuyoruz ve içerilerine birer buton atıyoruz.

Şimdi tekrar tabhost eklediğimiz ana class’ımız MainActivity.java  dosyasına girip aşağıdaki kodları yazıyoruz.

tabmenü yapımı

package com.Example.tabmenu;
import android.os.Bundle;
import android.widget.TabHost;
import android.widget.TabHost.TabSpec;
import android.app.Activity;
import android.app.TabActivity;
import android.content.Intent;
public class MainActivity extends TabActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
TabHost tabh = (TabHost)findViewById(android.R.id.tabhost);
TabSpec tab1 = tabh.newTabSpec("tab menü 1. seçenek");
TabSpec tab2 = tabh.newTabSpec("tab menü 2. seçenek");
TabSpec tab3 = tabh.newTabSpec("tab menü 3. seçenek");
tab1.setIndicator("1.sekme");
tab1.setContent(new Intent(this,Tab1.class));
tab2.setIndicator("2.sekme");
tab2.setContent(new Intent(this,Tab2.class));
tab3.setIndicator("3.sekme");
tab3.setContent(new Intent(this,Tab3.class));
tabh.addTab(tab1); tabh.addTab(tab2); tabh.addTab(tab3);
}
}

Yukarıdaki MainActivity kodlarını yavaştan anlatayım.

  • Öncelikle TabActivity ‘ den extends etmemiz gerekiyor.
  • Tabhost nesnesi oluşturup xml dosyasındaki id le bağlıyoruz.
  • TabSpec oluşturup tablarımıza isim veriyoruz.
  • SetIndicator ile görünecek kısımları ve Intent’lerimizi oluşturuyoruz. Intentler ile hangi tab tıklanırsa onun ilgili olduğu xml dosyasını yazıp, bağlıyoruz.
  • Son olarak da tab’ları, tabhost’a ekliyoruz ve uygulamamız artık hazır hale geliyor.

Ekran görüntülerini de ekleyelim.

tab menü ekran görüntüsü tabmenü ekran görüntüsü1

Evet arkadaşlar, kodlarımız bu kadar. Bu makaleyi hazırlamak gerçekten zamanımı aldı. Umarım faydalı olmuştur. Yorumlarınızı esirgemezseniz sevinirim. Bol kodlu günler.