#9 – Android Layouts: Table Layout


Bu yazımda android layoutlarından Table Layout anlatılmıştır.

Android te layoutları(taslakları) basit xml dosyaları ile oluştururuz. Ayrıca JAVA kodu kullanarak ta layout oluşturabiliriz. Bütün layoutlar /res/layout dosyasında olmalıdır.

kodu_indir

layout

Bu ön bilgiden sonra Table Layout u anlatmaya başlayabiliriz.

Table Layout

Android teki table layoutlar html deki table layoutlar gibi çalışır. Arayüzü istediğiniz sayıda satıra ve sütuna bölebilirsiniz. Aşağıdaki resimi inceleyiniz.

table_layout

Örnek bir Table layout oluşturmak için gerekli adımlar:

a. Eclipse te sırasıyla File -> New -> Android Application Project e tıklayın.

b. Gerekli yerleri doldurup projenizi oluşturun.

c. Package Explorer da layout klasörüne sağ tıklayıp: New -> Android XML File seçin. Yeni layouta isim verin, ben tablelayout dedim. Daha sonra Finish e basarak oluşturun.

d. Layout klasörü altındaki yeni oluşturduğunuz layoutu iki kere tıklayarak açın. Ve aşağıdaki kodları girin.

<TableLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:shrinkColumns="*"  android:stretchColumns="*" android:background="#ffffff">
    <!-- İki sütunlu birinci satır  -->
   <TableRow
        android:id="@+id/satir1"
        android:layout_height="wrap_content"
        android:layout_width="match_parent"> 
        <TextView
            android:id="@+id/TextView04" android:text="satir1 sütun1"
            android:layout_weight="1" android:background="#0470d9"
            android:textColor="#ffffff"
            android:padding="20dip" android:gravity="center"/> 
        <TextView
            android:id="@+id/TextView04" android:text="Satir 1 sütun 2 "
            android:layout_weight="1" android:background="#d3d3d3"
            android:textColor="#000000"
            android:padding="20dip" android:gravity="center"/>

    </TableRow>

    <!-- Row 2 with 3 columns -->
    <TableRow
        android:id="@+id/satir2"
        android:layout_height="wrap_content"
        android:layout_width="match_parent"> 
        <TextView
            android:id="@+id/TextView04" android:text="satir2 sütun1"
            android:layout_weight="1" android:background="#0470d9"
            android:textColor="#ffffff"
            android:padding="20dip" android:gravity="center"/> 
        <TextView
            android:id="@+id/TextView04" android:text="Satir 2 sütun 2 "
            android:layout_weight="1" android:background="#d3d3d3"
            android:textColor="#000000"
            android:padding="20dip" android:gravity="center"/>
        <TextView
            android:id="@+id/TextView04" android:text="Satir 2 sütun 3"
            android:layout_weight="1" android:background="#cac9c9"
            android:textColor="#000000"
            android:padding="20dip" android:gravity="center"/>
    </TableRow>

    <!-- tek sütunlu satir -->
    <TableRow
        android:layout_height="wrap_content"
        android:layout_width="fill_parent"
        android:gravity="center_horizontal"> 
        <TextView
            android:id="@+id/TextView04" android:text="satir 3 sütun 1"
            android:layout_weight="1" android:background="#000000"
            android:textColor="#ffffff"
            android:padding="20dip" android:gravity="center"/>

    </TableRow> 

</TableLayout>

e. Yeni oluşturduğumuz bu layout u uygulamamızın arayüzü olarak ayarlamak istersek yapmamız gereken şey şu: src klasörü altındaki projenizin paket ismine iki kere tıklayın burada otomatik üretilmiş bir projenizin_ismi.java dosyası göreceksiniz, iki kere tıklayarak açın.

Burada onCreate metodu altında şu kodu göreceksiniz: setContentView(R.layout.main); bu kodun anlamı şudur: uygulamanın arayüzünü layout klasörü içindeki main.xml dosyasından oluştur.

Bizim istediğimiz ise yeni oluşturduğumuz xml dosyasını arayüz olarak kullanması.O yüzden kodu şu şekilde değiştiriyoruz: setContentView(R.layout.oluşturduğunuz_xml_dosyası); mesela ben tablelayout.xml diye oluşturduğum için benim durumumda şöyle olacak: setContentView(R.layout.tablelayout);

Tablelayout Emulatör çıktısı:

android table layout

Bu yazımda Tablelayout u detaylıca ve örneklerle anlattım.

Bir önceki Android Layouts: Relative Layout; Uygulamalı Örnek ve Kodlar isimli yazımda Relative Layout detaylı bir şekilde anlatılmıştır.

Android Evreni‘ni takip etmeye devam edin!

Kolay gelsin. :)

Şunlar da ilginizi çekebilir

5 yorum

Mustafa Demir için bir cevap yazın Cevabı iptal et