Pada gambar diatas adalah hasil dari pembuatan Kalkulator Sederhana menggunakan Android Studio. Langsung saja pada tutorialnya :
Jika kalian ingin membuatnya anda bisa menggunakan sebagai berikut :
- Android IDE (Bisa menggunakan Eclipse+ADT atau mengguankan Android Studio). Untuk turorial ini menggunakan Android Studio.
- AVD atau Device dalam mode Debugging
Langkah pertama buatlah tampilannya terlebih dahulu seperti gambar dibawah ini :
Untuk source codenya ada dibawah ini :
<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">
<EditText
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:inputType="number"
android:ems="10"
android:id="@+id/masukan1"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_alignBottom="@+id/operan"
android:layout_toLeftOf="@+id/operan"
android:layout_toStartOf="@+id/operan"
android:onClick="clearInput1" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceLarge"
android:text=" "
android:id="@+id/operan"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:textSize="40dp"
android:gravity="center" />
<EditText
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:inputType="number"
android:ems="10"
android:id="@+id/masukan2"
android:layout_alignParentTop="true"
android:layout_toEndOf="@+id/operan"
android:layout_alignBottom="@+id/operan"
android:layout_toRightOf="@+id/operan"
android:onClick="clearInput2" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text=" Hitung! "
android:id="@+id/hitung"
android:layout_below="@+id/masukan1"
android:layout_centerHorizontal="true"
android:onClick="klikHasil" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="Operasi"
android:id="@+id/textView2"
android:layout_below="@+id/hitung"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text=" + "
android:id="@+id/tambah"
android:layout_below="@+id/textView2"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:onClick="klikTambah" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text=" - "
android:id="@+id/kurang"
android:layout_alignTop="@+id/tambah"
android:layout_toRightOf="@+id/tambah"
android:layout_toEndOf="@+id/tambah"
android:onClick="klikKurang" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text=" x "
android:id="@+id/kali"
android:layout_alignTop="@+id/kurang"
android:layout_toRightOf="@+id/kurang"
android:layout_toEndOf="@+id/kurang"
android:onClick="klikKali" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text=" : "
android:id="@+id/bagi"
android:layout_alignTop="@+id/kali"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true"
android:onClick="klikBagi" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="Hasil Perhitungan"
android:id="@+id/textView3"
android:layout_below="@+id/tambah"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true" />
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceLarge"
android:text="0"
android:id="@+id/hasil"
android:layout_centerVertical="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_alignRight="@+id/bagi"
android:layout_alignEnd="@+id/bagi"
android:gravity="right" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/notifikasi"
android:layout_below="@+id/hasil"
android:layout_centerHorizontal="true"
android:layout_marginTop="72dp"
android:gravity="center"
android:text="Simple Calculator Ready" />
</RelativeLayout>
Kemudian untuk javanya, kita akan membuat beberapa metode, variable, object dan seluruh elemen yang dibutuhkan untuk menghandling seluruh aktivitas yang ada di layout yang sudah kita buat tadi.
1. IMPORT CLASS YANG DIBUTUHKAN
2. Class MainActivity yang mengextend Activity
3. Menginstansiasi Objek dan Variable
4. Method on Create
5. Method klikTambah
6. Method klikKurang
7. Method klikKali
8. Method klikBagi
9. Method klikHasil
10. Method clearInput1
11. Method clearInput2
Gabungkan seluruhnya dalam satu file java. Jika masih bingung juga, berikut ini adalah kode lengkap dari jAVA yang kita buat untuk menghandle aktivitas di layout.
package simplecalculator.milandro.com.simplecalculator;
import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.TextView;
public class MainActivity extends Activity {
//R.1
TextView input1, input2, operator, result, notif;
Button btHitung, btJumlah, btKurang, btKali, btBagi;
//V.1
private int operation = 0;
private double HasilAkhir = 0.0;
private String Cek1 = "";
private String Cek2 = "";
//M.1
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
//R.2
input1 = (TextView) findViewById(R.id.masukan1);
input2 = (TextView) findViewById(R.id.masukan2);
operator = (TextView) findViewById(R.id.operan);
result = (TextView) findViewById(R.id.hasil);
notif = (TextView) findViewById(R.id.notifikasi);
//R.3
btHitung = (Button) findViewById(R.id.hitung);
btJumlah = (Button) findViewById(R.id.tambah);
btKurang = (Button) findViewById(R.id.kurang);
btKali = (Button) findViewById(R.id.kali);
btBagi = (Button) findViewById(R.id.bagi);
}
//M.2
public void klikTambah(View V){
operation = 1;
operator.setText(" + ");
}
//M.3
public void klikKurang(View V){
operation = 2;
operator.setText(" - ");
}
//M.4
public void klikKali(View V){
operation = 3;
operator.setText(" x ");
}
//M.4
public void klikBagi(View V){
operation = 4;
operator.setText(" : ");
}
//M.5
public void klikHasil(View V){
Cek1 = input1.getText().toString();
Cek2 = input1.getText().toString();
if((Cek1.equalsIgnoreCase("")) || (Cek2.equalsIgnoreCase(""))){
notif.setText("Kolom tidak boleh kosong");
}
else{
double inputA = Double.parseDouble(input1.getText().toString());
double inputB = Double.parseDouble(input2.getText().toString());
//D.1
switch(operation){
case 1:
HasilAkhir = inputA + inputB;
break;
case 2:
HasilAkhir = inputA - inputB;
break;
case 3:
HasilAkhir = inputA * inputB;
break;
case 4:
HasilAkhir = inputA / inputB;
break;
case 0:
notif.setText("Harap pilih operan terlebih dahulu!");
break;
default:
notif.setText("Undescribeable Error!");
break;
}
//D.2
if(operation < 1){
result.setText("0");
}
else{
String hasilString = String.valueOf(HasilAkhir);
result.setText(hasilString);
notif.setText("Simple Calculator Ready!");
}
}
}
//M.6
public void clearInput1(View V){
input1.setText("");
notif.setText("Simple Calculator Ready!");
operation = 0;
}
//M.7
public void clearInput2(View V){
input2.setText("");
notif.setText("Simple Calculator Ready!");
operation = 0;
}
}
HASIL KODING (APLIKASI JADI)
Tampilan awal aplikasi
Notifikasi muncul ketika Tombol “Hitung” ditekan, namun salah satu, atau kedua kolom masih kosong.
Hasil keluar setelah tombol “Hitung” ditekan.
