Simple Calculator App in Android Studio for Beginners
By: Nidhi Vanjare
Tags: Calculator, Android App Development, Begineers, Java, Ui Ux Design

We are going to design a simple functional calculator application which will perform simple arithmetic operations like addition , subtraction, multiplication and division.

Open android studio and start a new project with empty activity.

In activty_main.xml file we are going to design we have to build basic UI for the application. We will need 2 edit text fields to enter the numbers to operate on. 1 text field to display answer of the operation , 4 buttons for performing the operation and 1 for displaying the operation.

So lets design that….

<?xml version="1.0" encoding="utf-8"?>

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"

xmlns:app="http://schemas.android.com/apk/res-auto"

xmlns:tools="http://schemas.android.com/tools"

android:layout_width="match_parent"

android:layout_height="match_parent"

tools:context=".MainActivity"

android:padding="20dp"

android:orientation="vertical"

android:background="@color/pastel">



<TextView

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:text="CALCULATOR"

android:textSize="25sp"

android:layout_marginBottom="16dp"

android:textColor="@android:color/black" />



<LinearLayout

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:orientation="horizontal"

android:layout_marginBottom="20dp">



<EditText

android:id="@+id/first_no"

android:layout_width="102dp"

android:layout_height="59dp"

android:ems="10"

android:layout_marginHorizontal="50dp"

android:hint="Enter" />



<EditText

android:id="@+id/second_no"

android:layout_width="102dp"

android:layout_height="59dp"

android:ems="10"

android:hint="Enter" />



</LinearLayout>



<LinearLayout

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:orientation="horizontal"

android:layout_marginBottom="20dp">



<TextView

android:textSize="35sp"

android:id="@+id/answer"

android:layout_width="102dp"

android:layout_height="59dp"

android:layout_marginHorizontal="50dp"

android:hint="ans" />



</LinearLayout>



<LinearLayout

android:orientation="vertical"

android:layout_marginLeft="250dp"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_marginBottom="30dp">



<Button

android:id="@+id/sub"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:text="-"

android:textSize="25sp"

android:layout_marginBottom="16dp" />



<Button

android:id="@+id/add"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_marginBottom="16dp"

android:text="+"

android:textSize="25sp"

tools:ignore="OnClick" />



<Button

android:id="@+id/div"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:text="/"

android:textSize="25sp"

android:layout_marginBottom="16dp" />



<Button

android:id="@+id/mul"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_marginBottom="16dp"

android:text="X"

android:textSize="25sp"/>



<Button

android:id="@+id/equals"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_marginBottom="16dp"

android:text="="

android:textSize="35sp"/>

</LinearLayout>





</LinearLayout>

After designing the UI , In MainActivity.java file we will write java code to give actions to the elements in order to make our app functional. First we will make reference to our elements in the activity.

public class MainActivity extends AppCompatActivity {



EditText no1 , no2;

Button add ,mul ,div , sub,equal;

TextView answer; double ans = 0; // global variable



@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_main);



// for text views

no1 = findViewById(R.id.first_no);

no2 = findViewById(R.id.second_no);



// for button with operations

add = findViewById(R.id.add);

mul = findViewById(R.id.mul);

div = findViewById(R.id.div);

sub = findViewById(R.id.sub);



// for equal to button

equal = findViewById(R.id.equals);



// for answer field

answer = findViewById(R.id.answer);

}

}

We will create a global double ans variable inside mainactivity class and initialize it to zero.

Now we will make onClickListner to invoke a callback when a view (in this case button) is clicked and do something. In our case we need 4 onClickListner for our operations and 1 to display the answer.

add.setOnClickListener(new View.OnClickListener() {

@Override

public void onClick(View v) {

double a = Double.parseDouble(no1.getText().toString());

double b = Double.parseDouble(no2.getText().toString());

ans = a +b;

}

});



sub.setOnClickListener(new View.OnClickListener() {

@Override

public void onClick(View v) {

double a = Double.parseDouble(no1.getText().toString());

double b = Double.parseDouble(no2.getText().toString());

ans = a - b;

}

});



mul.setOnClickListener(new View.OnClickListener() {

@Override

public void onClick(View v) {

double a = Double.parseDouble(no1.getText().toString());

double b = Double.parseDouble(no2.getText().toString());

ans = a*b;

}

}); div.setOnClickListener(new View.OnClickListener() {

@Override

public void onClick(View v) {

double a = Double.parseDouble(no1.getText().toString());

double b = Double.parseDouble(no2.getText().toString());

ans = a/b;

}

});



equal.setOnClickListener(new View.OnClickListener() {

@Override

public void onClick(View v) {

String ans1 = String.valueOf(ans);

answer.setText(ans1);

ans= 0;

}

});

The entered numbers in the edit text have to be first converted to double (use double variable as answer can also be a decimal value) variable to perform operations on them. In order to display the answer in text view we have to convert the ans variable which is in int to String.

There is still a problem if you run this code. When we to division operation by 0 the app stops working in order to avoid that we have to display a message using Toast widget.

div.setOnClickListener(new View.OnClickListener() {

@Override

public void onClick(View v) {

double a = Double.parseDouble(no1.getText().toString());

double b = Double.parseDouble(no2.getText().toString());

if(b!=0)

ans = a/b;

else

Toast.makeText(getApplicationContext(),"Enter Valid Numbers",Toast.LENGTH_SHORT).show();

}

});

If both the numbers are not entered then the app will crash so we have add condition for that :

add.setOnClickListener(new View.OnClickListener() {

@Override

public void onClick(View v) {

String num1 = no1.getText().toString();

String num2 = no2.getText().toString();



if (num1.isEmpty() || num2.isEmpty()) {

Toast.makeText(getApplicationContext(),"Enter Numbers",Toast.LENGTH_SHORT).show();

}

else {

double a = Double.parseDouble(no1.getText().toString());

double b = Double.parseDouble(no2.getText().toString());

ans = a + b;

}

}

});

This is how MainActivity.java file we look :

package com.example.calculator;



import androidx.appcompat.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 no1 , no2;

Button add ,mul ,div , sub,equal;

TextView answer;

double ans = 0;



@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_main);







// for text views

no1 = findViewById(R.id.first_no);

no2 = findViewById(R.id.second_no);



// for button with operations

add = findViewById(R.id.add);

mul = findViewById(R.id.mul);

div = findViewById(R.id.div);

sub = findViewById(R.id.sub);



// for equal to button

equal = findViewById(R.id.equals);



// for answer field

answer = findViewById(R.id.answer);



add.setOnClickListener(new View.OnClickListener() {

@Override

public void onClick(View v) {

String num1 = no1.getText().toString();

String num2 = no2.getText().toString();



if (num1.isEmpty() || num2.isEmpty()) {

Toast.makeText(getApplicationContext(),"Enter Numbers",Toast.LENGTH_SHORT).show();

}

else {

double a = Double.parseDouble(no1.getText().toString());

double b = Double.parseDouble(no2.getText().toString());

ans = a + b;

}

}

});



sub.setOnClickListener(new View.OnClickListener() {

@Override

public void onClick(View v) {

String num1 = no1.getText().toString();

String num2 = no2.getText().toString();



if (num1.isEmpty() || num2.isEmpty()) {

Toast.makeText(getApplicationContext(),"Enter Numbers",Toast.LENGTH_SHORT).show();

}

else {

double a = Double.parseDouble(no1.getText().toString());

double b = Double.parseDouble(no2.getText().toString());

ans = a - b;

}

}

});



mul.setOnClickListener(new View.OnClickListener() {

@Override

public void onClick(View v) {

String num1 = no1.getText().toString();

String num2 = no2.getText().toString();



if (num1.isEmpty() || num2.isEmpty()) {

Toast.makeText(getApplicationContext(),"Enter Numbers",Toast.LENGTH_SHORT).show();

}

else {

double a = Double.parseDouble(no1.getText().toString());

double b = Double.parseDouble(no2.getText().toString());

ans = a * b;

}

}

});



div.setOnClickListener(new View.OnClickListener() {

@Override

public void onClick(View v) {

String num1 = no1.getText().toString();

String num2 = no2.getText().toString();



if (num1.isEmpty() || num2.isEmpty()) {

Toast.makeText(getApplicationContext(), "Enter Numbers", Toast.LENGTH_SHORT).show();

} else {

double a = Double.parseDouble(no1.getText().toString());

double b = Double.parseDouble(no2.getText().toString());

if (b != 0)

ans = a / b;

else

Toast.makeText(getApplicationContext(), "Enter Valid Numbers", Toast.LENGTH_SHORT).show();

}

}

});



equal.setOnClickListener(new View.OnClickListener() {

@Override

public void onClick(View v) {

String ans1 = String.valueOf(ans);

answer.setText(ans1);

ans= 0;

}

});



}

}

Now we have simple functional calculator application.

Thank You , Happy Coding !