Senin, 20 Maret 2017

Membuat "Relative Layout" Menggunakan Android Studio

1. Buka android studio anda, dan akan muncul tampilan seperti berikut.



2. Kemudian buatlah sebuah project baru. Disini saya membuat project baru dengan nama "Layout Saya", seperti gambar berikut, kemudian klik "Next".



3.  Kemudian pilihlah tipe Android yang akan digunakan,. Dalam memilih tipe android, API yang digunakan harus sesuai dengan Emulator yang kita gunakan. Disini saya menggunakan "API17 Android 4.2 (Jelly Bean)", seperti gambar berikut dan klik "Next".



4. Kemudian pilihlah "Empty Activity", klik "Next".



5. Kemudian akan tampil tampilan "MainActivity" seperti berikut, Klik "Next".



6. Kemudian akan tampak tampilan Design seperti gambar.



7. Ubahlah text "Hello Word" sesuai dengan yang anda inginkan.



8. Kemudian ubahlah "ID" pada text tersebut.



9. Kemudian klik "View all properties" pada bagian kanan bawabh tampilan.



10. Pada menu ini kita akan mengedit text yang telah kita buat (lihat tampilan sebelah kanan),



11. Pertama, kita akan mengubah ukuran text dengan menu "textSize" tampak  seperti gambar berikut.



12. Kedua, kita akan mengubah posisi text dengan menu "textAligment" seperti gambar berikut.



13. Ketiga, kita akan mengubah warna pada text dengan menu "textColor" seperti gambar berikut.



14. Setelah dipilih menu "textColor" kemudian klik dan pilih menu "color" pada tampilan berikut. Kemudian klik "OK".

15. Selanjutnya kita akan menambahkan "Button" pada bagian bawah text




16. Kemudian ubahlah bagian "ID" button dan "Layout_width" menjadi "macth_parent" dan menu "Layout_height" menjadi "match-parent"(lihat bagian sebelah kanan atas pada gambar). Kemudian akan terlihat ukuran tampilan "Button" tadi seperti gambar berikut.



17. Kemudian ubahlah text pada "Button" sesuai yang diinginkan.



18. Selanjutnya kita akan mengubah wrna background pada tampilan button. Caranya yaitu klik menu "Backround" pada bagian properties, tampak seperti gambar berikut.



19. Kemudian klik menu "Background" dan akan muncul tampilan gambar, dan pilih  menu "Color", kemudian pilihlah warna yang kita inginkan seperti berikut. Kemudian klik "OK",

20. Selanjutnya akan tampak hasil tampilannya seperti gambar berikut.



21. Selanjutnya untuk menjalankan pada Emulatornya klik menu "Run", dan bukalah emulator Android Studio anda, dan tampak tampilannya seperti gambar berikut.



Sekian Tutorial dalam membuat "Relative Layout".
Semoga Bermanfaat ^-^
Thank You

Tidak ada komentar:

Posting Komentar