How to Build a Simple Calculator App in Android Studio (Java)
In this post, we’ll walk through the steps to create a basic calculator app in Android Studio using Java. This calculator will handle basic arithmetic operations and also include a "Clear" button to reset the calculator. Additionally, we’ll use a custom button style to ensure consistent formatting across all buttons.
Step 1: Create a New Project
Open Android Studio, create a new project, and name it SimpleCalculator. Choose an Empty Activity template.
Step 2: Add the `CalculatorButton` Style
Before updating the layout, let's create a custom style for our calculator buttons. In your styles.xml file, add the following style to ensure all buttons have consistent padding, size, and margin.
<!-- Calculator button style -->
<style name="CalculatorButton">
<item name="android:layout_width">0dp</item>
<item name="android:layout_height">wrap_content</item>
<item name="android:layout_columnWeight">1</item>
<item name="android:layout_rowWeight">1</item>
<item name="android:textSize">24sp</item>
<item name="android:layout_margin">4dp</item>
<item name="android:background">?android:attr/selectableItemBackground</item>
</style>
Step 3: Update the Layout (XML)
In the activity_main.xml file, we’ll create a layout for the calculator, including buttons for numbers, operators, and the clear button, applying the `CalculatorButton` style we just created.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:gravity="center"
android:background="#0A6056"
android:padding="16dp">
<TextView
android:id="@+id/resultText"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="0"
android:textSize="32sp"
android:gravity="end"
android:padding="16dp"
android:background="#EEEEEE"/>
<GridLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:rowCount="5"
android:columnCount="4"
android:padding="8dp"
android:layout_marginTop="16dp"
android:layout_marginBottom="16dp">
<!-- Row 1 -->
<Button android:text="7" android:id="@+id/button7" style="@style/CalculatorButton"/>
<Button android:text="8" android:id="@+id/button8" style="@style/CalculatorButton"/>
<Button android:text="9" android:id="@+id/button9" style="@style/CalculatorButton"/>
<Button android:text="/" android:id="@+id/buttonDivide" style="@style/CalculatorButton"/>
<!-- Row 2 -->
<Button android:text="4" android:id="@+id/button4" style="@style/CalculatorButton"/>
<Button android:text="5" android:id="@+id/button5" style="@style/CalculatorButton"/>
<Button android:text="6" android:id="@+id/button6" style="@style/CalculatorButton"/>
<Button android:text="*" android:id="@+id/buttonMultiply" style="@style/CalculatorButton"/>
<!-- Row 3 -->
<Button android:text="1" android:id="@+id/button1" style="@style/CalculatorButton"/>
<Button android:text="2" android:id="@+id/button2" style="@style/CalculatorButton"/>
<Button android:text="3" android:id="@+id/button3" style="@style/CalculatorButton"/>
<Button android:text="-" android:id="@+id/buttonSubtract" style="@style/CalculatorButton"/>
<!-- Row 4 -->
<Button android:text="0" android:id="@+id/button0" style="@style/CalculatorButton"/>
<Button android:text="." android:id="@+id/buttonDot" style="@style/CalculatorButton"/>
<Button android:text="=" android:id="@+id/buttonEqual" style="@style/CalculatorButton"/>
<Button android:text="+" android:id="@+id/buttonAdd" style="@style/CalculatorButton"/>
<!-- Clear Button -->
<Button
android:id="@+id/buttonClear"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:text="C"
android:textSize="24sp"
android:layout_margin="4dp"/>
</GridLayout>
</LinearLayout>
Step 4: Java Code for Functionality
Next, we'll add Java code in the MainActivity.java file to handle button clicks and perform the calculations. We'll also include the Clear button functionality to reset the input and result.
package com.example.simplecalculator;
import androidx.appcompat.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.TextView;
public class MainActivity extends AppCompatActivity {
private TextView resultText;
private String currentInput = "";
private double firstNumber = 0.0;
private String operator = "";
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
resultText = findViewById(R.id.resultText);
setNumericButtonClickListener();
setOperatorButtonClickListener();
findViewById(R.id.buttonClear).setOnClickListener(v -> {
currentInput = "";
firstNumber = 0.0;
operator = "";
resultText.setText("0");
});
}
private void setNumericButtonClickListener() {
View.OnClickListener listener = v -> {
Button button = (Button) v;
currentInput += button.getText().toString();
resultText.setText(currentInput);
};
findViewById(R.id.button0).setOnClickListener(listener);
findViewById(R.id.button1).setOnClickListener(listener);
findViewById(R.id.button2).setOnClickListener(listener);
findViewById(R.id.button3).setOnClickListener(listener);
findViewById(R.id.button4).setOnClickListener(listener);
findViewById(R.id.button5).setOnClickListener(listener);
findViewById(R.id.button6).setOnClickListener(listener);
findViewById(R.id.button7).setOnClickListener(listener);
findViewById(R.id.button8).setOnClickListener(listener);
findViewById(R.id.button9).setOnClickListener(listener);
findViewById(R.id.buttonDot).setOnClickListener(listener);
}
private void setOperatorButtonClickListener() {
View.OnClickListener operatorListener = v -> {
Button button = (Button) v;
if (!currentInput.isEmpty()) {
firstNumber = Double.parseDouble(currentInput);
operator = button.getText().toString();
currentInput = "";
}
};
findViewById(R.id.buttonAdd).setOnClickListener(operatorListener);
findViewById(R.id.buttonSubtract).setOnClickListener(operatorListener);
findViewById(R.id.buttonMultiply).setOnClickListener(operatorListener);
findViewById(R.id.buttonDivide).setOnClickListener(operatorListener);
findViewById(R.id.buttonEqual).setOnClickListener(v -> {
if (!currentInput.isEmpty()) {
double secondNumber = Double.parseDouble(currentInput);
double result;
switch (operator) {
case "+":
result = firstNumber + secondNumber;
break;
case "-":
result = firstNumber - secondNumber;
break;
case "*":
result = firstNumber * secondNumber;
break;
case "/":
result = secondNumber != 0 ? firstNumber / secondNumber : 0; // Avoid division by zero
break;
default:
return;
}
resultText.setText(String.valueOf(result));
currentInput = "";
}
});
}
}
Step 5: Run the App and Fix Crashes
Make sure you’ve handled all button clicks, and clear any previous input when the Clear button is pressed to avoid crashes. If the app crashes, check your logcat for errors related to null references or missing button IDs.
Video Tutorial
Watch the video tutorial below for a complete walkthrough:
