Android ConstraintLayout Kullanımı

Aşağıdaki yazı Android Programlama Eğitimi kitabımın 3. baskısından bir alıntı olup izinsiz kopyalanamaz.

ConstraintLayout, Google I/O 2016 etkinliğinde tanıtılan yeni özelliklerden belki de en dikkate değer olanı. Zira bu layout nesnesi ile görsel tasarım hem daha kolay hale geliyor, hem de ezeli rakip iOS’tan ironik bir alıntı yapılmış olunuyor. ConstraintLayout, özellikle RelativeLayout ile yaşanan bazı sorunlara çare olabilmesi amacıyla düşünülmüş. Örneğin yüzdelik değerlerin verilebilmesi ve iç içe (nested) layout kullanımı nedeniyle oluşan karmaşıklığın azaltılması gibi. Unbundled bir kütüphane olması nedeniyle de API-9‘a kadar geriye uyumlu yani çok eski versiyonlarda bile kullanılabilecek bir özellik.

Dikkat: Bu özelliğin kullanımı Android Studio 2.2 gerektirmektedir. Bu başlık, kitabın 3. baskısının yazıldığı günlerde Android Studio 2.2 preview2 versiyonu ile hazırlanmıştır. Dolayısıyla gerçek sürümde olası bir takım değişiklikler gündeme gelebilir. Bu gerekçeyle konuya başlangıç seviyesinde değinilmiştir.

Bu layout üzerine paletten herhangi bir UI elemanı (örneğin buton) sürüklenip bırakıldığında henüz hiç bir constraint’e (kısıtlamaya) sahip olmayacaktır. Constraint oluşturmak için “buton seçili durumdayken” etrafındaki küçük yuvarlaklardan herhangi bir yöne sürükle-bırak işlemi yapılırsa örneğin (activity’nin üst kenarına) bir constraint otomatik olarak oluşur.

android-contraint1

Aşağıdaki kod bu yöntemle oluşturulmuş butona ait üç farklı constraint’i göstermektedir. Activity’nin üst, alt ve sol kenarına göre butona constraint’ler eklenmiştir. CheckBox’ın ise üst kenarı activity’e göre alt kenarı ise butona göre konumlandırılmıştır.

<?xml version=”1.0″ encoding=”utf-8″?>
<android.support.constraint.ConstraintLayout       xmlns:android=”http://schemas.android.com/apk/res/android&#8221;
xmlns:app=”http://schemas.android.com/apk/res-auto&#8221;
xmlns:tools=”http://schemas.android.com/tools&#8221;
android:id=”@+id/act”
android:layout_width=”match_parent”
android:layout_height=”match_parent”
tools:context=”org.android.dernegi.MainActivity”>

<Button       android:id=”@+id/btn”
android:text=”Deneme”
android:layout_width=”100dp”
android:layout_height=”80dp”
android:backgroundTint=”#ec0404″
android:layout_marginStart=”96dp”
android:layout_marginTop=”120dp”
android:layout_marginBottom=”16dp”
app:layout_constraintVertical_bias=”0.66″        app:layout_constraintLeft_toLeftOf=”@+id/ç”
app:layout_constraintTop_toTopOf=”@+id/act ”       app:layout_constraintBottom_toBottomOf=”@+id/act ”   />    <CheckBox
android:text=”CheckBox”
android:layout_width=”136dp”
android:layout_height=”46dp”       android:layout_marginTop=”16dp”
android:layout_marginBottom=”8dp”      tools:layout_editor_absoluteX=”208dp”
android:id=”@+id/chk”
app:layout_constraintTop_toTopOf=”@+id/act”
app:layout_constraintBottom_toTopOf=”@+id/btn”
/>
</android.support.constraint.ConstraintLayout>

android-contarint-2

Araç çubuğuna ait detaylara değinmek gerekirse U mıknatıs işaretli düğme; autoconnect özelliğine aktif/pasif hale getirmekte. X işaretli düğme; oluşturulmuş constraint’leri silmekte, ampul işaretli düğme ise seçili elemanın editördeki konumuna göre constraint’leri otomatik olarak eklemektedir.

Reklamlar