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.
Bu bölgelerden hangilerine nesne yerleştirirseniz o bölgedeki nesneler üst üste gözükürler.
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.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 |
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.
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.
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.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 |
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.