Mobil Programlama

Android

DERS PROGRAMI
Android 201 Ders Programı

Layout

Lisans: Creative Commons 26.11.2020 tarihinde güncellendi
Bakabileceğiniz Etiketler: Eğitmen: Geleceği Yazanlar Ekibi

Android uygulamalarında ekran tasarımları res klasörü altında bulunan layout dosyaları ile belirlenir. Bu dosyalar xml formatında hazırlanan dosyalardır ve Android uygulamalarına özel etiketler kullanarak görsel öğelerin yerleşimlerini ve özelliklerini bildirirler.

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >
 
    <ListView
        android:id="@android:id/list"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content" />
 
</LinearLayout>

Bir ekranın görünümü genellikle iki farklı yerleşim tipi kullanılarak belirlenir. Bunlar RelativeLayout ve LinearLayout olarak ikiye ayrılır.

LinearLayout yerleşimi kullanıldığında öğeler sırayla ekrana dizilirler ve ekrandaki yerleşimleri ekranın en tepesinden en altına doğru sırayla gerçekleşir. Yukarıdaki örnekte, ListView öğesinin altına başka bir öğe eklendiğinde ilk olarak liste ve listenin altında bu yeni öğe görüntülenir. Öğelerin uzunluk ve genişlikleri android:layout_width ve android:layout_height özellikleriyle belirlenir. Burada fill_parent (ana öğe ne kadar genişse hepsini doldurur) ve wrap_content (öğe içerisinde yer alan metin veya resim kadar yer kaplar) değerleri kullanılabileceği gibi, piksel cinsinden uzunluk da verilebilir. Eğer piksel vererek ebat belirleyeceksek, px birimi yerine dp birimini kullanmamız faydalı olacaktır. Android cihazlarda farklı ebatlarda ekranlar olduğundan, px cinsinden verilen piksellerin tasarımı her cihazda farklı oluşturacaktır. dp birimi ise ekran boyutuna göre ölçeklendirme yapmaktadır ve farklı cihazlarda benzer görünümler elde etmenizi sağlar.

RelativeLayout görsel öğeleri diğer öğelere göre referans alarak dizer. RelativeLayout tasarımında ilk eklenen öğe ekranın en tepesinde yer alır. Daha sonra eklenen öğeler android:layout_below (verilen ID’nin altında), android:layout_above (verilen ID’nin üzerinde), android:layout_toLeftOf (verilen ID’nin solunda) ve android:layout_toRightOf (verilen ID’nin sağında) şeklinde sıralanır. Bu şekilde ekranda oluşturulan bütün öğeleri bir öğeyi referans alarak dizmemiz mümkündür. Öğelerin ebatları ise android:layout_height ve android:layout_width metotlarıyla belirlenir.

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >
 
    <EditText
        android:id="@+id/note_title"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="10sp"
        android:hint="Metin..." />
 
    <EditText
        android:id="@+id/note_latitude"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_below="@id/note_title"
        android:layout_marginTop="10sp"
        android:hint="Enlem..." />
 
    <EditText
        android:id="@+id/note_longitude"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_below="@id/note_latitude"
        android:layout_marginTop="10sp"
        android:hint="Boylam..." />
 
    <Button
        android:id="@+id/add_note_button"
        android:layout_width="fill_parent"
        android:layout_height="40sp"
        android:layout_below="@id/note_longitude"
        android:text="Ekle" />
 
</RelativeLayout>

Android: id özelliği her öğeye bir tanımlayıcı verilmesini sağlar ve öğelere kaynak kod içinden erişmemize ve müdahale etmemize yardımcı olur. Burada yaratılan id değerleri R dosyasında otomatik olarak oluşturulur ve bunlara kaynak kod içinden aşağıdaki gibi erişilir.

EditText titleView = (EditText) findViewById(R.id.note_title); 

findViewById metodu, R dosyası içinden note_title id’sine sahip EditText öğesine erişmemizi sağlar. Bu şekilde ekran üzerindeki öğelerin özelliklerini değiştirebilir ya da aksiyonlar ekleyebiliriz.

((Button) findViewById(R.id.close_button)).setOnClickListener(new OnClickListener() { @Override public void onClick(View v) { finish(); } });

Yukarıdaki örnekte close_button adlı düğmeye setOnClickListener metodu kullanılarak düğmeye basıldığında harekete geçen bir eylem eklenmiştir. Kullanıcı düğmeye bastığında finish metodu harekete geçerek ekranı kapatacaktır.

Layout dosyalarında bir öğeye id atanırken @+id yazımı kullanılır. Bu şekilde öğelere kendi belirlediğimiz isimleri verebiliriz. @id ise layout dosyasında önceden tanımlanmış bir öğeye referans vermek için kullanılır. @drawable, drawable klasörüne atılan resim dosyalarına referans verir. Bu şekilde bir resim yerleştirmek ya da arka plan belirlemek istiyorsak kaynak belirtmek için @drawable yazımını kullanmamız gerekir. Bir düğmeye ya da metin öğesine string.xml dosyasında belirttiğimiz bir yazıyı koymak istiyorsak @string yazımıyla bu dosyada bulunan değerlere erişebiliriz. @android ile işletim sisteminde tanımlanmış değerlere erişebiliriz.