Android

Frame Layout Ve Table Layout

Merhaba arkadaşlar bu yazımda Frame Layout ve Table Layout’u anlatacağım.

Önceki yazılarımda Linear layout ve Relative Layoutu kapsamlı bir şekilde örneklerle anlatmıştım bu yazımda Frame Layout ve Table Loyut’u beraber anlatacağım nedeni ise ikisi de kolay anlaşılır olduğu için tek yazıda anlatmak istedim.Öncelikle Frame Layout ile başlamak istiyorum.

FRAME LAYOUT

Bu yerleşim türünde nesneler üst üste biner. Frame Layout kullanırken nesneyi ekrana sürükle bırak yöntemi ile tasarım yaptığımız zaman nesneyi bırakabileceğimiz 9 kısım bulunuyor.

frameLayout

Bu bölgelerden hangilerine nesne yerleştirirseniz o bölgedeki nesneler üst üste gözükürler.

FrameLayout2

Yukarıda ki  örnekten de gördüğünüz gibi ekrana 2 Buton ve 2 tane TextView eklememe rağmen tek 1 tane buton gözüküyor. Bu yerleşim türünün kullanım örneklerinden birini şöyle açıklayayım; Ekranda bir resim görünmesini ve üstüne bir TextView içinde bir yazı göstermek istiyorsanız o zaman Frame Layout kullanmak gerekir. Yukarıda görüntüsünü verdiğim tasarımın kodlarını veriyim aşşağıda.

    FrameLayout
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_centerHorizontal="true"
    android:layout_alignParentTop="true"
    tools:context="com.onedevelopers.devrim.myapplication.MainActivity"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:android="http://schemas.android.com/apk/res/android"


    Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="New Button"
        android:id="@+id/button"
        android:layout_gravity="left|top" //Yukarıda resmini attığım 9 bölmeden hangisine yerleştirilceği seçilmiş.

    Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="New Button"
        android:id="@+id/button4"
        android:layout_gravity="left|top" 

   TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="New Text"
        android:id="@+id/textView"
        android:layout_gravity="left|top" 

   TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textAppearance="?android:attr/textAppearanceMedium"//TextView'in türü verilmiş
        android:text="Medium Text"
        android:id="@+id/textView2"
        android:layout_gravity="left|top"


FrameLayout

TABLE LAYOUT

Bu yerleşim türünde nesneleri bir tabloya yerleştirebilirsiniz. Nesneyi ekrana sürükle bırak ile yerleştireceğimiz zaman tasarımı yaptığımız ekran tablo şeklinde kutulara bölünüyor ve nesneyi bu tablo kutucuklarından birine yerleştiriyoruz. Tasarım ekranının görüntüsüne bakalım daha iyi anlayacaksınız.TableLayout

Gördüğünüz gibi nesneyi ekrana yerleştirirken ekran bu şekilde bölünüyor ve nesneleri bu tablo kutucuklarının içine yerleştiriyoruz.

tableLayout2

Yukarıda ki örnekten de anlayacağınız gibi nesneleri istediğimiz gibi yan yana ve üst üste dizebiliyoruz. Şimdi yukarıdaki örneğin kodlarını vereyim.

TableLayout
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_centerHorizontal="true"
    android:layout_alignParentTop="true"
    tools:context="com.onedevelopers.devrim.myapplication.MainActivity"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:android="http://schemas.android.com/apk/res/android"


    TableRow
        android:layout_width="match_parent"
        android:layout_height="match_parent"

        Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="New Button"
            android:id="@+id/button"
            android:layout_column="0" //Nesnenin ilk sütunda olduğu belirtilmiş.

        Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="New Button"
            android:id="@+id/button2"
            android:layout_column="1" //Nesnenin ikinci sütunda olduğu belirtilmiş.

        Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="New Button"
            android:id="@+id/button3"
            android:layout_column="2" //Nesnenin 3. Sütunda olduğu belirlenmiş.
    TableRow

    TableRow
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="New Button"
            android:id="@+id/button4"
            android:layout_column="0" //Nesnenin ilk sütunda olduğu belirtilmiş.

        Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="New Button"
            android:id="@+id/button6"
            android:layout_column="1" //Nesnenin ikinci sütunda olduğu belirtilmiş.
    TableRow

    TableRow
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="New Button"
            android:id="@+id/button5"
            android:layout_column="0" //Nesnenin ilk sütunda olduğu belirtilmiş.
    TableRow
TableLayout

Yukarıdaki kodlarda daha önce görmediğimiz “TableRow” kodları var peki nedir bu “TableRow”?  Nesneleri yerleştirirken hangi sütunda olduğunu belirlemek için nasılda “android:layout_column” kod parçacığını kullanıyorsak satırı belirlemek içinde “Table Row” kullanıyoruz. Şöyle bir soru sorabilirsiniz “Mesela ben 2 buton yerleştireceğim ilk butonu 1. satıra yerleştireceğim diğer butonu 10. satıra yerleştireceğim o zaman kaçıncı satır olduğunu kodlarda nasıl belirleyeceğiz?” bu sorunun cevabını size şöyle anlatayım ve iyice anlamanızı sağlayayım. Yukarıdaki kodlardan da gördüğünüz gibi nesnenin yerleştirileceği sütunu belirlerken numara veriyoruz ama satır belirlenirken her hangi bir numara verilmiyor.  Nesne yerleştirilirken  başka bir yolla belirleniyor satırı. Yukarıda kodlarını verdiğim örnekte nesneleri ilk 3 satıra yerleştirdiğim için herhangi bir sorun olmadı ancak söylediğim gibi arada boş satır bırakıp nesne yerleştirirsek nasıl ki satırlar boşsa kod tarafında da o şekilde oluyor yani kaç satır atlamışsak o kadar “TableRow” ekliyoruz genişlik ve yükseklik değerlerini veriyoruz ancak içine herhangi bir nesne eklemeden “TableRow” etiketini kapatıyoruz. Kod tarafında kaç tane “TableRow” Etiketi eklemişsek o kadar satır var demektir. Eklediğimiz nesne kaçıncı <TableRow> etiketinin içindeyse o satırda olduğu anlamına gelir.

Yorum Yap