Button onClick Android Studio - Membuat Tombol Berfungsi saat di Klik

Halo kawan programmer, para artikel ini penulis akan membagikan sebuah tutorial sederhana bagaimana cara membuat Button onClick Events pada Android Studio. Setelah kemarin selesai membuat New Project untuk aplikasi pertama yang Anda buat di Android Studio kini saatnya kita belajar membuat tombol baru yang dapat melakukan fungsi tertentu pada saat di klik, jadi pada aplikasi yang kita buat tentu belum bisa melakukan aksi apapun karena belum ada kode untuk melakukan sebuah perintah pada saat di klik.

Seperti yang kita ketahui bahwa pada Android studio kita bisa menambahkan berbagai komponen seperti Widget, Text Fields (EditText), Layouts, Containers, Images & Media, Date & Time, Transitions, Custom Google, Design, AppCompat yang semuanya berada di dalam Palette Android Studio.
Button onClick Android Studio | Membuat Tombol Berfungsi saat di Klik
Namun setelah menambahkan semua itu, tentu masih hanya berupa tampilan biasa yang belum ada fungsi atau perintah apa yang kita inginkan. Nah, pada tulisan ini saya akan menjelaskan mengenai fungsi Button onClick Events.
Button onCLick events Android Studio

Untuk memberikan fungsi Button onClick bisa kita lakukan melalui menu Properties dan menginputkan variable pada kolom onClick seperti gambar di atas.

Alur Programnya seperti ini:
  1. Aplikasi dijalankan. 
  2. Menampilkan tombol Button. TextView tidak tampil karena di Invisible.
  3. Button di Klik.
  4. TextView tampil dan Menampilkan keterangan "Button telah di Klik".
  5. Selesai.

Bagaimana? Anda tertarik dengan aplikasi sederhana ini? Jika iya, mari kita belajar bersama. Tujuan dari tutorial ini adalah memberikan fungsi pada saat tombol di klik pada aplikasi kita.

Tutorial Button onCLick App Android Studio

1. Buka Android IDE yang Anda gunakan. Saya sendiri menggunakan Android Studio 2.2

2. Buatlah project baru dengan nama ButtonOnCLick – Lihat tutorial membuat project baru pada android studio disini: Cara Membuat Project Baru Aplikasi pada Android Studio.

3. Setelah membuat project baru silahkan buat desain layout pada activity_main.xml seperti gambar dibawah ini.
Design activity_main.xml Android Studio
Atau Anda bisa juga memasukkan listing kode berikut ke dalam file activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
   xmlns:android="http://schemas.android.com/apk/res/android"
   xmlns:tools="http://schemas.android.com/tools"
   android:id="@+id/activity_main"
   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="com.caratutorial.buttononclick.MainActivity">

    <Button
       android:text="Button"
       android:layout_width="match_parent"
       android:layout_height="wrap_content"
       android:onClick="ButtonOnClick"
       android:layout_alignParentTop="true"
       android:layout_alignParentStart="true" />

    <TextView
       android:layout_width="match_parent"
       android:layout_height="wrap_content"
       android:id="@+id/textView"
       android:textSize="24sp"
       android:textStyle="normal|bold"
       android:textAlignment="center"
       android:visibility="invisible"
       android:text="TextView"
       android:layout_marginTop="84dp"
       android:layout_below="@+id/button"
       android:layout_alignParentStart="true" />

</RelativeLayout>

Untuk memasukkan kode diatas, silahkan masuk ke mode Text seperti gambar dibawah
Text mode Android Studio

4. Setelah itu, silakan buka MainActivity.java dan masukkan listing kode di bawah ini:
package com.caratutorial.buttononclick;

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.TextView;

public class MainActivity extends AppCompatActivity {

    TextView textview;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        textview = (TextView) findViewById(R.id.textView);
    }

    public void ButtonOnClick(View V){
        textview.setText("Button telah di Klik");
        textview.setVisibility(View.VISIBLE);
    }
}

5. Simpan project Anda dan jalankan Aplikasi Anda dengan cara klik tombol Run atau melalui menu Run > Run ‘app’ kemudian memilih perangkat yang Anda gunakan. Anda bisa menggunakan Android Virtual Device (AVD) atau menggunakan ponsel Anda untuk Run app Anda. Silahkan lihat: Cara Membuat Android Virtual Device (AVD) Emulator Android Studio.

6. Setelah aplikasi di jalankan, hasilnya akan seperti gambar screenshot dibawah ini:
Demo App Button onCLick Android Studio
Selesai. Kamu juga bisa membuat desain sesuai versi kamu, atau bisa juga mengganti tulisan keterangan sesuai dengan yang kamu inginkan. Bagaimana? Sudah paham kan? Jika belum paham, silahkan lihat tutorial video Nya di bawah ini.

Jika kamu mengalami masalah seperti ini: Session ‘app’: Error Installing APK, silahkan lihat solusi untuk mengatasi masalah tersebut pada tutorial ini: [FIX] Solved Session ‘app’: Error While Installing APK Android Studio Project. Selesai!

Tutorial Video YouTube Belajar Membuat Aplikasi Android Button OnClick Android Events

Saya juga membagikan file project aplikasi ini yang bisa kamu download melalui link berikut:
DOWNLOAD PROJECT

Sekian tutorial tentang membuat fungsi OnClick pada Button di Android Studio. Silahkan di coba dan jika ada pertanyaan, silahkan tanyakan melalui kolom komentar.

Semoga bermanfaat…

Advertiser

* Tidak boleh mencantumkan URL apapun pada komentar.

* Tidak melakukan SPAM!

* Dan gunakan bahasa yang sopan dalam berkomentar.
Emoticon Emoticon