Tutorial Desain Tata Letak Android: Semua yang Perlu Anda Ketahui



Tutorial Desain Tata Letak Android ini akan membantu Anda memahami bagaimana tata letak dapat dirancang menggunakan tampilan dan grup tampilan dengan demo.

Jika Anda baru mengenal , Anda telah berada di tempat yang tepat untuk memulai pembelajaran Anda tentang desain tata letak. Artikel tentang tutorial desain tata letak Android ini akan membantu Andabeberapa tips berguna untuk membuat desain UI yang lebih baik dan juga menjelaskan cara mendesain UI.

Saya akan membahas topik di bawah ini:





Jadi, ayo kita mulai!

transfer file ke instance ec2 linux

Tutorial Desain Tata Letak Android: Pengantar komponen UI

Berbicara tentang komponen UI, UI khas dari setiap aplikasi Android terdiri dari komponen-komponen ini:



  • Bilah Tindakan Utama
  • Lihat Kontrol
  • Area Konten
  • Pisahkan Bilah Tindakan

Ini memainkan peran utama saat Anda mengembangkan aplikasi yang kompleks. Anda akan mendapatkan gambaran yang jelas tentang hal ini saat kita membuka bagian demo di artikel ini.

Faktor penting lainnya yang membantu dalam menyesuaikan desain UI adalah komponen tampilan.

Mari kita lihat apa itu View in



Tutorial Desain Tata Letak Android: Tampilan

UNTUK Melihat dianggap sebagai blok penyusun dasar untuk antarmuka pengguna yang tepat yang sebenarnya dibuat dari Lihat kelas . Ini menempati area persegi panjang di layar dan pada akhirnya menangani gambar dan penanganan acara.

View adalah kelas dasar untuk widget, yang digunakan untuk membuat komponen UI interaktif seperti tombol, bidang teks, dll. Sekarang berbicara tentang area persegi panjang atau kotak, Bisa berupa gambar, sepotong teks, tombol atau apa pun yang dapat ditampilkan oleh aplikasi android. Persegi panjang di sini sebenarnya tidak terlihat, tetapi setiap tampilan menempati bentuk persegi panjang.

Anda mungkin memiliki pertanyaan, berapa ukuran persegi panjang ini?

Jawabannya adalah Anda dapat mengaturnya secara manual dengan menentukan ukuran yang tepat (dengan satuan yang tepat) atau dengan menggunakan beberapa nilai yang telah ditentukan sebelumnya. Nilai standar ini adalah match_parentand wrap_content. Ini match_parent menandakan bahwa itu akan menempati seluruh ruang yang tersedia pada tampilan perangkat. Sedangkan, wrap_content mengacu bahwa itu hanya akan menempati ruang sebanyak yang diperlukan untuk menampilkan kontennya.

Sekarang mari kita tunjukkan perbedaan utama antara View dan ViewGroup.

Melihat

  1. Melihat objek adalah blok bangunan dasar dari elemen UI di Android.
  2. Tampilan adalah kotak persegi panjang sederhana yang menanggapi tindakan pengguna.
  3. Tampilan mengacu pada kelas android.view.View, yang merupakan kelas dasar dari semua kelas UI.
  4. Contohnya adalah EditText, Button, CheckBox, dll.

ViewGroup

  1. ViewGroup adalah wadah tak terlihat yang menampung View dan ViewGroup.
  2. ViewGroup adalah kelas dasar untuk Tata Letak .
  3. Misalnya, LinearLayout adalah ViewGroup yang berisi Button (View), dan Layout lainnya juga.

Sekarang mari kita lanjutkan dan pahami Layout yang ada.

Tutorial Desain Tata Letak Android: Jenis Tata Letak

UNTUK tata letak mendefinisikan struktur untuk Antarmuka Pengguna dalam aplikasi. Semua elemen dalam tata letak dibuat menggunakan hierarki Melihat dan ViewGroup benda.

Sekarang mari kita lihat cara mendeklarasikan tata letak.

Anda dapat mendeklarasikan tata letak dengan dua cara:

  • Deklarasikan elemen UI dalam XML. Android menyediakan kosakata XML langsung yang sesuai dengan kelas dan subkelas View, seperti untuk widget dan tata letak.

catatan: Anda juga bisa menggunakan Layout Editor Android Studio untuk membangun tata letak XML Anda menggunakan antarmuka seret dan lepas.

  • Instantiate elemen tata letak di menjalankan waktu . Aplikasi dapat membuat Melihat dan ViewGroup objek dan memanipulasi propertinya secara terprogram.

Mari kita bahas berbagai jenis Layout.

UI di Android adalah hierarki Views dan ViewGroups. ViewGroups akan menjadi node perantara dalam hierarki, dan tampilan akan menjadi node terminal.

  • Tata letak linier
  • Tata letak mutlak
  • Tata letak relatif
  • Tata letak tabel
  • Tata letak bingkai

Mari kita bahas secara detail.

Tata letak linier

Tata letak linier digunakan untuk menempatkan satu elemen di setiap baris. Jadi, semua elemen akan ditempatkan secara tertib dari atas ke bawah. Ini adalah tata letak yang sangat banyak digunakan untuk membuat formulir di Android. Ini juga dapat disebut sebagai grup tampilan yang menyelaraskan semua turunan dalam satu arah, secara vertikal atau horizontal.

Tata letak mutlak

Dalam tata letak absolut, Anda dapat menentukan koordinat yang tepat dari setiap kontrol yang ingin Anda tempatkan. Dalam jenis tata letak ini, Anda dapat memberikan koordinat X dan Y yang tepat untuk setiap kontrol. Ini memungkinkan Anda untuk menentukan lokasi pasti dari turunannya.

Tata letak relatif

Sebuah Tata Letak Relatif adalah a ViewGroup yang menampilkan tampilan anak dalam posisi relatif. Kamudapat menentukan posisi elemen dalam hubungannya dengan elemen lain, atau dalam kaitannya dengan wadah induk.

Tata letak tabel

Menggunakan tata letak tabel, Anda dapat membuat tabel dengan baris dan kolom dan menempatkan elemen di dalamnya. Di setiap baris, Anda dapat menentukan satu atau lebih elemen. Anda dapat menggunakan perintah ini untuk membuat tata letak tabel baru.

Tata letak bingkai

Tata letak Bingkai digunakan saat Anda ingin menampilkan satu item di setiap layar. Dengan menggunakan tata letak bingkai, Anda dapat memiliki banyak item.Tata Letak Bingkai ini adalah tempat penampung di layar yang dapat Anda gunakan untuk menampilkan tampilan tunggal.

Tutorial Desain Tata Letak Android: Satuan pengukuran

Saat Anda menentukan ukuran elemen di UI Android, Anda harus mengingat unit pengukuran berikut.

Satuan Deskripsi
dp Piksel Independen Kepadatan. 1dp setara dengan satu piksel pada a 160dpi layar.
sp Skala Piksel Independen. Ini sangat mirip dengan dp tetapi hanya disarankan untuk menentukan ukuran font.
pt Titik. Sebuah titik didefinisikan sebagai 1/72 inci.
px Pixel. Sesuai dengan piksel aktual di layar

Sekarang, mari kita lanjutkan ke topik terakhir dari artikel ini.

Tutorial Desain Tata Letak Android: Demo

Di bagian demo ini, mari kita pahami cara bekerja dengan tata letak di Android Studio .

Lihat ke Android Studio.

Seperti inilah tampilan tata letaknya. Cukup pilih drawable dan Anda akan menemukan beberapa kelas, pilih kelas lain di bawah drawable ini. Anda dapat mengkodekan struktur tata letak atau Anda dapat melihat desain dan cukup seret dan lepas komponen pada ruang desain.

Demo - Tutorial Desain Tata Letak Android - Edureka

Anda dapat melihat komponen yang telah Anda pilih di bawah pohon komponen.

Anda juga dapat menemukannya di tata letak.

  1. Palet : Ini menyimpan daftar tampilan dan grup tampilan yang dapat Anda seret ke tata letak Anda.
  2. Komponen Pohon : Terdiri dari hierarki Tampilan untuk tata letak Anda.
  3. Toolbar : Tombol untuk mengonfigurasi tampilan tata letak di editor dan untuk mengubah beberapa atribut tata letak.
  4. Editor desain : Tata Letak dalam tampilan Desain atau Cetak Biru, atau keduanya. Juga dianggap sebagai desain ruang.
  5. Atribut : Ini mengontrol atribut tampilan yang dipilih.

Dengan ini, kita sampai pada akhir artikel ini tentang 'Tutorial Desain Tata Letak Android'. Semoga kalian jelas dengan apa yang telah dibagikan dengan Anda dalam tutorial ini.Nantikan blog lain dan Semoga Sukses dengan karir Pengembangan Android Anda.

Sekarang setelah Anda memahami dasar-dasar Desain Tata Letak Android, lihat oleh Edureka, perusahaan pembelajaran online tepercaya dengan jaringan lebih dari 250.000 pelajar yang puas dan tersebar di seluruh dunia.

Kursus Pelatihan Sertifikasi Pengembangan Aplikasi Android Edureka dirancang untuk siswa dan profesional yang ingin menjadi Pengembang Android. Kursus ini dirancang untuk memberi Anda permulaan dalam pemrograman Java dan melatih Anda untuk konsep inti dan lanjutan bersama dengan proyek di mana Anda diharapkan untuk membuat Aplikasi di Android.

Ada pertanyaan untuk kami? Harap sebutkan di bagian komentar di blog 'Tutorial Desain Tata Letak Android' dan kami akan menghubungi Anda kembali secepatnya.