Object: List membuat Dropdown List atau List box Form Control. Dropdown List hanya menampilkan satu item namun dapat diperluas untuk menampilkan daftar lengkap; List box menunjukkan beberapa item sekaligus. Gambar di bawah menunjukkan daftar Dropdown di sebelah kiri (yang telah diperluas), dan List box di sebelah kanan.
Form Control adalah elemen HTML aktual yang mengambang di atas kanvas game di halaman HTML. Oleh karena itu, tidak ada yang bisa ditampilkan di atas Form Control, selain dari Form Control lainnya.
Form Control memposisikan diri menyesuaikan dengan Parallax, skala dan sebagainya pada Layer. Namun tidak benar-benar terletak “dalam game” (karena mereka mengapung di atas), jadi disarankan untuk menghindari penggunaan pengguliran (Scroll), Parallax dan Skala pada Layer dengan Form Control, jika tidak, hasil akhirnya tidak terasa tidak alami.
Styling List Objects (Menerapkan style pada Object: List)
Form Control: List dapat disesuaikan dengan sejumlah besar cara melalui CSS (Cascading Style Sheets). Daripada menambahkan Action untuk mengatur semua Property, Object: List memperlihatkan Action: Set CSS style. Mengenal tentang CSS tentu saja akan menjadi keuntungan di sini, tapi mudah digunakan untuk Property sederhana. Beberapa contoh tercantum di bawah ini.
- Membuat teks berwarna merah:
Set “color” to “red” - Membuat latar belakang berwarna kuning:
Set “background-color” to “yellow” - Membuat bingkai tebal abu-abu cerah:
Set “border” to “3px solid #AAAAAA” - Membuat Font menjadi agak besar:
Set “font-size” to “2em” - Membuat bingkai garis putus-putus berwarna merah:
Set “border” to “2px dashed red”
List Properties
- Items
Daftar item awal, yang dipisahkan titik koma untuk ditampilkan dalam daftar.
Misalnya: One; Two; Three akan menampilkan 3 pilihan secara terpisah. - Tooltip
Tooltip yang muncul di sebagian besar browser jika user mengarahkan mouse ke tombol dan menunggu.
Biarkan kosong jika tidak ingin menggunakan Tooltip. - Initial visibility
Apakah kontrol awalnya terlihat dalam Layout atau tidak. - Enabled
Apakah kontrol pada awalnya diaktifkan.
Jika NO, kontrol akan terlihat abu-abu dan pemilihan item tidak dapat dilakukan. - Type
Pilih jenis antara List box atau Dropdown List.
Gambar yang menampilkan dua jenis ditunjukkan di atas. - Multi-select
Mengizinkan lebih dari satu item dapat dipilih, jika Property: Type adalah List box.
Ini tidak berpengaruh untuk Type = Dropdown List. - Auto font size
Secara otomatis mengatur Property ukuran huruf dari elemen sesuai dengan Layout dan skala dari Layer.
Ini akan mencegah Property: CSS untuk ukuran font yang diatur secara manual dengan Action: Set CSS style.
Set ke NO jika Anda berniat menggunakan CSS Style untuk menyesuaikan Property ukuran font. - ID (optional)
Atribut id (opsional) untuk elemen di DOM (Document Object Model).
Ini berguna untuk mengakses nilai elemen melalui skrip eksternal, atau mengatur gaya (Styling) melalui CSS di halaman HTML.
List Conditions
- Compare item text at
Bandingkan teks dari item tertentu dalam List. - Compare selected item text
Bandingkan teks dari item yang dipilih dalam List. - Compare selection
Bandingkan indeks (berbasis nol) dari item yang saat ini dipilih. - On clicked
Dipicu saat Control ini diklik. - On double-clicked
Dipicu saat Control ini diklik dua kali. - On selection changed
Dipicu kapan pun perubahan pemilihan pada item di Control ini.
Ini bisa dengan cara input apapun (seperti: klik mouse, tekan tombol keyboard, atau input sentuh pada ponsel).
List Actions
- Set CSS style
Tetapkan CSS Style (Cascading Style Sheets) pada elemen List.
Untuk informasi lebih lanjut, lihat bagian Styling List Objects (Menerapkan style pada Object: List).
Perhatikan bahwa jika Property: Auto Font size diset ke YES, setiap pengaturan untuk Property ukuran font melalui Action ini (CSS) tidak akan berpengaruh. - Add item
Tambahkan item baru ke bagian akhir pilihan List yang tersedia. - Add item at
Masukkan item baru ke pilihan List yang tersedia pada indeks tertentu (berbasis nol). - Clear
Hapus semua pilihan yang tersedia dari List. - Remove
Hapus item pada indeks tertentu (berbasis nol). - Set item text
Ubah teks item pada indeks tertentu (berbasis nol). - Set selection
Tetapkan pemilihan item pada indeks tertentu (berbasis nol). - Set enabled
Mengaktifkan atau menonaktifkan Control ini.
Jika Disabled, maka akan terlihat abu-abu dan pemilihan tidak dapat dilakukan. - Set tooltip
Menetapkan Property: Tooltip dari Object, yang ditampilkan oleh sebagian besar browser saat mengarahkan kursor mouse di atas sebuah Control. - Set focused
- Set unfocused
Menentukan atau mengubah fokus input ke Control ini.
Saat difokuskan, masukan melalui keyboard akan mempengaruhi Control ini.
List Expressions
- ItemCount
Jumlah item dalam List. - ItemTextAt
Mengambil teks item pada indeks dalam List (berbasis nol). - SelectedCount
Jumlah item yang dipilih.
Ini akan selalu berupa 0 atau 1, kecuali jika Property: Type = List box dan Property: Multi-select = enabled. - SelectedIndex
Indeks (berbasis nol) dari item yang dipilih.
Untuk List box dengan Multi-select, gunakan Expression: SelectedIndexAt sebagai gantinya. - SelectedIndexAt
Indeks dari semua item yang dipilih.
Dengan kata lain, SelectedIndexAt dengan angka 0 ke SelectedCount - 1, akan menghasilkan indeks dari semua item yang dipilih. - SelectedText
Teks dari item yang dipilih.
Untuk List box dengan Multi-select, gunakan Expression: SelectedTextAt sebagai gantinya. - SelectedTextAt
Teks dari semua item yang dipilih.
Dengan kata lain, SelectedTextAt dengan angka 0 ke SelectedCount - 1, akan menghasilkan teks pada setiap item yang dipilih.
Komentar
Posting Komentar