Lompat ke konten Lompat ke sidebar Lompat ke footer

Cara Membuat Aplikasi Kalkulator di Android Studio

Inilah panduan langkah demi langkah tips membuat aplikasi kalkulator sederhana di Android Studio - Halo kawan, jumpa lagi untuk belajar bahasa pemrograman Android menggunakan Android Studio. Apakah kamu pernah menggunakan kalkulator? Tentu saja Anda lakukan dalam kehidupan biasa Anda. Jadi mengapa tidak bikin Android App Kalkulator Anda sendiri di Android Studio dan menggunakannya untuk melakukan operasi tersebut.

Jika Anda tidak tahu bagaimana cara membangunnya maka Anda harus memperlakukannya saat kami membagikan bagaimana App dibuat di Android. Ini adalah salah satu App yang paling sederhana yang bisa Anda buat untuk memahami dasar-dasar Android.

Dalam tutorial pembuatan Aplikasi Kalkulator ini, kita akan menggunakan beberapa komponen Android UI untuk merancang dan langkah demi langkah mengembangkan aplikasi Kalkulator Dasar di Android Studio.

Elemen yang Digunakan Untuk Membuat Aplikasi Kalkulator diantaranya adalah EditText, TextView, Button &  Linear Layout. Juga melalui konsep JAVA OOPS satu kali.
Cara Membuat Aplikasi Kalkulator di Android Studio
Oke biar kamu lebih paham, sekarang mari kita mulai belajar membuat aplikasi Kalkulator sederhana di Android Studio. Alur programnya seperti ini:
  1. Program dijalankan.
  2. Menampilkan 2 kolom input text (Angka Pertama & Angka Kedua), dan Tombol operasi untuk Tambah, Kurang, Kali, Bagi dan Bersihkan.
  3. Memasukkan Angka Pertama & Angka Kedua kedalam kolom EditText / Input Text.
  4. Klik tombol operasi untuk mendapatkan hasil penjumlahan, pengurangan, perkalian, dan pembagian dan hasil akan di tampilkan pada text Hasil.
  5. Klik tombol Bersihkan – Membersihkan semua masukan / inputan.
  6. Ketika kolom belum di isi dan sudah menjalankan operasi tombol, maka akan menampilkan keterangan error dan perintah untuk melengkapi form pengisian.
  7. Selesai.
Bagaimana? Anda tertarik dengan aplikasi sederhana ini? Jika iya, mari kita belajar bersama.

Langkah-Langkah Membuat Aplikasi Kalkulator Sederhana di Android Studio

1. Buatlah project baru dengan nama “Kalkulator” – Lihat tutorial membuat project baru pada android studio di sini: Cara Membuat Project Baru di Android Studio.

2. Setelah itu silahkan buka activity_main.xml, klik mode Text, lalu 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:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="com.caratutorial.kalkulator.MainActivity">

    <Button
        android:text="+"
        android:layout_height="wrap_content"
        android:id="@+id/tambah"
        android:layout_below="@+id/angka_kedua"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true"
        android:layout_marginTop="18dp"
        android:layout_width="80dp" />

    <EditText
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:inputType="number"
        android:ems="10"
        android:id="@+id/angka_pertama"
        android:hint="Masukkan angka pertama"
        android:textSize="14sp"
        android:layout_below="@+id/textView5"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true"
        android:layout_marginTop="22dp" />

    <EditText
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:inputType="number"
        android:ems="10"
        android:layout_below="@+id/angka_pertama"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true"
        android:id="@+id/angka_kedua"
        android:hint="Masukkan angka kedua"
        android:textSize="14sp" />

    <TextView
        android:text="MASUKKAN DUA ANGKA"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/textView5"
        android:textAlignment="center"
        android:textStyle="normal|bold"
        android:textSize="24sp"
        android:layout_alignParentTop="true"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true" />

    <TextView
        android:text="0"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/hasil"
        android:layout_below="@+id/textView1"
        android:layout_centerHorizontal="true"
        android:textSize="36sp"
        android:textAlignment="center" />

    <TextView
        android:text="HASIl"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/textView1"
        android:textAlignment="center"
        android:textStyle="normal|bold"
        android:textSize="24sp"
        android:layout_marginTop="35dp"
        android:layout_below="@+id/bersihkan"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true" />

    <Button
        android:text="-"
        android:layout_height="wrap_content"
        android:id="@+id/kurang"
        android:layout_width="80dp"
        android:layout_alignBaseline="@+id/tambah"
        android:layout_alignBottom="@+id/tambah"
        android:layout_toRightOf="@+id/tambah"
        android:layout_toEndOf="@+id/tambah" />

    <Button
        android:text="BERSIHKAN"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/bersihkan"
        android:layout_below="@+id/tambah"
        android:layout_centerHorizontal="true" />

    <Button
        android:text="/"
        android:layout_height="wrap_content"
        android:id="@+id/bagi"
        android:layout_width="80dp"
        android:layout_above="@+id/bersihkan"
        android:layout_alignParentRight="true"
        android:layout_alignParentEnd="true" />

    <Button
        android:text="X"
        android:layout_height="wrap_content"
        android:id="@+id/kali"
        android:layout_width="80dp"
        android:layout_alignBaseline="@+id/bagi"
        android:layout_alignBottom="@+id/bagi"
        android:layout_toLeftOf="@+id/bagi"
        android:layout_toStartOf="@+id/bagi" />
</RelativeLayout>

Setelah memasukkan kode diatas, maka desain layout pada activity_main.xml akan menjadi seperti gambar dibawah ini.
Membuat Aplikasi Kalkulator di Android Studio
3. Setelah selesai mendesain tampilan aplikasi kita, sekarang kita buka MainActivity.java dan masukkan listing kode di bawah ini:
package com.caratutorial.kalkulator;

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

public class MainActivity extends AppCompatActivity {

    EditText angka_pertama, angka_kedua;
    Button tambah, kurang, kali, bagi, bersihkan;
    TextView hasil;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        angka_pertama = (EditText) findViewById(R.id.angka_pertama);
        angka_kedua = (EditText) findViewById(R.id.angka_kedua);

        tambah = (Button)findViewById(R.id.tambah);
        kurang = (Button)findViewById(R.id.kurang);
        kali = (Button)findViewById(R.id.kali);
        bagi = (Button)findViewById(R.id.bagi);
        bersihkan = (Button) findViewById(R.id.bersihkan);

        hasil = (TextView) findViewById(R.id.hasil);

        tambah.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                if((angka_pertama.getText().length()>0) && (angka_kedua.getText().length()>0))
                {
                    double angka1 = Double.parseDouble(angka_pertama.getText().toString());
                    double angka2 = Double.parseDouble(angka_kedua.getText().toString());
                    double result = angka1 + angka2;
                    hasil.setText(Double.toString(result));
                }
                else {
                    Toast toast = Toast.makeText(MainActivity.this, "Mohon masukkan Angka pertama & Kedua", Toast.LENGTH_LONG);
                    toast.show();
                }
            }
        });

        kurang.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                if((angka_pertama.getText().length()>0) && (angka_kedua.getText().length()>0))
                {
                    double angka1 = Double.parseDouble(angka_pertama.getText().toString());
                    double angka2 = Double.parseDouble(angka_kedua.getText().toString());
                    double result = angka1 - angka2;
                    hasil.setText(Double.toString(result));
                }
                else {
                    Toast toast = Toast.makeText(MainActivity.this, "Mohon masukkan Angka pertama & Kedua", Toast.LENGTH_LONG);
                    toast.show();
                }
            }
        });

        kali.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                if((angka_pertama.getText().length()>0) && (angka_kedua.getText().length()>0))
                {
                    double angka1 = Double.parseDouble(angka_pertama.getText().toString());
                    double angka2 = Double.parseDouble(angka_kedua.getText().toString());
                    double result = angka1 * angka2;
                    hasil.setText(Double.toString(result));
                }
                else {
                    Toast toast = Toast.makeText(MainActivity.this, "Mohon masukkan Angka pertama & Kedua", Toast.LENGTH_LONG);
                    toast.show();
                }
            }
        });

        bagi.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                if((angka_pertama.getText().length()>0) && (angka_kedua.getText().length()>0))
                {
                    double angka1 = Double.parseDouble(angka_pertama.getText().toString());
                    double angka2 = Double.parseDouble(angka_kedua.getText().toString());
                    double result = angka1 / angka2;
                    hasil.setText(Double.toString(result));
                }
                else {
                    Toast toast = Toast.makeText(MainActivity.this, "Mohon masukkan Angka pertama & Kedua", Toast.LENGTH_LONG);
                    toast.show();
                }
            }
        });

        bersihkan.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                angka_pertama.setText("");
                angka_kedua.setText("");
                hasil.setText("0");
                angka_pertama.requestFocus();
            }
        });
    }
}

4. 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 melalui USB untuk Run app Anda. Silahkan lihat: Cara Membuat Android Virtual Device (AVD) Emulator Android Studio.

DEMO APLIKASI

Setelah aplikasi di jalankan, hasilnya akan seperti gambar screenshot dibawah ini:
demo aplikasi kalkulator android sederhana 1
demo aplikasi kalkulator android sederhana 2
demo aplikasi kalkulator android sederhana 3
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.

Tutorial Video YouTube Belajar Membuat Aplikasi Kalkulator pada Android Studio.
- Proses uploading…

Saya juga membagikan file project aplikasi ini yang bisa kamu download melalui link berikut:
- Proses uploading…

Sekian tutorial tentang Membuat Aplikasi Kalkulator Sederhana di Android Studio. Silahkan di coba dan jika ada pertanyaan, silahkan tanyakan melalui kolom komentar.

Semoga bermanfaat…

9 komentar untuk "Cara Membuat Aplikasi Kalkulator di Android Studio"

  1. makaassiihh banyaakkk lagi butuh2nya nemu ini.. Tuhan Memberkati...

    BalasHapus
    Balasan
    1. Terimakasih doanya, semoga bermamfaat untuk Anda. Salam :)

      Hapus
  2. Aplikasi terhenti, dimana ya salahnya

    BalasHapus
  3. bagaimana menghilangkan angka 0 terakhir tersebut? apa yang harus di gant?

    BalasHapus
    Balasan
    1. Ganti pada activity_main.xml pada textview dengan id hasil, silahhkan dirubah android:text="0" menjadi android:text=""

      semoga membantu,,,

      Hapus
  4. mengapa setelah di run
    ada error di dimens.xml nya?

    BalasHapus
  5. bang error codingnya tulisannya " AAPT: error: resource dimen/activity_horizontal_margin (aka com.example.myapplication:dimen/activity_horizontal_margin) not found" kenapa ya ?

    BalasHapus
  6. bang error codingnya tulisannya " AAPT: error: resource dimen/activity_horizontal_margin (aka com.example.myapplication:dimen/activity_horizontal_margin) not found" kenapa ya ?

    BalasHapus