Tutorial Cara Membuat Image Button di Android Studio

Android Najwa - Selamat Malam, pada kesempatan kali ini saya akan memberikan sebuah materi dimana materi kali ini kita akan membahas display pada android. Ya, ini berhubungan dengan gambar yang ada pada aplikasi android. Pengen tahu apa itu? oke, tutorial kali ialah mengenai Cara Membuat Image Button di Aplikasi Android menggunakan Android Studio. biasanya anda pernah menemukan contoh dari Image Button ini. Seperti saat anda akan mengunduh suatu file kemudian ada tombol unduh. Nah seperti itu lah kira-kira gambarnya Sebelum membuat Image Button, mari kita simak penjelasan dari Image Button itu.

Image Button pada Aplikasi Android

Apa itu Image Button?

Pengertian Image Button

Image Button merupakan tombol yang dibuat dengan mengubah tombol objek tersebut menjadi sebuah gambar/icon. Image Button biasanya digunakan untuk mempermudah pengguna memahami tujuan dari tombol yang akan dipilih dan dapat ditampilkan sesuai aksinya.

Bagaimana cara membuat Image Button ?

Tutorial Cara Membuat Image Button di Android

Langkah 1 : Jalankan Android Studio.exe anda seperti biasa, lalu buatlah project baru seperti berikut.

• Application Name : Image Button
• Package Name : androidnajwa.com
• Minimum Required SDK : API 15 Andorid 4.0.3 (IceCreamSandwich)

Buat Project Baru

Langkah 2 :  Pilih saja Blank Activity lalu klik Next dan Finish

Add Activity

Langkah 3 : Untuk membuat antarmuka halaman utama (activity_main.xml) seperti diatas tadi dapat dilakukan dengan “Drag and Drop” dari komponen yang tersedia atau langsung menuliskan script XML. Untuk script XML dapat dituliskan seperti berikut.

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent"
    android:layout_height="match_parent" android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    android:paddingBottom="@dimen/activity_vertical_margin" tools:context=".MainActivity">

    <ImageButton
        android:id="@+id/imageButton1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="96dp"
        android:src="@drawable/ic_launcher" />


</RelativeLayout>

Untuk gambarnya saya membuat contoh gambar android dengan nama ic_launcer.png. Anda bisa mengganti dengan gambar yang lain. kemudian letakkan pada drawble di android studio.

Langkah 4 : Bukalah MainActivity.java lalu edit seperti berikut ini

 package com.androidnajwa.imagebutton;

import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.ImageButton;
import android.widget.Toast;

public class MainActivity extends Activity {
    ImageButton ib;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        ib = (ImageButton) findViewById(R.id.imageButton1);
        //membuat listener ketika objek di-klik
        OnClickListener listener = new OnClickListener() {
            @Override
            public void onClick(View v) {
                // TODO Auto-generated method stub
                Toast.makeText(MainActivity.this,
                        "Anda meng-klik ImageButton",
                        Toast.LENGTH_SHORT).show();
            }
        };
        //menerapkan listener pada objek ib
        ib.setOnClickListener(listener);
    }
}

Sampai tahap disini sudah selesai. Sekarang lakukan testing, dengan cara menekan Shift+F10.

(1) Hasil Image Button

Saat saya akan coba menekan button gambar Android, maka hasil yang akan tampil seperti berikut

(2) Hasil Image Button

Nah, itulah hasil dari penggunaan Image Button yang nanti nya akan muncul Toast yang berisi kata "Anda meng-klik ImageButton". Kita juga bisa membuatnya dengan aksi yang lain.

Gimana? Mudah Bukan? Untuk dikembangkan lagi juga bisa asal anda bisa memahaminya.

Demikian Tutorial Cara Membuat Image Button di Android Studio. Bila Ada Pertanyaan silakan komentar dihalaman Komentar.Terima Kasih Atas Kunjungan di Android Najwa.

Link Download Klik Disini

Catatan : Silakan Klik Gambar dibawah ini untuk mendapatkan Password RAR.

Tweet