Categories

How to build a Calculator app using Android Studio for Beginners

In this article we are going to create a calculator Android App using Android Studio. This application will perform the basic arithmetic operations like addition, subtraction, multiplication, division, and modulo.

Let’s get started

Step 1: Create a new project

  • Open a new android project and select Empty Activity and click on Next.
  • Give name as “Calculator” or whatever name you want.
  • Choose a file location and select language as Java and click on next.
  • Finally click on Finish.

Step 2: Designing the UI

In activity_main.xml remove the Hello World text and change the layout to LinearLayout.

<?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"
    android:orientation="vertical"
    tools:context=".MainActivity">
</LinearLayout>

Drag and drop the Plain Text into the UI

<EditText
        android:id="@+id/editText"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:ems="10"
        android:inputType="textPersonName"
        android:layout_marginBottom="1pt"
        android:layout_weight="1"
        android:background="@color/purple_200"
        android:gravity="right|center"
        android:textSize="40pt"
        android:textColor="@color/white"
        android:text="0" />

Now drag and drop the TableLayout into the UI design.

    <TableLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <TableRow
            android:layout_marginBottom="1pt"
            android:layout_width="match_parent"
            android:layout_height="match_parent">
            <Button
                android:id="@+id/buAc"
                android:text="AC"
                android:onClick="acEvent"
                android:layout_weight="1"
                android:layout_width="30pt"
                android:layout_height="30pt"
                android:layout_marginRight="1pt"
                android:background="@color/lightblack"
                ></Button>
            <Button
                android:id="@+id/buPlusMinus"
                android:text="+/-"
                android:onClick="numberEvent"
                android:layout_weight="1"
                android:layout_width="30pt"
                android:layout_height="30pt"
                android:layout_marginRight="1pt"
                android:background="@color/lightblack"
                ></Button>
            <Button
                android:id="@+id/buDivide"
                android:text="/"
                android:onClick="operatorEvent"
                android:layout_weight="1"
                android:layout_width="30pt"
                android:layout_height="30pt"
                android:layout_marginRight="1pt"
                android:background="@color/lightblack"
                ></Button>
            <Button
                android:id="@+id/buMulti"
                android:text="x"
                android:onClick="operatorEvent"
                android:layout_weight="1"
                android:layout_width="30pt"
                android:layout_height="30pt"
                android:layout_marginRight="1pt"
                android:background="@color/design_default_color_primary_dark"
                ></Button>

        </TableRow>

        <TableRow
            android:layout_marginBottom="1pt"
            android:layout_width="match_parent"
            android:layout_height="match_parent">
            <Button
                android:id="@+id/bu7"
                android:text="7"
                android:onClick="numberEvent"
                android:layout_weight="1"
                android:layout_width="30pt"
                android:layout_height="30pt"
                android:layout_marginRight="1pt"
                android:background="@color/lightblack"
                ></Button>
            <Button
                android:id="@+id/bu8"
                android:text="8"
                android:onClick="numberEvent"
                android:layout_weight="1"
                android:layout_width="30pt"
                android:layout_height="30pt"
                android:layout_marginRight="1pt"
                android:background="@color/lightblack"
                ></Button>
            <Button
                android:id="@+id/bu9"
                android:text="9"
                android:onClick="numberEvent"
                android:layout_weight="1"
                android:layout_width="30pt"
                android:layout_height="30pt"
                android:layout_marginRight="1pt"
                android:background="@color/lightblack"
                ></Button>
            <Button
                android:id="@+id/buPercentage"
                android:text="%"
                android:onClick="percentageEvent"
                android:layout_weight="1"
                android:layout_width="30pt"
                android:layout_height="30pt"
                android:layout_marginRight="1pt"
                android:background="@color/design_default_color_primary_dark"
                ></Button>

        </TableRow>
        <TableRow
            android:layout_marginBottom="1pt"
            android:layout_width="match_parent"
            android:layout_height="match_parent">
            <Button
                android:id="@+id/bu4"
                android:text="4"
                android:onClick="numberEvent"
                android:layout_weight="1"
                android:layout_width="30pt"
                android:layout_height="30pt"
                android:layout_marginRight="1pt"
                android:background="@color/lightblack"
                ></Button>
            <Button
                android:id="@+id/bu5"
                android:text="5"
                android:onClick="numberEvent"
                android:layout_weight="1"
                android:layout_width="30pt"
                android:layout_height="30pt"
                android:layout_marginRight="1pt"
                android:background="@color/lightblack"
                ></Button>
            <Button
                android:id="@+id/bu6"
                android:text="6"
                android:onClick="numberEvent"
                android:layout_weight="1"
                android:layout_width="30pt"
                android:layout_height="30pt"
                android:layout_marginRight="1pt"
                android:background="@color/lightblack"
                ></Button>
            <Button
                android:id="@+id/buPlus"
                android:text="+"
                android:onClick="operatorEvent"
                android:layout_weight="1"
                android:layout_width="30pt"
                android:layout_height="30pt"
                android:layout_marginRight="1pt"
                android:background="@color/design_default_color_primary_dark"
                ></Button>

        </TableRow>

        <TableRow
            android:layout_marginBottom="1pt"
            android:layout_width="match_parent"
            android:layout_height="match_parent">
            <Button
                android:id="@+id/bu1"
                android:text="1"
                android:onClick="numberEvent"
                android:layout_weight="1"
                android:layout_width="30pt"
                android:layout_height="30pt"
                android:layout_marginRight="1pt"
                android:background="@color/lightblack"
                ></Button>
            <Button
                android:id="@+id/bu2"
                android:text="2"
                android:onClick="numberEvent"
                android:layout_weight="1"
                android:layout_width="30pt"
                android:layout_height="30pt"
                android:layout_marginRight="1pt"
                android:background="@color/lightblack"
                ></Button>
            <Button
                android:id="@+id/bu3"
                android:text="3"
                android:onClick="numberEvent"
                android:layout_weight="1"
                android:layout_width="30pt"
                android:layout_height="30pt"
                android:layout_marginRight="1pt"
                android:background="@color/lightblack"
                ></Button>
            <Button
                android:id="@+id/buMuins"
                android:text="-"
                android:onClick="operatorEvent"
                android:layout_weight="1"
                android:layout_width="30pt"
                android:layout_height="30pt"
                android:layout_marginRight="1pt"
                android:background="@color/design_default_color_primary_dark"
                ></Button>

        </TableRow>

        <TableRow
            android:layout_marginBottom="1pt"
            android:layout_width="match_parent"
            android:layout_height="match_parent">
        <Button
            android:id="@+id/bu0"
            android:text="0"
            android:onClick="numberEvent"
            android:layout_weight="5"
            android:layout_width="46pt"
            android:layout_height="30pt"
            android:layout_marginRight="1pt"
            android:background="@color/lightblack"
            ></Button>
        <Button
            android:id="@+id/buDot"
            android:text="."
            android:onClick="numberEvent"
            android:layout_weight="4"
            android:layout_width="46pt"
            android:layout_height="30pt"
            android:layout_marginRight="1pt"
            android:background="@color/lightblack"
            ></Button>
        <Button
            android:id="@+id/buEqual"
            android:text="="
            android:onClick="equalEvent"
            android:layout_weight="1"
            android:layout_width="30pt"
            android:layout_height="30pt"
            android:layout_marginRight="1pt"
            android:background="@color/lightblack"
            ></Button>
        </TableRow>
    </TableLayout>

Copy the below code and paste it into the activity_main.xml

<?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"
    android:orientation="vertical"
    tools:context=".MainActivity">


    <EditText
        android:id="@+id/editText"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:ems="10"
        android:inputType="textPersonName"
        android:layout_marginBottom="1pt"
        android:layout_weight="1"
        android:background="@color/purple_200"
        android:gravity="right|center"
        android:textSize="40pt"
        android:textColor="@color/white"
        android:text="0" />

    <TableLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <TableRow
            android:layout_marginBottom="1pt"
            android:layout_width="match_parent"
            android:layout_height="match_parent">
            <Button
                android:id="@+id/buAc"
                android:text="AC"
                android:onClick="acEvent"
                android:layout_weight="1"
                android:layout_width="30pt"
                android:layout_height="30pt"
                android:layout_marginRight="1pt"
                android:background="@color/lightblack"
                ></Button>
            <Button
                android:id="@+id/buPlusMinus"
                android:text="+/-"
                android:onClick="numberEvent"
                android:layout_weight="1"
                android:layout_width="30pt"
                android:layout_height="30pt"
                android:layout_marginRight="1pt"
                android:background="@color/lightblack"
                ></Button>
            <Button
                android:id="@+id/buDivide"
                android:text="/"
                android:onClick="operatorEvent"
                android:layout_weight="1"
                android:layout_width="30pt"
                android:layout_height="30pt"
                android:layout_marginRight="1pt"
                android:background="@color/lightblack"
                ></Button>
            <Button
                android:id="@+id/buMulti"
                android:text="x"
                android:onClick="operatorEvent"
                android:layout_weight="1"
                android:layout_width="30pt"
                android:layout_height="30pt"
                android:layout_marginRight="1pt"
                android:background="@color/design_default_color_primary_dark"
                ></Button>

        </TableRow>

        <TableRow
            android:layout_marginBottom="1pt"
            android:layout_width="match_parent"
            android:layout_height="match_parent">
            <Button
                android:id="@+id/bu7"
                android:text="7"
                android:onClick="numberEvent"
                android:layout_weight="1"
                android:layout_width="30pt"
                android:layout_height="30pt"
                android:layout_marginRight="1pt"
                android:background="@color/lightblack"
                ></Button>
            <Button
                android:id="@+id/bu8"
                android:text="8"
                android:onClick="numberEvent"
                android:layout_weight="1"
                android:layout_width="30pt"
                android:layout_height="30pt"
                android:layout_marginRight="1pt"
                android:background="@color/lightblack"
                ></Button>
            <Button
                android:id="@+id/bu9"
                android:text="9"
                android:onClick="numberEvent"
                android:layout_weight="1"
                android:layout_width="30pt"
                android:layout_height="30pt"
                android:layout_marginRight="1pt"
                android:background="@color/lightblack"
                ></Button>
            <Button
                android:id="@+id/buPercentage"
                android:text="%"
                android:onClick="percentageEvent"
                android:layout_weight="1"
                android:layout_width="30pt"
                android:layout_height="30pt"
                android:layout_marginRight="1pt"
                android:background="@color/design_default_color_primary_dark"
                ></Button>

        </TableRow>
        <TableRow
            android:layout_marginBottom="1pt"
            android:layout_width="match_parent"
            android:layout_height="match_parent">
            <Button
                android:id="@+id/bu4"
                android:text="4"
                android:onClick="numberEvent"
                android:layout_weight="1"
                android:layout_width="30pt"
                android:layout_height="30pt"
                android:layout_marginRight="1pt"
                android:background="@color/lightblack"
                ></Button>
            <Button
                android:id="@+id/bu5"
                android:text="5"
                android:onClick="numberEvent"
                android:layout_weight="1"
                android:layout_width="30pt"
                android:layout_height="30pt"
                android:layout_marginRight="1pt"
                android:background="@color/lightblack"
                ></Button>
            <Button
                android:id="@+id/bu6"
                android:text="6"
                android:onClick="numberEvent"
                android:layout_weight="1"
                android:layout_width="30pt"
                android:layout_height="30pt"
                android:layout_marginRight="1pt"
                android:background="@color/lightblack"
                ></Button>
            <Button
                android:id="@+id/buPlus"
                android:text="+"
                android:onClick="operatorEvent"
                android:layout_weight="1"
                android:layout_width="30pt"
                android:layout_height="30pt"
                android:layout_marginRight="1pt"
                android:background="@color/design_default_color_primary_dark"
                ></Button>

        </TableRow>

        <TableRow
            android:layout_marginBottom="1pt"
            android:layout_width="match_parent"
            android:layout_height="match_parent">
            <Button
                android:id="@+id/bu1"
                android:text="1"
                android:onClick="numberEvent"
                android:layout_weight="1"
                android:layout_width="30pt"
                android:layout_height="30pt"
                android:layout_marginRight="1pt"
                android:background="@color/lightblack"
                ></Button>
            <Button
                android:id="@+id/bu2"
                android:text="2"
                android:onClick="numberEvent"
                android:layout_weight="1"
                android:layout_width="30pt"
                android:layout_height="30pt"
                android:layout_marginRight="1pt"
                android:background="@color/lightblack"
                ></Button>
            <Button
                android:id="@+id/bu3"
                android:text="3"
                android:onClick="numberEvent"
                android:layout_weight="1"
                android:layout_width="30pt"
                android:layout_height="30pt"
                android:layout_marginRight="1pt"
                android:background="@color/lightblack"
                ></Button>
            <Button
                android:id="@+id/buMuins"
                android:text="-"
                android:onClick="operatorEvent"
                android:layout_weight="1"
                android:layout_width="30pt"
                android:layout_height="30pt"
                android:layout_marginRight="1pt"
                android:background="@color/design_default_color_primary_dark"
                ></Button>

        </TableRow>

        <TableRow
            android:layout_marginBottom="1pt"
            android:layout_width="match_parent"
            android:layout_height="match_parent">
        <Button
            android:id="@+id/bu0"
            android:text="0"
            android:onClick="numberEvent"
            android:layout_weight="5"
            android:layout_width="46pt"
            android:layout_height="30pt"
            android:layout_marginRight="1pt"
            android:background="@color/lightblack"
            ></Button>
        <Button
            android:id="@+id/buDot"
            android:text="."
            android:onClick="numberEvent"
            android:layout_weight="4"
            android:layout_width="46pt"
            android:layout_height="30pt"
            android:layout_marginRight="1pt"
            android:background="@color/lightblack"
            ></Button>
        <Button
            android:id="@+id/buEqual"
            android:text="="
            android:onClick="equalEvent"
            android:layout_weight="1"
            android:layout_width="30pt"
            android:layout_height="30pt"
            android:layout_marginRight="1pt"
            android:background="@color/lightblack"
            ></Button>
        </TableRow>
    </TableLayout>
</LinearLayout>

After that the UI will look like this

Step 3: Working with Java file

Declare these variables,

    EditText et1;
    boolean isNewOp = true;
    String op = "+";
    String Oldval;

We have created five events and they are,

  • numberEvent
  • operatorEvent
  • equalEvent
  • acEvent
  • percentageEvent

numberEvent

This event will display the number when we click on the particular number,

public void numberEvent(View view) {
        if (isNewOp)
            et1.setText("");
        isNewOp = false;
        String number = et1.getText().toString();
        switch (view.getId()){
            case R.id.bu7:
                number += "7";
                break;
            case R.id.bu8:
                number += "8";
                break;
            case R.id.bu9:
                number += "9";
                break;
            case R.id.bu4:
                number += "4";
                break;
            case R.id.bu5:
                number += "5";
                break;
            case R.id.bu6:
                number += "6";
                break;
            case R.id.bu1:
                number += "1";
                break;
            case R.id.bu2:
                number += "2";
                break;
            case R.id.bu3:
                number += "3";
                break;
            case R.id.bu0:
                number += "0";
                break;
            case R.id.buDot:
                number += ".";
                break;
            case R.id.buPlusMinus:
                number = "-"+number;
                break;
        }

        et1.setText(number);

    }

operatorEvent

This event will perform mathematical operations when we click on the particular operator,

    public void operatorEvent(View view) {
        isNewOp = true;
        Oldval = et1.getText().toString();
        switch (view.getId()){
            case R.id.buDivide:
                op = "/";
                break;
            case R.id.buMulti:
                op = "*";
                break;
            case R.id.buPlus:
                op = "+";
                break;
            case R.id.buMuins:
                op = "-";
                break;
        }

    }

equalEvent

This event will give the result,

   public void equalEvent(View view) {
        String newNum = et1.getText().toString();
        double result = 0.0;
        switch (op){
            case "+":
                result = Double.parseDouble(Oldval) + Double.parseDouble(newNum);
                break;
            case "-":
                result = Double.parseDouble(Oldval) - Double.parseDouble(newNum);
                break;
            case "/":
                result = Double.parseDouble(Oldval) / Double.parseDouble(newNum);
                break;
            case "*":
                result = Double.parseDouble(Oldval) * Double.parseDouble(newNum);
                break;
        }
        et1.setText(result+"");
    }

acEvent

This event will clear the result,

    public void acEvent(View view) {
        et1.setText("0");
        isNewOp = true;
    }

percentageEvent

This event will gives the modulo result,

   public void percentageEvent(View view) {
        double no = Double.parseDouble(et1.getText().toString())/100;
        et1.setText(no +"");
        isNewOp = true;
    }

Now copy and paste the below code in MainActivity.java

package com.neuralbeast.calculator;

import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;
import android.view.View;
import android.widget.EditText;

public class MainActivity extends AppCompatActivity {

    EditText et1;
    boolean isNewOp = true;
    String op = "+";
    String Oldval;

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

        et1 = (EditText)findViewById(R.id.editText);
    }

    public void numberEvent(View view) {
        if (isNewOp)
            et1.setText("");
        isNewOp = false;
        String number = et1.getText().toString();
        switch (view.getId()){
            case R.id.bu7:
                number += "7";
                break;
            case R.id.bu8:
                number += "8";
                break;
            case R.id.bu9:
                number += "9";
                break;
            case R.id.bu4:
                number += "4";
                break;
            case R.id.bu5:
                number += "5";
                break;
            case R.id.bu6:
                number += "6";
                break;
            case R.id.bu1:
                number += "1";
                break;
            case R.id.bu2:
                number += "2";
                break;
            case R.id.bu3:
                number += "3";
                break;
            case R.id.bu0:
                number += "0";
                break;
            case R.id.buDot:
                number += ".";
                break;
            case R.id.buPlusMinus:
                number = "-"+number;
                break;
        }

        et1.setText(number);

    }

    public void operatorEvent(View view) {
        isNewOp = true;
        Oldval = et1.getText().toString();
        switch (view.getId()){
            case R.id.buDivide:
                op = "/";
                break;
            case R.id.buMulti:
                op = "*";
                break;
            case R.id.buPlus:
                op = "+";
                break;
            case R.id.buMuins:
                op = "-";
                break;
        }

    }

    public void equalEvent(View view) {
        String newNum = et1.getText().toString();
        double result = 0.0;
        switch (op){
            case "+":
                result = Double.parseDouble(Oldval) + Double.parseDouble(newNum);
                break;
            case "-":
                result = Double.parseDouble(Oldval) - Double.parseDouble(newNum);
                break;
            case "/":
                result = Double.parseDouble(Oldval) / Double.parseDouble(newNum);
                break;
            case "*":
                result = Double.parseDouble(Oldval) * Double.parseDouble(newNum);
                break;
        }
        et1.setText(result+"");
    }

    public void acEvent(View view) {
        et1.setText("0");
        isNewOp = true;
    }

    public void percentageEvent(View view) {
        double no = Double.parseDouble(et1.getText().toString())/100;
        et1.setText(no +"");
        isNewOp = true;
    }
}

Download Project

Download Full Project from GitHub:

Download From GitHub

More Reading

Post navigation

Leave a Comment

Leave a Reply

Your email address will not be published. Required fields are marked *