Android

Android Studio Programında ConstraintLayout Kullanımı

ConstraintLayout, Android işletim sisteminin 7. sürümü ile sunulan bir yerleşimdir. En yeni yerleşim türüdür ve getirdiği yeniliklerle en çok kullanılanıdır. Esnek olduğu, alt görünümleri ekrandan istenen yere konumlandırdığı ve çoğu yerleşim gereksinimlerini karşıladığı için tercih edilir. Basit kısıtlama ayarlarıyla bileşenler birbirinin içine yerleştirilmeden hızlı ve kolay bir şekilde kullanıcı arayüzü tasarlanabilir. Ayrıca Android Studio tasarım editörü kullanılarak basit sürükle bırak işlemleriyle tüm bir layout tasarlanabilir

Palette paneli içinde sürükle bırak yöntemiyle alt görünümler tasarım ekranına yerleştirilir. Alt görünümün etrafındaki yuvarlaklar kullanılarak sürükle bırak yöntemiyle ya kenar boşluklarına ya da diğer görünümlere bağlanır. Bu sayede ekranın istenen bir konumuna görünüm yerleştirilebilir. 

ConstraintLayout yerleşimi oluşturulmak istenirse XML kod olarak şunlar yazılır:

<?xml version=”1.0” encoding=”utf-8”?>
<androidx.constraintlayout.widget.ConstraintLayout
 xmlns:android=”http://schemas.android.com/apk/res/android”
 xmlns:app=”http://schemas.android.com/apk/res-auto”
 xmlns:tools=”http://schemas.android.com/tools”
 android:layout_width=”match_parent”
 android:layout_height=”match_parent”
 tools:context=”.MainActivity”>
 <!--
 Bu bölüme View ve ViewGroup
 XML kodları yazılır.
 -->
</androidx.constraintlayout.widget.ConstraintLayout>

Bu görünüm biçiminde kullanılmak üzere simgelerle gösterilen seçenekleri kullanabilirsiniz. Nesnelerin bağlantı yollarını iptal edebilr, oluşturabilir, nesneleri birbirlerine göre konumlandırıp hizalayabilirsiniz. Ayrıca sahneye klavuz çizgileri ekleyip nesneleri klavuz çizgilerine göre bağlayabilirsiniz. Aşağıdaki örneği inceleyebilirsiniz.

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <ImageView
        android:id="@+id/imageView"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:src="@drawable/ic_launcher_background"
        app:layout_constraintBottom_toTopOf="@+id/editTextName"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHeight_percent="0.2"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintWidth_percent="0.5" />

    <EditText
        android:id="@+id/editTextName"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:ems="10"
        android:inputType="textPersonName"
        android:text="Name"
        app:layout_constraintEnd_toStartOf="@+id/editTextSurname"
        app:layout_constraintHeight_percent="0.1"
        app:layout_constraintHorizontal_chainStyle="packed"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@id/imageView"
        app:layout_constraintWidth_percent="0.45" />

    <EditText
        android:id="@+id/editTextSurname"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:ems="10"
        android:inputType="textPersonName"
        android:text="Surname"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHeight_percent="0.1"
        app:layout_constraintStart_toEndOf="@id/editTextName"
        app:layout_constraintTop_toBottomOf="@id/imageView"
        app:layout_constraintWidth_percent="0.45" />

    <EditText
        android:id="@+id/editTextDay"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:ems="10"
        android:inputType="textPersonName"
        android:text="Day"
        app:layout_constraintEnd_toStartOf="@+id/editTextMonth"
        app:layout_constraintHeight_percent="0.1"
        app:layout_constraintHorizontal_bias="0.43"
        app:layout_constraintHorizontal_chainStyle="packed"
        app:layout_constraintStart_toStartOf="@id/editTextName"
        app:layout_constraintTop_toBottomOf="@+id/editTextName"
        app:layout_constraintWidth_percent="0.2" />

    <EditText
        android:id="@+id/editTextMonth"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:ems="10"
        android:inputType="textPersonName"
        android:text="Month"
        app:layout_constraintEnd_toStartOf="@+id/editTextYear"
        app:layout_constraintHeight_percent="0.1"
        app:layout_constraintStart_toEndOf="@+id/editTextDay"
        app:layout_constraintTop_toBottomOf="@+id/editTextName"
        app:layout_constraintWidth_percent="0.2" />

    <EditText
        android:id="@+id/editTextYear"
        android:layout_width="210dp"
        android:layout_height="0dp"
        android:ems="10"
        android:inputType="textPersonName"
        android:text="Year"
        app:layout_constraintEnd_toEndOf="@id/editTextSurname"
        app:layout_constraintHeight_percent="0.1"
        app:layout_constraintStart_toEndOf="@id/editTextMonth"
        app:layout_constraintTop_toBottomOf="@+id/editTextSurname"
        app:layout_constraintWidth_percent="0.2" />

    <RadioButton
        android:id="@+id/radioBtnOne"
        android:layout_width="wrap_content"
        android:layout_height="0dp"
        android:text="One"
        app:layout_constraintEnd_toStartOf="@+id/radioBtnTwo"
        app:layout_constraintHeight_percent="0.1"
        app:layout_constraintHorizontal_chainStyle="spread"
        app:layout_constraintStart_toStartOf="@+id/editTextName"
        app:layout_constraintTop_toBottomOf="@id/editTextDay" />

    <RadioButton
        android:id="@+id/radioBtnTwo"
        android:layout_width="wrap_content"
        android:layout_height="0dp"
        android:text="Two"
        app:layout_constraintEnd_toStartOf="@+id/radioBtnThree"
        app:layout_constraintHeight_percent="0.1"
        app:layout_constraintStart_toEndOf="@id/radioBtnOne"
        app:layout_constraintTop_toBottomOf="@id/editTextYear" />


    <RadioButton
        android:id="@+id/radioBtnThree"
        android:layout_width="wrap_content"
        android:layout_height="0dp"
        android:text="Three"
        app:layout_constraintEnd_toStartOf="@+id/radioBtnFour"
        app:layout_constraintHeight_percent="0.1"
        app:layout_constraintStart_toEndOf="@id/radioBtnTwo"
        app:layout_constraintTop_toBottomOf="@id/editTextYear" />

    <RadioButton
        android:id="@+id/radioBtnFive"
        android:layout_width="wrap_content"
        android:layout_height="0dp"
        android:text="Five"
        app:layout_constraintEnd_toEndOf="@+id/editTextSurname"
        app:layout_constraintHeight_percent="0.1"
        app:layout_constraintStart_toEndOf="@id/radioBtnFour"
        app:layout_constraintTop_toBottomOf="@+id/editTextYear" />

    <RadioButton
        android:id="@+id/radioBtnFour"
        android:layout_width="wrap_content"
        android:layout_height="0dp"
        android:text="Four"
        app:layout_constraintEnd_toStartOf="@+id/radioBtnFive"
        app:layout_constraintHeight_percent="0.1"
        app:layout_constraintStart_toEndOf="@id/radioBtnThree"
        app:layout_constraintTop_toBottomOf="@+id/editTextMonth" />

    <View
        android:id="@+id/view3"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:background="#FFC107"
        app:layout_constraintEnd_toEndOf="@+id/editTextSurname"
        app:layout_constraintHeight_percent="0.2"
        app:layout_constraintStart_toStartOf="@+id/editTextName"
        app:layout_constraintTop_toBottomOf="@+id/radioBtnThree" />

    <TextView
        android:id="@+id/txtTitle"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:text="This is a info title"
        android:textColor="@android:color/black"
        android:textSize="22sp"
        app:layout_constraintBottom_toBottomOf="@+id/view3"
        app:layout_constraintEnd_toStartOf="@+id/txtDate"
        app:layout_constraintStart_toStartOf="@+id/view3"
        app:layout_constraintTop_toTopOf="@id/view3"
        app:layout_constraintVertical_bias="0.2"
        app:layout_constraintWidth_percent="0.5" />

    <TextView
        android:id="@+id/txtDate"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:text="27.12.2020"
        android:textAlignment="textEnd"
        app:layout_constraintBottom_toBottomOf="@+id/view3"
        app:layout_constraintEnd_toEndOf="@+id/view3"
        app:layout_constraintStart_toEndOf="@id/txtTitle"
        app:layout_constraintTop_toTopOf="@id/view3"
        app:layout_constraintVertical_bias="0.4"
        app:layout_constraintWidth_percent="0.3" />

    <TextView
        android:id="@+id/txtDescription"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:text="@string/description"
        app:layout_constraintBottom_toBottomOf="@+id/view3"
        app:layout_constraintEnd_toEndOf="@+id/txtDate"
        app:layout_constraintStart_toStartOf="@+id/txtTitle"
        app:layout_constraintTop_toBottomOf="@+id/txtTitle" />

    <Button
        android:id="@+id/btnGo"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:text="Go"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="@+id/view3"
        app:layout_constraintHeight_percent="0.2"
        app:layout_constraintTop_toBottomOf="@+id/view3"
        app:layout_constraintWidth_percent="0.4" />

    <Button
        android:id="@+id/btnWait"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:text="WAİT"
        app:layout_constraintBottom_toTopOf="@id/btnStop"
        app:layout_constraintHeight_percent="0.1"
        app:layout_constraintStart_toStartOf="@+id/view3"
        app:layout_constraintTop_toTopOf="@id/btnGo"
        app:layout_constraintWidth_percent="0.5" />

    <Button
        android:id="@+id/btnStop"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:text="STOP"
        app:layout_constraintBottom_toBottomOf="@id/btnGo"
        app:layout_constraintHeight_percent="0.1"
        app:layout_constraintStart_toStartOf="@+id/btnWait"
        app:layout_constraintTop_toBottomOf="@id/btnWait"
        app:layout_constraintWidth_percent="0.5" />

</androidx.constraintlayout.widget.ConstraintLayout>
İlgili Makaleler
Mobil Uygulamalar Dersi İkinci Dönem İkinci Yazılı Çalışma Soruları
Android Studio İçin Meb Sertifika Yükleme
Gmail Hesabi Açmak, Gmail Kaydol, Yeni Bir Gmail Hesabı Oluşturma
Ksoap Kütüphanesini Android Studio Projesine Dahil Etme
Dinamik Olarak Fragment Sayfalarıyla İşlem Yapan Android Java Uygulaması
Seçilen Resmi Arkaplan Olarak Ayarlayan Android Java Uygulaması
Kitap Bilgilerini Sqlite Veri Tabanında Oluşturduktan Sonra Ekleme, Listeleme, Silme, Güncelleme İşlemlerini Yapan Android Java Uygulaması
Android Studio Programında Grid Layout Kullanımı ve Hesap Makinesi Oluşturma
2022 TYT Matematik Onbirinci Sorunun Çözümünü Yapan Android Java Uygulaması
Beni Hatırla Seçeneğiyle Birlikte Kullanıcı Adı ve Şifre İşlemlerini Gerçekleştiren Android Java Uygulaması
Ses Kaydetme ve Oynatma İşlemini Yapan Android Java Uygulaması
Android Studio Programında ConstraintLayout Kullanımı
Ortamda Bulunan Bluetooth Cihazlarının Listesini Veren Android Java Uygulaması
Uyeler Tablosundaki Tüm Kayıtları Listeleyen Android Java Uygulaması
Ses Kontrolü Yapan Android Java Uygulaması
Windows İşletim Sistemi İçin Android Studio Programının Kurulumu
2022 TYT Matematik Üçüncü Sorunun Çözümünü Yapan Android Java Uygulaması
JsonArrayRequest Kullanarak JSON Verileri TextView İçinde Gösteren Android Java Uygulaması
ListView Nesnesinde Listelenen İsimlerden Seçilen Birden Fazla İsmi Görüntüleyen Android Java Uygulaması
ListView Nesnesinde Listelenen İsimlerden Seçilen İsmi Görüntüleyen Android Java Uygulaması

Yorum Ekle
   
Kötü
İyi