Android Programlama | Linear Layout
İlk serimizde kısaca anlatmıştım ama şimdi detaya ineceğiz dostlar.
Size Linear Layout'u detaylı bir şekilde anlatmak istiyorum.
Linear Layout, İçerikleri dikey-yatay olarak ayarlayabildiğimiz Orientation nitelikli bir layout türüdür.
Layout'un tüm viewleri ( textbox,label) alt alta sıralanır dostlar bu özelliği de budur.
Linear Layout özelliklerini anlatacağım dostlar
Linear Layout | Özellikleri #1
Layout'da Viewler alt alta sıralanır demiştik arkadaşlar bir örnek ile göstermek istiyorum
2 Tane button ekleyelim
View = Button, Label, TextBox gibi içeriklerdir karışıklık olmasın
XML:
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="buton1"
/>İlk Butonumuzu Ekledik Ve Yerinde Konumlandı
Şimdi 2. Butonumuzu Ekleyip Görelim
XML:
XML:
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="buton2"
/>
Ve 2. Buton Eklendi Dostlar, Gördüğünüz Gibi 2 Buton'da Alt Alta Sıralandı
Burdan çıkaracağımız sonuç ise dostlar şudur, Vertical bir layout'da satır başına sadece bir View olur.
Yani alttaki kod'da gördüğünüz gibi layout'un orientation'u vertical olarak seçilmiş dostlar
XML:
XML:
<LinearLayout xmlns:android=""
xmlns:tools=""
android:layout_width="match_parent"
android:layout_height="match_parent"
androidrientation="vertical"
tools:context=""
>Bu Layout'un altına nekadar view eklersek hepsi alt alta hizalanır
Biz vertical'i "horizontal" yaparsak viewler yandaki satırlara hizalanır yan yana konumlanır
XML:
XML:
<LinearLayout xmlns:android=""
xmlns:tools=""
android:layout_width="match_parent"
android:layout_height="match_parent"
androidrientation="horizontal"
tools:context=""
>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="buton1"
/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="buton2"
/>
Görüldüğü üzere horizontal yaptığımız için viewler yan yana hizalandı
Linear Layout | Özellikleri #2
Bir diğer önemli özelliğimiz ise layout_weight dostlar, bu özelliğin amacı her view'e teker teker ağırlık vermesidir
Biz button1 view'ine aşağıdaki gibi 1 değeri verdiğimizde buton1'in genişliği "1" ağrılığında değişti
XML:
<Button
android:layout_height="1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="buton1"
/>Biz button1'e 1 birimlik bir genişlik verdik şimdi button2'ye ise 3 birimlik bir genişlik verelim.
Karşımıza çıkan sonuç gördüğünüz gibidir yani button1 kısalmıştır button2 uzamıştır, eğer mobil cihazımızın ekranını aşma gibi bir durum olursa layout bunu otomatik olarak ayarlar var genişliği otomatik olarak düzeltir
Bu bahsettiklerim textBox içinde geçerlidir dostlar yani siz kodları buton için değil de textBox, label veya herhangi bir view için yaparsanız sonuç aynı olacaktır.
Android Programlama | Relative Layout
Bundan önceki konuda Relative Layout'dan kısaca bahsetmiştim Relative Layout konusunda ise özelliklerinden örneklemelerle bahsedip Linear Layout ile kısaca bi karşılaştırma yapacağım.
Linear Ve Relative Layout'u iyi öğrenmeliyiz hem responsive (uyumlu) bir tasarım için hem de tasarımlarımızın göze daha iyi hitap edebilmesi için bu gerekli.
Relative Layout | Özellikleri #1
Relative Layout içine eklenen view'i bir diğer view'i veya view'leri referans alarak konumlandırılır.
Relative Layout içindeki view default olarak sola yaslı ve yukarda konumlanır
Başka bir view eklersek yine aynı şekilde konumlanır bundan dolayı viewleri başka bir view'e göre konumlandıracağız.
Konumlandırma işlemini view'e ait id kodlarını kullanarak yapacağız.
Bir Buton oluşturuyorum dostlar, genişlik ve yükseklik wrap_content olacak yani kendi boyutu kadar olacak.
XML:
<RelativeLayout xmlns:android=""
xmlns:tools=""
android:layout_width="match_parent"
android:layout_height="match_parent"
android:eek:rientation="horizontal"
tools:context=""
>
<Button
android:id="@+id/bir"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="1"
/>
<Button
android:id="@+id/iki"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="1"
/>tekrar bir buton oluşturalım ve genişlik kendi boyutu kadar olsun text'e de 2 verelim
Başta da dediğimiz gibi konumlandırma işlemini id'ler ile yapacağız yani bizim yapmamız gerekenler buttonlara id tanımlamak olacak.
android:id="@+id/idkodu"
yukarda verdiğim kod ile id tanımlama yaptık
Resimde gördüğünüz gibi sadece 1 buton gözüküyor gözüken buton ise id'si iki olan buton bunun sebebi ise başta anlattığım gibi iki butonun default şeklinde konumlanması.
Yapmamız gereken işlem bir id'li butonu iki id'li butonun altına koymaktır, bunu nasıl yapacağız derseniz
android:layout_below="" niteliği ile yapacağız arkadaşlar
uygulamalı olarak yapalım.
XML:
<RelativeLayout xmlns:android=""
xmlns:tools=""
android:layout_width="match_parent"
android:layout_height="match_parent"
androidrientation="horizontal"
tools:context=""
>
<Button
android:id="@+id/bir"
android:layout_below="@+id/iki" //bu kod ile butonu aşağıya taşımış olduk
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="1"
/>
<Button
android:id="@+id/iki"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="2"
/>
Relative Layout | Özellikleri #2
id'si iki olan butonu ortaya dikey olarak ortalarsak 1.buton nerde kalır ona bakalım
dikey ortalamak için
XML:
android:layout_centerVertical="true"
XML:
<Button
android:id="@+id/iki"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:text="1"
/>
Gördüğünüz gibi iki öğe de alt alta ortalı bir şekilde konumlandı
Relative Layout | Özellikleri #3
Yukardaki örnekteki 1.butonu 2.butonun sağına çıkartmak istiyoruz diyelim peki bunu nasıl yapacağız derseniz
bir id'li butonun below niteliğini kaldırıyoruz bu sayede buton default konumlanmış olacak
Yazmamız gereken kod ise
XML:
android:layout_toRightOf="@+id/iki"
android:layout_centerVertical="True"
XML:
<RelativeLayout xmlns:android=""
xmlns:tools=""
android:layout_width="match_parent"
android:layout_height="match_parent"
androidrientation="horizontal"
tools:context=""
>
<Button
android:id="@+id/bir"
android:layout_toRightOf="@+id/iki"
android:layout_centerVertical="True"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="1"
/>
<Button
android:id="@+id/iki"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="2"
/>
Yazdığımız bu 2 kod ile bir id'li butonumuz iki id'li butonumuzun sağında konumlandı
XML:
android:layout_toRightOf="@+id/iki"
Relative Layout | Özellikleri #4
Bir view'i ekranın sağ üst , sağ alt , sol alt , sol üst köşelerine nasıl getiririz onları öğrenelim dostlar.
Ekranın En Altına İnmesi İçin Kullanacağımız Kod;
XML:
android:layout_alignParentBottom="true"Ortalamak İçin Kullanacağımız Kod;
XML:
android:layout_centerHorizontal="true"1.Butonu 2.Butonun Üstüne Konumlandırmak İçin Kullanacağımız Kod;
XML:
android:layout_above="@id/bir"
android:layout_centerHorizontal="true"
XML:
<RelativeLayout xmlns:android=""
xmlns:tools=""
android:layout_width="match_parent"
android:layout_height="match_parent"
androidrientation="horizontal"
tools:context="
>
<Button
android:id="@+id/bir"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_alignParentBottom="true"
android:text="1"
/>
<Button
android:id="@+id/iki"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="@id/bir"
android:layout_centerHorizontal="true"
android:text="2"
/>
XML:
android:layout_above="@id/bir" #kodunu kaldırırisek butonumuz en üst ortada konumlanacaktır.2. Butonumuzu Ekranın En Alt Sağ Köşesine İndirmek İstersek
Kullanacağımız 2 Kod Var
XML:
android:layout_alignParentRight="true"
android:layout_alignParentBottom="true"
Relative Layout | Özellikleri #5
4 Tane buton ekleyelim
XML:
<RelativeLayout xmlns:android=""
xmlns:tools=""
android:layout_width="match_parent"
android:layout_height="match_parent"
androidrientation="horizontal"
tools:context=""
>
<Button
android:id="@+id/bir"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="1"
/>
<Button
android:id="@+id/iki"
android:layout_below="@id/bir"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="2"
/>
<Button
android:id="@+id/üç"
android:layout_toRightOf="@id/bir"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="3"
/>
<Button
android:id="@+id/dört"
android:layout_toRightOf="@id/üç"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="3"
/>Burda yaptığımız işlem şudur arkadaşlar ,
1.Butonun altına 2 id'li buton
1.Butonun yanına 3 id'li buton
3 id'li butonun yanına 4 id'li buton
şeklinde konumlandırmış olduk.
Layout Konusunu Bitirmiş Olduk Dostlar, Linear Layout Relative Layout farklarından bahsetmeme gerek yoktur diye düşünüyorum zaten görüldüğü üzere Relative Layout çok geniş bir yelpaze
Aklınıza takılanları kesinlikle sormayı unutmayın..
Kodlarda ufak tefek hatalar olabilir denk geldiğinizde bildirirseniz sevinirim biliyorsunuz yazılım kısmında ufak bi boşluk bile önemlidir.
Eğitimin herkese faydalı olması umuduyla.
İyi Forumlar.
