Membuat Komponen Button Image di Android Studio - Naskahkode

 



Hai Sobat naskahkode,kemarin kita membahas mengenai  project mempelajari Edit Text untuk pembuatan form, kini kita mencoba untuk Membuat Komponen Button Image di Android Studio.

Syaratnya, Kamu harus mengikuti langkah langkah pembuatan yang benar. Berikut ini kami akan membagikan Cara Membuat Komponen Button Image di Android Studio

Persiapan

  1. Install Android Studio – Sebelum kamu membuat sebuah aplikasi Android, Kamu harus menginstall software Android Studio. Melalui langkah ini untuk menginstall Android Studio di linux manjaro. 
  2.  Spesifikasi Laptop – Spesifikasi yang dibutuhkan adalah RAM minimal 4GB. Yang direkomendasikan 8GB RAM, dan tambahan 1GB untuk menjalankan Emulator Android.

Praktik

1. Buka Aplikasi Android studio , bisa lewat terminal atau app manager

2. Tampilan Awal Android Studio

Disini merupakan tampilan awal ketika kamu membuka aplikasi android studio ,terdapat bebrapa pilihan , kamu harus klik menu start a new Android Studio Project untuk membuat aplikasi baru

3. Memilih Template Projek

Terdapat beberapa template default projek android studio, disini kita akan memakai template empty Activity

4. Mengonfigurasi projek

Terdapat beberapa konfigurasi untuk projek kamu , diantaranya
  • Application Name : Merupakan nama untuk aplikasi yang akan kalian bangun (Huruf pertama usahakan huruf kapital).
  • PackageName : Merupakan alamat Website kalian atau perusahaan atau yang lainnya, jika tidak ada bisa diisi sesukanya saja, yang pasti harus diisi.Package name ini tidak boleh sama dengan aplikasi lain yang akan anda buat nantinya.
  • SaveLocation : Merupakan lokasi dimana Project yang kalian bangun akan di simpan.
  • Language : Bahasa pemrograman yang akan di pergunakan untuk membuat aplikasi, anda bisa memilih Bahasa Java atau Kotlin


5. Menambahkan Element pada tab desain

A. Menambahkan Button  dapat dilakukan dengan cara beri pallete dengan men drag ke lembar kerja
 




 
B. Atau bisa dengan mengedit source code nya langsung dengan mengaktifkan menu Split atau Code di pojok kanan atas , dengan script dibawah ini 
Perhatikan text yg warna putih , saya sarankan agar di samakan tiap ID nya ,untuk meminimalisir terjadinya error., untuk menambahkan button , sintaknya cukup sederhana yakni <Button />
 
<Button
android:id="@+id/button"

android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="5dp"
android:background="#298089"
android:textColor="#FFFFFF"
android:text="TOMBOL LOGIN"/>

 

6. Menambahkan gambar

A. Siapkan gambar nya terlebih dahulu.
B. Jika sudah siap kita copy gambar pada folder foto yang kita simpan,sebagai contoh lihat gambar berikut:


Lebih disarankan agar jenis gambar berformat .png jika tidak maka akan gagal ketika di run/build apk

C. Kemudian buka project android studio lalu klik app-klik res-klik kanan pada drawable lalu di paste.



D. paste berinama untuk menyimpan gambar pada folder drawable pada android studio lalu klik ok.




E. jika sudah masuk bagian editor , lalu masukan beri pallete dengan men drag widget image Button dan Image View

F. akan muncul popup pilihan resource , pilih gambar yang akan di pakai

G. Atur posisi gambar sesuai keinginan , agar lebih rapih ,atur margin , dengan cara klik kanan di gambar 

H. Hingga poto tersebut rapih , seperti dibawah ini

 

I. Atau bisa dengan mengedit source code nya langsung dengan mengaktifkan menu Split atau Code di pojok kanan atas , dengan script dibawah ini 
Perhatikan text yg warna putih , saya sarankan agar di samakan tiap ID nya ,untuk meminimalisir terjadinya error.
 
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context=".MainActivity">


<Button
android:id="@+id/button"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="5dp"
android:background="#298089"
android:textColor="#FFFFFF"
android:text="TOMBOL LOGIN"/>

<ImageButton
android:id="@+id/myImageButton"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:src="@mipmap/ic_launcher"/>

<ImageView
android:id="@+id/myImageButton2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:src="@drawable/drawing"/>
</LinearLayout>
 
 
 
 

8. Menjalankan Project

A. Memilih avd manager
 

B. Jika belum punya ,klik create new virtual drive untuk membuat virtual drive baru  , jika sudah punya skip ke urutan E
C. Memilih jenis device untuk virtual drive nya
D. Download terlebih dahulu ,sesuaikan dengan level API yang dibutuhkan , disini saya menggunakan android Nougat
E. Jika sudah terdonwload / sudah ada ,klik tombol play untuk memulai dan menjalankan virtual drive nya
F. Virtual drive yang telah berjalan akan tampil seperti ini

G.Run projet busa dengan klik tombol play atau shorcut SHIFT + F10

H. Jika tidak ada error , maka virtual decive akan menampikan hasil dari proram kita
 



I. Selesai


Sekian artikel dari saya , semoga bermanfaat :)