Create a nice UI and a working Calculator in Android Studio in Java.
Tags: tutorial, android, beginners, java
Published: 2023-07-03 17:20:30

`
--------------------------------------------------------------------------------------------
Do this in the activity_main.xml You can also copy and your project in the activity_main.xml
--------------------------------------------------------------------------------------------

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

<RelativeLayout 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">

    <TextView
        android:id="@+id/solution_tv"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_above="@id/result_tv"
        android:layout_marginStart="16dp"
        android:layout_marginTop="16dp"
        android:layout_marginEnd="16dp"
        android:layout_marginBottom="16dp"
        android:textAlignment="textEnd"
        android:textColor="@color/black"
        android:textSize="32dp" />

    <TextView
        android:id="@+id/result_tv"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_above="@id/buttons_layout"
        android:layout_marginStart="16dp"
        android:layout_marginTop="16dp"
        android:layout_marginEnd="16dp"
        android:layout_marginBottom="16dp"
        android:text="0"
        android:textAlignment="textEnd"
        android:textColor="@color/black"
        android:textSize="64dp" />


    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        android:layout_alignParentBottom="true"
        android:background="#F1F1F1"
        android:paddingVertical="16dp"
        android:id="@+id/buttons_layout">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center"
            android:orientation="horizontal">

            <com.google.android.material.button.MaterialButton
                android:layout_width="72dp"
                android:layout_height="72dp"
                app:cornerRadius="36dp"
                style="@style/Widget.MaterialComponents.ExtendedFloatingActionButton"
                android:textSize="32dp"
                android:textColor="@color/white"
                android:layout_margin="12dp"
                android:id="@+id/button_c"
                android:backgroundTint="#F44336"
                android:text="C" />
            <com.google.android.material.button.MaterialButton
                android:layout_width="72dp"
                android:layout_height="72dp"
                app:cornerRadius="36dp"
                style="@style/Widget.MaterialComponents.ExtendedFloatingActionButton"
                android:textSize="32dp"
                android:textColor="@color/white"
                android:layout_margin="12dp"
                android:id="@+id/button_open_bracket"
                android:backgroundTint="#A1A1A1"
                android:text="(" />
            <com.google.android.material.button.MaterialButton
                android:layout_width="72dp"
                android:layout_height="72dp"
                app:cornerRadius="36dp"
                style="@style/Widget.MaterialComponents.ExtendedFloatingActionButton"
                android:textSize="32dp"
                android:textColor="@color/white"
                android:layout_margin="12dp"
                android:backgroundTint="#A1A1A1"
                android:id="@+id/button_close_bracket"
                android:text=")" />
            <com.google.android.material.button.MaterialButton
                android:layout_width="72dp"
                android:layout_height="72dp"
                app:cornerRadius="36dp"
                style="@style/Widget.MaterialComponents.ExtendedFloatingActionButton"
                android:textSize="32dp"
                android:textColor="@color/white"
                android:layout_margin="12dp"
                android:id="@+id/button_divide"
                android:backgroundTint="#FF9800"
                android:text="/" />

        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center"
            android:orientation="horizontal">

            <com.google.android.material.button.MaterialButton
                android:layout_width="72dp"
                android:layout_height="72dp"
                app:cornerRadius="36dp"
                style="@style/Widget.MaterialComponents.ExtendedFloatingActionButton"
                android:textSize="32dp"
                android:textColor="@color/white"
                android:layout_margin="12dp"
                android:id="@+id/button_7"
                android:text="7" />
            <com.google.android.material.button.MaterialButton
                android:layout_width="72dp"
                android:layout_height="72dp"
                app:cornerRadius="36dp"
                style="@style/Widget.MaterialComponents.ExtendedFloatingActionButton"
                android:textSize="32dp"
                android:textColor="@color/white"
                android:layout_margin="12dp"
                android:id="@+id/button_8"
                android:text="8" />
            <com.google.android.material.button.MaterialButton
                android:layout_width="72dp"
                android:layout_height="72dp"
                app:cornerRadius="36dp"
                style="@style/Widget.MaterialComponents.ExtendedFloatingActionButton"
                android:textSize="32dp"
                android:textColor="@color/white"
                android:layout_margin="12dp"
                android:id="@+id/button_9"
                android:text="9" />
            <com.google.android.material.button.MaterialButton
                android:layout_width="72dp"
                android:layout_height="72dp"
                app:cornerRadius="36dp"
                style="@style/Widget.MaterialComponents.ExtendedFloatingActionButton"
                android:textSize="32dp"
                android:textColor="@color/white"
                android:layout_margin="12dp"
                android:id="@+id/button_multiply"
                android:backgroundTint="#FF9800"
                android:text="*" />

        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center"
            android:orientation="horizontal">

            <com.google.android.material.button.MaterialButton
                android:layout_width="72dp"
                android:layout_height="72dp"
                app:cornerRadius="36dp"
                style="@style/Widget.MaterialComponents.ExtendedFloatingActionButton"
                android:textSize="32dp"
                android:textColor="@color/white"
                android:layout_margin="12dp"
                android:id="@+id/button_4"
                android:text="4" />
            <com.google.android.material.button.MaterialButton
                android:layout_width="72dp"
                android:layout_height="72dp"
                app:cornerRadius="36dp"
                style="@style/Widget.MaterialComponents.ExtendedFloatingActionButton"
                android:textSize="32dp"
                android:textColor="@color/white"
                android:layout_margin="12dp"
                android:id="@+id/button_5"
                android:text="5" />
            <com.google.android.material.button.MaterialButton
                android:layout_width="72dp"
                android:layout_height="72dp"
                app:cornerRadius="36dp"
                style="@style/Widget.MaterialComponents.ExtendedFloatingActionButton"
                android:textSize="32dp"
                android:textColor="@color/white"
                android:layout_margin="12dp"
                android:id="@+id/button_6"
                android:text="6" />
            <com.google.android.material.button.MaterialButton
                android:layout_width="72dp"
                android:layout_height="72dp"
                app:cornerRadius="36dp"
                style="@style/Widget.MaterialComponents.ExtendedFloatingActionButton"
                android:textSize="32dp"
                android:textColor="@color/white"
                android:layout_margin="12dp"
                android:id="@+id/button_plus"
                android:backgroundTint="#FF9800"
                android:text="+" />

        </LinearLayout>
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center"
            android:orientation="horizontal">

            <com.google.android.material.button.MaterialButton
                android:layout_width="72dp"
                android:layout_height="72dp"
                app:cornerRadius="36dp"
                style="@style/Widget.MaterialComponents.ExtendedFloatingActionButton"
                android:textSize="32dp"
                android:textColor="@color/white"
                android:layout_margin="12dp"
                android:id="@+id/button_1"
                android:text="1" />
            <com.google.android.material.button.MaterialButton
                android:layout_width="72dp"
                android:layout_height="72dp"
                app:cornerRadius="36dp"
                style="@style/Widget.MaterialComponents.ExtendedFloatingActionButton"
                android:textSize="32dp"
                android:textColor="@color/white"
                android:layout_margin="12dp"
                android:id="@+id/button_2"
                android:text="2" />
            <com.google.android.material.button.MaterialButton
                android:layout_width="72dp"
                android:layout_height="72dp"
                app:cornerRadius="36dp"
                style="@style/Widget.MaterialComponents.ExtendedFloatingActionButton"
                android:textSize="32dp"
                android:textColor="@color/white"
                android:layout_margin="12dp"
                android:id="@+id/button_3"
                android:text="3" />
            <com.google.android.material.button.MaterialButton
                android:layout_width="72dp"
                android:layout_height="72dp"
                app:cornerRadius="36dp"
                style="@style/Widget.MaterialComponents.ExtendedFloatingActionButton"
                android:textSize="32dp"
                android:textColor="@color/white"
                android:layout_margin="12dp"
                android:id="@+id/button_minus"
                android:backgroundTint="#FF9800"
                android:text="-" />

        </LinearLayout>
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center"
            android:orientation="horizontal">

            <com.google.android.material.button.MaterialButton
                android:layout_width="72dp"
                android:layout_height="72dp"
                app:cornerRadius="36dp"
                style="@style/Widget.MaterialComponents.ExtendedFloatingActionButton"
                android:textSize="20dp"
                android:textColor="@color/white"
                android:layout_margin="12dp"
                android:id="@+id/button_ac"
                android:backgroundTint="#F44336"
                android:text="AC" />
            <com.google.android.material.button.MaterialButton
                android:layout_width="72dp"
                android:layout_height="72dp"
                app:cornerRadius="36dp"
                style="@style/Widget.MaterialComponents.ExtendedFloatingActionButton"
                android:textSize="32dp"
                android:textColor="@color/white"
                android:layout_margin="12dp"
                android:id="@+id/button_0"
                android:text="0" />
            <com.google.android.material.button.MaterialButton
                android:layout_width="72dp"
                android:layout_height="72dp"
                app:cornerRadius="36dp"
                style="@style/Widget.MaterialComponents.ExtendedFloatingActionButton"
                android:textSize="32dp"
                android:textColor="@color/white"
                android:layout_margin="12dp"
                android:id="@+id/button_dot"
                android:text="." />
            <com.google.android.material.button.MaterialButton
                android:layout_width="72dp"
                android:layout_height="72dp"
                app:cornerRadius="36dp"
                style="@style/Widget.MaterialComponents.ExtendedFloatingActionButton"
                android:textSize="32dp"
                android:textColor="@color/white"
                android:layout_margin="12dp"
                android:id="@+id/button_equals"
                android:backgroundTint="#FF9800"
                android:text="=" />

        </LinearLayout>


    </LinearLayout>



</RelativeLayout>



------------------------------------------------------------------------------------
Do this in the MainActivity.java (the functionality/logic/backend of the Calculator)
------------------------------------------------------------------------------------

// this side is been generated automatically when you create project/package. it take your package's name. mine is io.teammark.teammarkcal.
package io.teammark.teammarkcal;

import androidx.appcompat.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.TextView;
import com.google.android.material.button.MaterialButton;
import org.mozilla.javascript.Context;
import org.mozilla.javascript.Scriptable;


public class MainActivity extends AppCompatActivity implements View.OnClickListener{

    TextView resultTv,solutionTv;
    MaterialButton buttonC,buttonBrackOpen,buttonBrackClose;
    MaterialButton buttonDivide,buttonMultiply,buttonPlus,buttonMinus,buttonEquals;
    MaterialButton button0,button1,button2,button3,button4,button5,button6,button7,button8,button9;
    MaterialButton buttonAC,buttonDot;



    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        resultTv = findViewById(R.id.result_tv);
        solutionTv = findViewById(R.id.solution_tv);

        assignId(buttonC,R.id.button_c);
        assignId(buttonBrackOpen,R.id.button_open_bracket);
        assignId(buttonBrackClose,R.id.button_close_bracket);
        assignId(buttonDivide,R.id.button_divide);
        assignId(buttonMultiply,R.id.button_multiply);
        assignId(buttonPlus,R.id.button_plus);
        assignId(buttonMinus,R.id.button_minus);
        assignId(buttonEquals,R.id.button_equals);
        assignId(button0,R.id.button_0);
        assignId(button1,R.id.button_1);
        assignId(button2,R.id.button_2);
        assignId(button3,R.id.button_3);
        assignId(button4,R.id.button_4);
        assignId(button5,R.id.button_5);
        assignId(button6,R.id.button_6);
        assignId(button7,R.id.button_7);
        assignId(button8,R.id.button_8);
        assignId(button9,R.id.button_9);
        assignId(buttonAC,R.id.button_ac);
        assignId(buttonDot,R.id.button_dot);


    }

    void assignId(MaterialButton btn,int id){
        btn = findViewById(id);
        btn.setOnClickListener(this);
    }


    @Override
    public void onClick(View view) {
        MaterialButton button =(MaterialButton) view;
        String buttonText = button.getText().toString();
        String dataToCalculate = solutionTv.getText().toString();

        if(buttonText.equals("AC")){
            solutionTv.setText("");
            resultTv.setText("0");
            return;
        }
        if(buttonText.equals("=")){
            solutionTv.setText(resultTv.getText());
            return;
        }
        if(buttonText.equals("C")){
            dataToCalculate = dataToCalculate.substring(0,dataToCalculate.length()-1);
        }else{
            dataToCalculate = dataToCalculate+buttonText;
        }
        solutionTv.setText(dataToCalculate);

        String finalResult = getResult(dataToCalculate);

        if(!finalResult.equals("Err")){
            resultTv.setText(finalResult);
        }

    }

    String getResult(String data){
        try{
            Context context  = Context.enter();
            context.setOptimizationLevel(-1);
            Scriptable scriptable = context.initStandardObjects();
            String finalResult =  context.evaluateString(scriptable,data,"Javascript",1,null).toString();
            if(finalResult.endsWith(".0")){
                finalResult = finalResult.replace(".0","");
            }
            return finalResult;
        }catch (Exception e){
            return "Err";
        }
    }

}



-------------------------------------------------------------------------------
This is been generated automatic whenever you create project in Android Studio
-------------------------------------------------------------------------------

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:anndroid="http://schemas.android.com/apk/res-auto"
    package="io.teammark.teammarkcal">

    <application
        android:allowBackup="true"
        android:dataExtractionRules="@xml/data_extraction_rules"
        android:fullBackupContent="@xml/backup_rules"
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        android:roundIcon="@mipmap/ic_launcher_round"
        android:supportsRtl="true"
        android:theme="@style/Theme.TeamMarkCal"
        tools:targetApi="31">
        <activity
            android:name=".MainActivity"
            android:exported="true">
            <intent-filter>
                <action android:name="android.intent.action.MAIN"/>

                <category android:name="android.intent.category.LAUNCHER"/>
            </intent-filter>
        </activity>

    </application>

</manifest>

-----------------------------------------------------------
Add these dependency in your build.gradle(:app) for the app
-----------------------------------------------------------

dependencies {

    implementation 'androidx.appcompat:appcompat:1.4.2'
    implementation 'com.google.android.material:material:1.6.1'
    implementation 'com.google.android.material:material:1.7.0-alpha03'
    testImplementation 'junit:junit:4.13.2'
    androidTestImplementation 'androidx.test.ext:junit:1.1.3'
    androidTestImplementation 'androidx.test.espresso:espresso-core:3.4.0'
    implementation 'androidx.constraintlayout:constraintlayout:2.1.4'
    implementation 'com.faendir.rhino:rhino-android:1.5.2'
    testImplementation 'junit:junit:4.13.2'
    androidTestImplementation 'androidx.test.ext:junit:1.1.3'
    androidTestImplementation 'androidx.test.espresso:espresso-core:3.4.0'

}

--------------------------------
GREAT WORK! AND NOW RUN YOUR APP
--------------------------------



`