Komponen grafis sesuai dengan elemen yang akan memungkinkan pengguna untuk berinteraksi dengan sistem, ketika kita berbicara tentang GUI, kita mengacu pada antarmuka pengguna grafis, oleh karena itu antarmuka ini dibangun melalui elemen grafis seperti tombol, menu, ikon, bidang teks, label, dll. teks antara lain, GUI menggabungkan desain visual dan acara yang terkait dengan desain itu, jadi jika kita menambahkan tombol, kita harus memprogram acara yang terkait dengan tombol itu saat ditekan oleh pengguna.
Seperti disebutkan, mari fokus pada komponen grafis yang digunakan dari file XML, mari kita lihat beberapa properti yang disebutkan di atas.
Properti dasar.
Mari kita lihat beberapa properti dasar yang digunakan dalam komponen grafik, ini dapat diterapkan ke komponen apa pun terlepas dari jenisnya, karena seperti yang disebutkan semua komponen adalah Tampilan sehingga mereka memiliki properti yang sama, beberapa yang paling banyak digunakan adalah:
android: id.
Properti yang sangat penting karena memungkinkan pendefinisian pengenal untuk kontrol, properti ini ditugaskan ke tampilan apa pun, misalnya jika ditugaskan ke bidang entri data maka ini akan digunakan untuk menangkap informasi pengguna, jadi kita harus menggunakan nama yang membedakannya jelas.
Cara yang benar untuk menghasilkan pengidentifikasi adalah sebagai berikut:
android:id="@+id/miTextField"
Simbol @+id/ berarti pengidentifikasi baru sedang dibuat, ini akan membuat kelas R. dari paket gen proyek, buat referensi ke objek ini sehingga nantinya dapat dimanipulasi oleh kode.
Dalam contoh, pengidentifikasi “myTextField” untuk komponen.
android:layout_width.
Menentukan lebar yang terkait dengan tampilan, ini adalah properti wajib dan nilainya dapat ditentukan dalam nilai absolut atau dengan menunjukkan salah satu dari dua nilai berikut:
-
bungkus_konten (Ini menempati ruang sesuai dengan isinya)
-
match_parent (Menempati semua ruang yang tersedia)
Contoh:
android:layout_width="match_parent"setiapandroid:layout_width="290dp"
android:layout_height.
Menentukan ketinggian yang terkait dengan tampilan, ini adalah properti wajib dan nilainya dapat ditentukan dalam nilai absolut atau menunjukkan salah satu dari dua nilai berikut:
-
bungkus_konten (Ini menempati ruang sesuai dengan isinya)
-
match_parent (Menempati semua ruang yang tersedia)
Contoh:
android:layout_height="wrap_content"setiapandroid:layout_height="58dp"
android:layout_margin.
Mendefinisikan margin untuk komponen, memungkinkan untuk membuat spasi di atas, di bawah, dan di sisinya, sebagai varian jika Anda ingin memberikan spasi independen, dapat dilakukan dengan menggunakan properti marginLeft, marginRight, marginTop atau marginBottom (atau semua)
Contoh: android:layout_margin="20dp" | android:layout_marginTop="20dp" | android:layout_marginLeft="20dp" | android:layout_marginRight="20dp" | android:layout_marginBottom="20dp"
android: tip.
Properti ini memungkinkan teks ditampilkan di kontrol sebagai bantuan saat pengguna belum memasukkan informasi. (Lebih disukai daripada properti teks)
Contoh: android:hint="Masukkan nama"
android:tipemasukan.
Ini menentukan jenis input apa yang akan diizinkan untuk kotak teks, ini memungkinkan semacam validasi data dan juga memberi tahu sistem operasi jenis keyboard (virtual) apa yang akan digunakan.
Di antara opsi yang dapat kita kaitkan dengan properti ini adalah beberapa seperti:
- Teks
- nomor
- tekstur
- sandi teks
- telepon
- pertemuan
- Alamat Email Teks
Masih banyak pilihan lain yang bisa digunakan tergantung kebutuhan.
Contoh: android:inputType="angka" | android:inputType="textEmailAddress"
android:ukuranteks.
Menentukan ukuran teks yang akan ditampilkan di layar, unit pengukuran harus diperhitungkan di mana sp digunakan untuk teks
Contoh: android:textSize="25sp"
android:teks gaya.
Menentukan gaya untuk teks, mampu mendefinisikan teks sebagai normal, tebal, miring (atau keduanya).
Contoh: android:textStyle="tebal" | android:textStyle="miring" | android:textStyle="bold|miring"
android:textColor.
Menentukan warna untuk teks, dapat menambahkan warna dari file properti "warna" atau nilai heksadesimal
Contoh: android:textColor="@color/teal_700" | android:textColor="#9C27B0"
android:backgroundTint.
Menentukan warna latar belakang untuk komponen, Anda juga bisa mendapatkan warna dari properti "warna" atau nilai heksadesimal
Contoh: android:backgroundTint="@color/teal_200" | android:backgroundTint="#FF5722"
android:teks.
Mendefinisikan konten tekstual yang terkait dengan tampilan. Meskipun nilainya dapat diberikan secara langsung, sangat disarankan untuk menggunakan file string yang tersedia di folder sumber daya.
Contoh: android:text="Bienvenidos" | android:teks="@string/judul"
Properti ini umum dalam tampilan yang menampilkan teks di antarmuka perangkat. Layar berikut menunjukkan file sumber daya strings.xml di mana nilai yang berbeda untuk teks ditambahkan
dan nantinya nilai-nilai ini diakses dari tampilan
Setelah membersihkan properti sebelumnya, mari kita lihat komponen grafis dasar.
Tombol.
Ini sesuai dengan tombol dasar yang kita tahu, itu hanya menampilkan tombol dengan teks internal dan margin yang ditentukan.
Tombol tersebut akan memenuhi fungsi dasar menunggu acara saat ditekan.
tombol beralih
Jenis ToggleButton sesuai dengan jenis tombol yang dapat disimpan dalam 2 kemungkinan status, ditekan atau tidak ditekan, untuk ini tidak hanya satu properti teks yang ditentukan, tetapi 2 bergantung pada status yang dimilikinya saat ini, menggunakan properti dari android : textOn dan android:textOff.
Seperti tombol tradisional, ToggleButton dapat diprogram untuk merespons peristiwa klik, tetapi Anda mungkin hanya perlu mengetahui statusnya. Ini dapat dilakukan dengan menggunakan metode isChecked() , yang mengembalikan nilai true jika ditekan dan false sebaliknya.
perjalanan
Kontrol ini dapat mensimulasikan sakelar yang sangat mirip dengan cara kerja ToggleButton, tetapi dengan tampilan visual yang berbeda.
Ingatlah bahwa bergantung pada versi Android yang kita gunakan, tampilan visual komponen kita dapat berubah, dalam hal ini Switch controller untuk Android versi 5.0 dan lebih tinggi akan terlihat seperti ini:
ImageButton
Jenis tombol ini memungkinkan Anda menautkan gambar untuk ditampilkan kepada pengguna alih-alih teks seperti biasa, untuk ini kita dapat mengambil gambar dari folder /res/drawable dan memuatnya menggunakan properti android:src, dalam hal ini kita akan menggunakan gambar langsung dari sumber daya Android.
TextView
Ini sesuai dengan label teks dasar yang ditampilkan kepada pengguna, ini dalam bahasa lain dikenal sebagai label dan memungkinkan menampilkan teks yang terkait dengan properti android:text, label ini memiliki properti lain yang memungkinkan Anda memanipulasi ukuran, latar belakang warna, warna dan jenis font, gaya, dll.
menyunting teks
Tampilan Android EditText setara dengan ASP dan C# Textbox atau JAVA JTextField, ini adalah kontrol yang memungkinkan menangkap teks yang diketik oleh pengguna saat runtime.
kotak pilihan
Kontrol kotak centang digunakan untuk mencentang atau menghapus centang opsi dalam aplikasi. Cara mendefinisikannya di antarmuka dan properti yang tersedia untuk manipulasinya dengan kode serupa dengan yang dikomentari di kontrol ToogleButton.
Kontrol ini mewarisi dari kontrol TextView, jadi semua opsi pemformatan yang telah disebutkan untuk kontrol ini juga berlaku untuk kotak centang.
Dalam kode aplikasi, Anda dapat memeriksa apakah kontrol ini dipilih atau tidak melalui metode isChecked() yang mengembalikan nilai dari BENAR jika Anda dipilih atau PALSU jika tidak, Anda juga dapat menggunakan metode setChecked(value) untuk menyetel status tertentu untuk kontrol, di mana value BENAR akan untuk dipilih dan PALSU dengan tidak dipilih.
Peristiwa yang biasanya diprogram untuk kontrol ini dan dijalankan setiap kali statusnya berubah (dipilih / tidak dipilih) adalah onCheckedChanged.
tombol radio
Seperti kontrol CheckBox, RadioButton berfungsi untuk mencentang atau menghapus centang pada opsi yang diberikan, perbedaannya terletak pada jenis pemilihan yang ingin dibuat. RadioButtons biasanya digunakan dalam grup untuk menentukan serangkaian opsi yang hanya dapat Anda pilih satu, yaitu setiap opsi saling eksklusif, jadi saat memilih opsi, opsi yang dipilih sebelumnya akan otomatis tidak dicentang. Grup ini ditentukan oleh elemen RadioGroup, yang pada gilirannya akan berisi semua elemen RadioButton yang mewakili opsi.
RadioGroups dapat menyetel properti android:orientation ke "Vertikal" atau "Horizontal" untuk menentukan bagaimana RadioButtons di dalamnya akan diurutkan.
RadioButton, pada gilirannya, selain lebar dan tinggi, harus menentukan properti android:text untuk mengaitkan teks dari opsi yang diwakili dan android:id untuk mengaitkan kode ke kontrol sehingga dapat dimanipulasi dari logika aplikasi.
Untuk memanipulasi kontrol dari logika aplikasi, berbagai metode dapat digunakan, di antaranya kami temukan check(Aku akan pergi) yang digunakan untuk menyetel tombol radio yang teridentifikasi dengan id yang diteruskan sebagai parameter yang dipilih, metode clearCheck() digunakan untuk menghapus centang semua tombol radio dalam grup dan metode getCheckedRadioButtonId() digunakan untuk mendapatkan id dari radiobutton yang berada di dalam grup yang dipilih atau bernilai -1 jika tidak ada item yang dipilih.
Peristiwa terpenting dari kontrol ini juga adalah onCheckedChanged, yang dipicu saat elemen grup dipilih (ingat bahwa pemilihan elemen grup menunjukkan pembatalan pilihan yang lain).
Dan itu saja, ini adalah beberapa komponen grafis dasar yang akan kita gunakan sepanjang kursus, di postingan selanjutnya kita akan melanjutkan dengan komponen atau tata letak lainnya.
Mungkin juga menarik bagi Anda.
Apakah ada yang ingin Anda tambahkan atau komentari tentang entri ini? merasa bebas untuk melakukan….Dan jika Anda menyukainya... Saya mengundang Anda untuk berbagi y Berlanggananlah dengan mengeklik tombol "Bergabunglah dengan situs ini" untuk mendengar lebih banyak postingan seperti ini 😉