Home Android Studio Java Kalkulator : Script Membuat Aplikasi Kalkulator di Android Studio

Tuesday, December 11, 2018

Kalkulator : Script Membuat Aplikasi Kalkulator di Android Studio

Diterbitkan
Script membuat klakulator android di android studio part 1
Script Membuat Aplikasi Kalkulator di Android Studio -  artikel ini membahas bagaimana membuat sebuah kalkulator yang sederhana di aplikasi android studio, dimana script android ini bisa juga digunakan pada aplikasi atau editor Eclipse. Sama saja, tidak ada perbedannya. Artikel lain sudah ada dipostingkan contoh membuat kalkulator android di android studio. Ini adalah versi yang berbeda lagi dalam hal tampilannya. Jadi pada codingannya juga pasti beda. Jika anda penasaran monggo silahkan baca.

Baca : Membuat Kalkulator di Android Studio.

Pada pembahasan ini, ada yang perlu saya tekankan untuk membuat kalkulator diandroid studio ini ialah memahami programnya. Tidak hanya mencontoh atau istilah lainnya Copas. Ini penting untuk meningkatkan skill anda dalam membuat program sekaligus aplikasi melalui android studio atau eclipse sekalipun hanya aplikasi sederhana seperti pembahasan kita saat ini membuat kalkulator android dengan android studio.

Baiklah. Kita mulai membuat kalkulator dengan android studio.
Hal pertama ialah kita harus membuat atau meng-Create Project baru, jika memang sudah ada tinggal kita lanjutkan saja, namun jika anda bingung cara membuat project baru. Silahkan baca : Cara Membuat atau Create New Project di Android Studio.

Kemudian, pastikan untuk layout tetap seperti default yaitu activity_main.xml  dan pada javanya yaitu MainActivity biar nantinya anda tidak ribet merubah di codingannya.
Selanjutnya  Copas (Copy Paste) koding  activity_main.xml dibawah ini ke activity_main project anda.

Activity_main.xml

  1
  2
  3
  4
  5
  6
  7
  8
  9
 10
 11
 12
 13
 14
 15
 16
 17
 18
 19
 20
 21
 22
 23
 24
 25
 26
 27
 28
 29
 30
 31
 32
 33
 34
 35
 36
 37
 38
 39
 40
 41
 42
 43
 44
 45
 46
 47
 48
 49
 50
 51
 52
 53
 54
 55
 56
 57
 58
 59
 60
 61
 62
 63
 64
 65
 66
 67
 68
 69
 70
 71
 72
 73
 74
 75
 76
 77
 78
 79
 80
 81
 82
 83
 84
 85
 86
 87
 88
 89
 90
 91
 92
 93
 94
 95
 96
 97
 98
 99
100
101
102
103
<?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:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@drawable/anakit"
tools:context="id.anakit.kalkulatoranakit.MainActivity">

<EditText
    android:id="@+id/tv_num1"
    android:layout_width="260dp"
    android:layout_height="wrap_content"
    android:layout_alignParentTop="true"
    android:layout_centerHorizontal="true"
    android:layout_marginTop="16dp"
    android:hint="Masukkan Angka Pertama"
    android:inputType="number"
    android:textAlignment="center" />

<EditText
    android:id="@+id/tv_num2"
    android:layout_width="260dp"
    android:layout_height="wrap_content"
    android:layout_alignLeft="@+id/tv_num1"
    android:layout_alignStart="@+id/tv_num1"
    android:layout_below="@+id/tv_num1"
    android:layout_marginTop="17dp"
    android:hint="Masukkan Angka Kedua"
    android:inputType="number"
    android:textAlignment="center"
    android:layout_marginBottom="10dp"/>

<Button
    android:id="@+id/btn_tambah"
    android:layout_width="50dp"
    android:layout_height="52dp"
    android:layout_alignLeft="@+id/tv_num2"
    android:layout_below="@+id/tv_num2"
    android:text="+"
    android:textSize="24sp"
    style="@style/Base.Widget.AppCompat.Button.Colored"/>

<Button
    android:id="@+id/btn_kurang"
    style="@style/Base.Widget.AppCompat.Button.Colored"
    android:layout_width="50dp"
    android:layout_height="52dp"
    android:layout_below="@+id/tv_num2"
    android:layout_marginLeft="18dp"
    android:layout_marginStart="18dp"
    android:layout_toEndOf="@+id/btn_tambah"
    android:layout_toRightOf="@+id/btn_tambah"
    android:text="-"
    android:textSize="24sp" />

<Button
    android:id="@+id/btn_kali"
    style="@style/Base.Widget.AppCompat.Button.Colored"
    android:layout_width="50dp"
    android:layout_height="52dp"
    android:layout_alignTop="@+id/btn_kurang"
    android:layout_marginLeft="24dp"
    android:layout_marginStart="24dp"
    android:layout_toEndOf="@+id/btn_kurang"
    android:layout_toRightOf="@+id/btn_kurang"
    android:text="x"
    android:textSize="12sp" />

<Button
    android:id="@+id/btn_bagi"
    style="@style/Base.Widget.AppCompat.Button.Colored"
    android:layout_width="50dp"
    android:layout_height="52dp"
    android:layout_alignTop="@+id/btn_kali"
    android:layout_marginLeft="18dp"
    android:layout_marginStart="18dp"
    android:layout_toEndOf="@+id/btn_kali"
    android:layout_toRightOf="@+id/btn_kali"
    android:text="/"
    android:textSize="24sp" />

<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:id="@+id/result"
    android:layout_marginTop="10dp"
    android:text="Hasil"
    android:textSize="32sp"
    android:layout_below="@id/btn_tambah"
    android:layout_centerInParent="true"/>

<TextView
    android:id="@+id/tv_result"
    android:layout_width="250dp"
    android:layout_height="80dp"
    android:layout_below="@id/result"
    android:layout_marginTop="10dp"
    android:layout_centerInParent="true"
    android:text="0"
    android:textAlignment="center"
    android:textStyle="bold"
    android:textSize="32sp" />
</RelativeLayout>

Diatas adalah tampilan layout untuk kalkulator android yang akan kita buat, perhatikan pada bagian atas program ada script berikut : android:background="@drawable/anakit" ini berfungsi untuk memberikan gambar pada background dari aplikasi kalkulator nantinya. Jika anda tidak ingin repot, silahkan hapus saja codingan tersebut. tapi jika anda tertarik untuk menggantinya dengan gambar yang anda sukai sebagai background kalkulator, so monggo, anda harus memasukkan gambarnya ke drawable, kemudian nama gambar yang anda masukkan sebagai ganti “anakit”. 

Baca : Cara Memasukkan Gambar Ke Drawable di android studio

Kemudian perhatikan lagi script dibawahnya yaitu
tools:context="id.anakit.kalkulatoranakit.MainActivity">, nah ini penting untuk mengatasi tidak konek kepada pada package project anda. ganti “id.anakit.kalkulatoranakit” dengan package project anda. buka MainActivity.java, pada bagian atas merupakan package project anda.

Jadi tampilan script activity_main diatas tersebut akan memberikan tampilan seperti dibawah ini
Layout script membuat aplikasi kalkulator di android studio
 gambar tampilan layout aplikasi kalkulator android studio

Karna kebertulan saya berikan latar belaka kalkulator ialah logo anakit, so pasti agak berbeda sama yang anda buat, hehe.. hanya background saja.

selanjutnya kita beralih ke MainActiviyt.java, disinilah point yang paling penting, karena proses dari yang ada layout akan di eksekusi di MainActivity dari kalkulator android tersebut. 

anda buka MainActivity.java, kemudian copas script dibawah ini. 

Warning!!!.
Copasnya dari import android.support.v7.app.AppCompatActivity; kebawah. Packagenya gak perlu ikut. Jadi script yang ada di MainActiviy sebelumnya hapus semua kecuali package yang paling atas, karena package harus bawaan pada saat create new project.


MainActivity.java

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
package id.anakit.kalkulatoranakit;

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;

public class MainActivity extends AppCompatActivity {


    private Button tambah ,kurang, kali, bagi;
    private EditText tvNum1, tvNum2;
    private TextView resultTv;

    float numb1, numb2, result;

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

        tambah = findViewById(R.id.btn_tambah);
        kurang = findViewById(R.id.btn_kurang);
        kali= findViewById(R.id.btn_kali);
        bagi= findViewById(R.id.btn_bagi);

        tvNum1 = findViewById(R.id.tv_num1);
        tvNum2 = findViewById(R.id.tv_num2);
        resultTv = findViewById(R.id.tv_result);

        tambah.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                numb1 = Float.parseFloat(tvNum1.getText().toString());
                numb2 = Float.parseFloat(tvNum2.getText().toString());
                result = numb1 + numb2;
                resultTv.setText(""+result);

                tvNum1.setText("");
                tvNum2.setText("");
            }
        });

        kurang.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                numb1 = Float.parseFloat(tvNum1.getText().toString());
                numb2 = Float.parseFloat(tvNum2.getText().toString());
                result = numb1 - numb2;
                resultTv.setText(""+result);

                tvNum1.setText("");
                tvNum2.setText("");
            }
        });

        kali.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                numb1 = Float.parseFloat(tvNum1.getText().toString());
                numb2 = Float.parseFloat(tvNum2.getText().toString());
                result = numb1 * numb2;
                resultTv.setText(""+result);

                tvNum1.setText("");
                tvNum2.setText("");
            }
        });

        bagi.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                numb1 = Float.parseFloat(tvNum1.getText().toString());
                numb2 = Float.parseFloat(tvNum2.getText().toString());
                result = numb1 / numb2;
                resultTv.setText(""+result);

                tvNum1.setText("");
                tvNum2.setText("");
            }
        });
    }}
Hasil Dari aplikasi kalkulatornya seperti berikut ini
 
Hasil dari aplikasi membuat aplikasi kalkulator android di android studio
gambar hasil dari aplikasi android studio membuat kalkulator android

Agak semak ya karena logo background... hehehe gak masalah kan bisa anda ganti atau hapus nantinya.

jika anda tidak melakukan kesalahan pada panduan diatas, saya yakin tidak ada yang error. Anda tinggal menjalankan aplikasi kalkulator tersebut, bisa melalui emulator yang ada di android studio, bisa juga melalui hp android kamu biar lebih cepat proses buildnya.

Baca : Cara Run / Testing Project dari Android Studio di HP Android.

Jadi sekian pembahasan Script Membuat Kalkulator di Android Studio, semoga artikel ini bermanfaat dan berguna. Jika ada yang kurang jelas,silahkan hubungi contac admin atau melalui kolom komentar yang sudah tersedia. Terima kasih.

Artikel Terkait

Twin AnakIT

Next Post
Previous Post


EmoticonEmoticon

Subscribe to: Post Comments (Atom)