Tata Letak Halaman

Meskipun membuat halaman hanya dengan menarik dan melepas widget itu bisa dilakukan, properti tata letak dapat mempercepat desain Anda secara signifikan. Properti tersebut menawarkan kontrol langsung yang akurat atas ukuran dan posisi widget Anda.

Properti tata letak

Widget panel memiliki properti layout di grup properti utamanya yang menentukan pengaturan widget turunannya. Properti ini memiliki tiga nilai yang memungkinkan:

  • Tetap: mengatur widget turunan terkait dengan tepi panel.
  • Horizontal: mengatur widget turunan di samping satu sama lain secara horizontal.
  • Vertikal: mengatur widget turunan di atas dan di bawah satu sama lain secara vertikal.

Opsi tetap menempatkan widget turunan secara absolut, yang merujuk pada panel induknya. Opsi horizontal dan vertikal mengatur widget secara relatif, sisi kiri dan kanan atau atas dan bawah widget lain pada panel. Anda dapat menganggap widget yang diposisikan secara relatif sebagai mengambang dengan widget di sekitarnya. Faktanya, widget yang diposisikan dengan cara ini disebut dengan mengambang.

Properti Tata Letak

Semua widget memiliki grup properti Tata Letak yang menentukan ukuran dan posisinya. Konten grup Tata Letak berubah berdasarkan properti layout dari panel induk widget.

Properti Tata Letak panel tetap

Widget di panel tetap memiliki properti Tata Letak yang menetapkan ukuran dan posisinya relatif terhadap tepi panel. Properti persisnya yang ditampilkan bervariasi berdasarkan pada jenis widget dan pilihan Anda, tetapi semuanya terdiri dari empat jenis dasar:

Jenis Deskripsi Properti
Posisi Properti posisi menentukan seberapa jarak widget yang semestinya dari tepi widget induk. Kotak centang di samping properti posisi dapat menonaktifkan properti tersebut. Jika Anda menonaktifkan properti terakhir pada sumbu, App Maker secara otomatis mengaktifkan properti yang berlawanan. top, bottom, left, right
Ukuran absolut Properti ukuran absolut menentukan ukuran widget, kecuali properti ukuran otomatis yang sesuai diaktifkan. Kotak centang di samping properti ukuran dapat menonaktifkan properti tersebut. Jika Anda menonaktifkan properti ukuran absolut, ukuran widget ditentukan oleh properti posisi sumbunya. width, height
Ukuran otomatis Properti ukuran otomatis menyesuaikan skala ukuran widget secara otomatis berdasarkan kontennya. Properti ini hanya tersedia untuk beberapa jenis widget, dan hanya jika Anda belum menonaktifkan properti ukuran absolut yang sesuai. autoWidth, autoHeight
Batasan ukuran Properti batasan ukuran menetapkan batasan ukuran maksimum dan minimum pada sumbu ukuran absolut yang secara otomatis dinonaktifkan dan disesuaikan ukurannya. Masukkan nilai untuk menetapkan ukuran dimensi widget terkecil atau terbesar yang diizinkan. minWidth, maxWidth, minHeight, maxHeight

Properti Tata Letak panel mengambang

Widget di panel vertikal dan horizontal juga memiliki properti Tata Letak yang mengontrol ukuran dan posisinya, meskipun opsi untuk mengontrol posisi jauh lebih terbatas daripada di panel tetap. Properti panel mengambang diatur dalam dua kolom: horizontal dan vertikal. Setiap kolom mengontrol sumbunya masing-masing.

Jenis Deskripsi Properti
Ukuran Ukuran mengontrol penyetelan ukuran widget untuk setiap sumbu. Pilih dari fixed, fit to content, dan fill parent. size
Ukuran absolut Properti ukuran absolut menentukan ukuran widget ketika properti size-nya bernilai fixed. width, height
Batasan ukuran Properti batasan menetapkan batasan ukuran maksimum dan minimum ketika properti size widget bernilai fit to content atau fill parent. minWidth, maxWidth, minHeight, maxHeight
Perataan Perataan mengontrol posisi sumbu panel yang tidak mengambang. Jenis ini menentukan perataan vertikal widget di panel horizontal dan perataan horizontalnya di panel vertikal. align

Spasi

Gunakan spasi untuk mengontrol margin dan padding setiap widget.

Jenis Deskripsi Properti
Margin Menentukan jumlah spasi antara tepi widget dan objek terdekat di halaman. margin top, margin bottom, margin left, margin right
Padding Mengontrol jumlah spasi antara konten widget dan tepinya. padding top, padding bottom, padding left, padding right

Properti mengambang

Tidak seperti panel tetap, sebagian besar penentuan posisi widget di panel mengambang terjadi di level panel. Untuk menempatkan widget dalam posisi mengambang, gunakan properti di grup Mengambang pada panel induk:

Properti Deskripsi
wrap Properti ini mengontrol cara panel mengatur widget yang, jika tidak dikontrol, akan lebih lebar dari sumbu posisi mengambangnya.
justify Properti ini mengontrol cara panel mengatur widget di sepanjang sumbu posisi mengambangnya.
alignChidren Properti ini mengontrol cara panel mengatur widget di sepanjang sumbu posisi bukan mengambangnya.
wrapAlign Properti ini mengontrol cara panel mengatur widget yang tergabung, ketika properti wrap diaktifkan.

Properti Ukuran

Grup properti Ukuran mencantumkan semua properti ukuran dari grup Tata Letak sebagai properti reguler. Properti ini memungkinkan data Anda mengikat properti untuk mengubah nilainya secara dinamis. Properti dalam grup ini semua dapat diedit secara bersamaan, sehingga Anda dapat menetapkan nilai yang bentrok. Misalnya, Anda dapat menetapkan nilai left, right, dan width ke angka yang tidak kompatibel. App Maker tidak menjamin perilaku yang konsisten untuk properti ukuran yang bentrok.

Outline

Tab Outline di sebelah kanan kanvas memungkinkan Anda mengunci atau menyembunyikan widget. Widget yang dikunci tidak dapat dipilih pada kanvas, untuk menghindari pemindahan secara tidak sengaja. Widget yang disembunyikan tidak dirender di kanvas, sehingga Anda dapat berinteraksi dengan widget yang semestinya ada di bawahnya. Widget yang disembunyikan masih ditampilkan pada waktu proses aplikasi. Untuk memposisikan ulang atau mengedit widget yang dikunci atau disembunyikan, pilih namanya dari Outline.