Prerequisites for Simple Calculator using Android<\/h3>\n
To develop this Android application, the requirements and prerequisites are as follows:<\/p>\n
- \n
- Kotlin:<\/strong> You first need to be familiar with Kotlin programming. Given that we will write the app code in the programming language Kotlin, it is necessary.<\/li>\n
- XML:<\/strong> Another crucial component of our Android application is XML. It will be applied to the development of the application’s user interface.<\/li>\n
- Android Studio:<\/strong> The core of our application is Android Studio because that is how we will develop it. Also included with Android Studio is an Android virtual device that can be used to test the functionality of applications.<\/li>\n<\/ol>\n
Download Android Simple Calculator Project<\/h3>\n
Please download the source code of Android Simple Calculator Project from the following link: Android Simple Calculator Project Code<\/strong><\/a>.<\/p>\n
Steps to Create a Simple Calculator Using Android<\/h3>\n
Following are the steps for developing the Android Simple Calculator Project:<\/p>\n
We’ll now start working on developing a simple calculator app. Before putting the code into practice, we will learn about its purpose and function throughout this article. So let’s look at the files and functions needed to run the code:<\/p>\n
You must complete a set of steps in order to create this simple Android calculator application. We are here to walk you through every stage of developing an app.<\/p>\n
- \n
- Extract all the files from the downloaded zip file to the location of your choice.<\/li>\n
- Open Android Studio.<\/li>\n
- Click on File, then Open.<\/li>\n
- Find and select the folder you extracted earlier and click on OK.<\/li>\n<\/ol>\n
You have successfully opened the reminder app\u2019s source code in android studio.<\/p>\n
![\"android](\"https:\/\/techvidvan.com\/tutorials\/wp-content\/uploads\/sites\/2\/2023\/06\/android-studio-1.webp\")
<\/a><\/p>\nBefore getting started with the \u2018 MainActivity.kt \u2019 and \u2018 acitivity_main.xml \u2018 files, we need to set up some things in the drawable folder.<\/p>\n
1. We’ll use colors for the user interface that aren’t initially defined in Android Studio. Go to res -> values -> colors.xml to add colors.<\/p>\n
Code:<\/strong><\/p>\n
<resources>\r\n <color name=\"black\">#FF000000<\/color>\r\n <color name=\"white\">#FFFFFFFF<\/color>\r\n <color name=\"red\">#F00<\/color>\r\n <color name=\"almostBlack\">#222<\/color>\r\n <color name=\"yellow\">#ffc803<\/color>\r\n<\/resources>\r\n<\/pre>\n
![\"colors(xml)\"](\"https:\/\/techvidvan.com\/tutorials\/wp-content\/uploads\/sites\/2\/2023\/06\/colorsxml.webp\")
<\/a><\/p>\n2. We will create new “styles.xml” files for the operator and operand buttons, which may be reused in the “activity main.xml” file, to eliminate the hassle of writing a similar XML code of buttons for operands and operators. Navigate to Res > Values, select the Values folder, and then right click select New > Values Resource File. Type “styles” as the file name, then click “OK.”<\/p>\n
Code:<\/strong><\/p>\n
<resources>\r\n <style name=\"buttonRow\">\r\n <item name=\"android:layout_weight\">1<\/item>\r\n <item name=\"android:layout_width\">match_parent<\/item>\r\n <item name=\"android:layout_height\">0dp<\/item>\r\n <\/style>\r\n\r\n <style name=\"buttonNumber\">\r\n <item name=\"android:layout_weight\">1<\/item>\r\n <item name=\"android:layout_width\">0dp<\/item>\r\n <item name=\"android:layout_height\">match_parent<\/item>\r\n <item name=\"android:background\">@null<\/item>\r\n <item name=\"android:textSize\">25sp<\/item>\r\n <item name=\"android:textColor\">@color\/white<\/item>\r\n <item name=\"android:onClick\">numberAction<\/item>\r\n <\/style>\r\n\r\n <style name=\"buttonOperator\">\r\n <item name=\"android:layout_weight\">1<\/item>\r\n <item name=\"android:layout_width\">0dp<\/item>\r\n <item name=\"android:layout_height\">match_parent<\/item>\r\n <item name=\"android:background\">@null<\/item>\r\n <item name=\"android:textSize\">25sp<\/item>\r\n <item name=\"android:textColor\">@color\/yellow<\/item>\r\n <item name=\"android:onClick\">operationAction<\/item>\r\n <\/style>\r\n<\/resources>\r\n<\/pre>\n
![\"styles(xml)\"](\"https:\/\/techvidvan.com\/tutorials\/wp-content\/uploads\/sites\/2\/2023\/06\/stylesxml.webp\")
<\/a><\/p>\nLet’s go through each file in this project one at a time as we comprehend how the application works.<\/p>\n
1. The \u201cactivity_main\u201d is an XML file which is responsible for creating the text fields and buttons included in the user interface.<\/p>\n
Code:<\/strong><\/p>\n
<?xml version=\"1.0\" encoding=\"utf-8\"?>\r\n<LinearLayout\r\n xmlns:android=\"http:\/\/schemas.android.com\/apk\/res\/android\"\r\n xmlns:app=\"http:\/\/schemas.android.com\/apk\/res-auto\"\r\n xmlns:tools=\"http:\/\/schemas.android.com\/tools\"\r\n android:layout_width=\"match_parent\"\r\n android:layout_height=\"match_parent\"\r\n android:orientation=\"vertical\"\r\n android:background=\"@color\/almostBlack\"\r\n tools:context=\".MainActivity\">\r\n \r\n <androidx.constraintlayout.widget.ConstraintLayout\r\n android:layout_width=\"match_parent\"\r\n android:layout_height=\"0dp\"\r\n android:layout_weight=\"2\"\r\n android:padding=\"20dp\">\r\n\r\n <TextView\r\n android:id=\"@+id\/working\"\r\n android:layout_width=\"match_parent\"\r\n android:layout_height=\"wrap_content\"\r\n android:text=\"\"\r\n android:lines=\"2\"\r\n android:maxLines=\"2\"\r\n android:textColor=\"@color\/white\"\r\n android:textAlignment=\"textEnd\"\r\n android:textSize=\"25sp\"\r\n app:layout_constraintBottom_toTopOf=\"@+id\/results\"\r\n app:layout_constraintEnd_toEndOf=\"parent\"\r\n app:layout_constraintStart_toStartOf=\"parent\"\r\n app:layout_constraintTop_toTopOf=\"parent\"\r\n \/>\r\n\r\n <TextView\r\n android:id=\"@+id\/results\"\r\n android:layout_width=\"match_parent\"\r\n android:layout_height=\"wrap_content\"\r\n android:text=\"\"\r\n android:lines=\"1\"\r\n android:maxLines=\"1\"\r\n android:textColor=\"@color\/white\"\r\n android:textAlignment=\"textEnd\"\r\n android:textSize=\"40sp\"\r\n app:layout_constraintBottom_toBottomOf=\"parent\"\r\n app:layout_constraintEnd_toEndOf=\"parent\"\r\n app:layout_constraintStart_toStartOf=\"parent\"\r\n \/>\r\n <\/androidx.constraintlayout.widget.ConstraintLayout>\r\n\r\n <LinearLayout\r\n style=\"@style\/buttonRow\">\r\n <Button\r\n style=\"@style\/buttonNumber\"\r\n android:textColor=\"@color\/red\"\r\n android:onClick=\"allClearAction\"\r\n android:text=\"AC\"\r\n tools:ignore=\"OnClick\" \/>\r\n <Button\r\n style=\"@style\/buttonNumber\"\r\n android:textColor=\"@color\/red\"\r\n android:onClick=\"backSpaceAction\"\r\n android:text=\"C\"\r\n tools:ignore=\"OnClick\" \/>\r\n <Button\r\n style=\"@style\/buttonNumber\"\r\n android:text=\"\" \/>\r\n <Button\r\n style=\"@style\/buttonOperator\"\r\n android:text=\"\/\"\/>\r\n <\/LinearLayout>\r\n\r\n <LinearLayout\r\n style=\"@style\/buttonRow\">\r\n\r\n <Button\r\n style=\"@style\/buttonNumber\"\r\n android:text=\"7\"\/>\r\n <Button\r\n style=\"@style\/buttonNumber\"\r\n android:text=\"8\"\/>\r\n <Button\r\n style=\"@style\/buttonNumber\"\r\n android:text=\"9\" \/>\r\n <Button\r\n style=\"@style\/buttonOperator\"\r\n android:text=\"x\"\/>\r\n\r\n <\/LinearLayout>\r\n\r\n <LinearLayout\r\n style=\"@style\/buttonRow\">\r\n\r\n <Button\r\n style=\"@style\/buttonNumber\"\r\n android:text=\"4\"\/>\r\n <Button\r\n style=\"@style\/buttonNumber\"\r\n android:text=\"5\"\/>\r\n <Button\r\n style=\"@style\/buttonNumber\"\r\n android:text=\"6\" \/>\r\n <Button\r\n style=\"@style\/buttonOperator\"\r\n android:text=\"-\"\/>\r\n\r\n <\/LinearLayout>\r\n\r\n <LinearLayout\r\n style=\"@style\/buttonRow\">\r\n\r\n <Button\r\n style=\"@style\/buttonNumber\"\r\n android:text=\"1\"\/>\r\n <Button\r\n style=\"@style\/buttonNumber\"\r\n android:text=\"2\"\/>\r\n <Button\r\n style=\"@style\/buttonNumber\"\r\n android:text=\"3\" \/>\r\n <Button\r\n style=\"@style\/buttonOperator\"\r\n android:text=\"+\"\/>\r\n\r\n <\/LinearLayout>\r\n\r\n <LinearLayout\r\n style=\"@style\/buttonRow\">\r\n\r\n <Button\r\n style=\"@style\/buttonNumber\"\r\n android:text=\".\"\/>\r\n <Button\r\n style=\"@style\/buttonNumber\"\r\n android:text=\"0\"\/>\r\n <Button\r\n style=\"@style\/buttonNumber\"\r\n android:layout_weight=\"2\"\r\n android:background=\"@color\/yellow\"\r\n android:textSize=\"40sp\"\r\n android:onClick=\"equalsAction\"\r\n android:text=\"@string\/equal\"\r\n tools:ignore=\"OnClick\" \/>\r\n\r\n <\/LinearLayout>\r\n\r\n\r\n\r\n<\/LinearLayout><\/pre>\n
![\"activity](\"https:\/\/techvidvan.com\/tutorials\/wp-content\/uploads\/sites\/2\/2023\/06\/activity-mainxml.webp\")
<\/a><\/p>\n2. \u201cMainActivity\u201d is a kotlin file which is responsible for initializing our application.
\nThis file contains various functions that are responsible for the working and functioning of our application.<\/p>\nCode:<\/strong><\/p>\n
import androidx.appcompat.app.AppCompatActivity\r\nimport android.os.Bundle\r\nimport android.view.View\r\nimport android.widget.Button\r\nimport kotlinx.android.synthetic.main.activity_main.*\r\n\r\nclass MainActivity : AppCompatActivity() {\r\n private var canAddOperator = false\r\n private var canAddDecimal = true\r\n\r\n override fun onCreate(savedInstanceState: Bundle?) {\r\n super.onCreate(savedInstanceState)\r\n setContentView(R.layout.activity_main)\r\n }\r\n\r\n fun numberAction(view: View){\r\n if (view is Button){\r\n if(view.text == \".\"){\r\n if(canAddDecimal)\r\n working.append(view.text)\r\n canAddDecimal = false\r\n }else\r\n working.append(view.text)\r\n canAddOperator = true\r\n }\r\n }\r\n\r\n fun operationAction(view: View){\r\n if (view is Button && canAddOperator){\r\n working.append(view.text)\r\n canAddOperator = false\r\n canAddDecimal = true\r\n }\r\n }\r\n\r\n fun allClearAction(view: View) {\r\n working.text = \"\"\r\n results.text = \"\"\r\n }\r\n fun backSpaceAction(view: View) {\r\n val length = working.length()\r\n if(length > 0){\r\n working.text = working.text.subSequence(0,length-1)\r\n }\r\n }\r\n fun equalsAction(view: View) {\r\n results.text = calculate()\r\n }\r\n\r\n private fun calculate(): String\r\n {\r\n val digitsOperators = digitsOperators()\r\n if(digitsOperators.isEmpty()) return \"\"\r\n\r\n val timesDivision = timesDivisionCalculate(digitsOperators)\r\n if(timesDivision.isEmpty()) return \"\"\r\n\r\n val result = addSubtractCalculate(timesDivision)\r\n return result.toString()\r\n }\r\n\r\n private fun addSubtractCalculate(passedList: MutableList<Any>): Float\r\n {\r\n var result = passedList[0] as Float\r\n\r\n for(i in passedList.indices)\r\n {\r\n if(passedList[i] is Char && i != passedList.lastIndex)\r\n {\r\n val operator = passedList[i]\r\n val nextDigit = passedList[i + 1] as Float\r\n if (operator == '+')\r\n result += nextDigit\r\n if (operator == '-')\r\n result -= nextDigit\r\n }\r\n }\r\n\r\n return result\r\n }\r\n\r\n private fun timesDivisionCalculate(passedList: MutableList<Any>): MutableList<Any>\r\n {\r\n var list = passedList\r\n while (list.contains('x') || list.contains('\/'))\r\n {\r\n list = calcTimesDiv(list)\r\n }\r\n return list\r\n }\r\n\r\n private fun calcTimesDiv(passedList: MutableList<Any>): MutableList<Any>\r\n {\r\n val newList = mutableListOf<Any>()\r\n var restartIndex = passedList.size\r\n\r\n for(i in passedList.indices)\r\n {\r\n if(passedList[i] is Char && i != passedList.lastIndex && i < restartIndex)\r\n {\r\n val operator = passedList[i]\r\n val prevDigit = passedList[i - 1] as Float\r\n val nextDigit = passedList[i + 1] as Float\r\n when(operator)\r\n {\r\n 'x' ->\r\n {\r\n newList.add(prevDigit * nextDigit)\r\n restartIndex = i + 1\r\n }\r\n '\/' ->\r\n {\r\n newList.add(prevDigit \/ nextDigit)\r\n restartIndex = i + 1\r\n }\r\n else ->\r\n {\r\n newList.add(prevDigit)\r\n newList.add(operator)\r\n }\r\n }\r\n }\r\n\r\n if(i > restartIndex)\r\n newList.add(passedList[i])\r\n }\r\n\r\n return newList\r\n }\r\n\r\n private fun digitsOperators(): MutableList<Any> {\r\n val list = mutableListOf<Any>()\r\n var currentDigit = \"\"\r\n for (character in working.text) {\r\n if (character.isDigit() || character == '.')\r\n currentDigit += character\r\n else {\r\n list.add(currentDigit.toFloat())\r\n currentDigit = \"\"\r\n list.add(character)\r\n }\r\n }\r\n\r\n if (currentDigit != \"\")\r\n list.add(currentDigit.toFloat())\r\n\r\n return list\r\n }\r\n}<\/pre>\n![\"simple](\"https:\/\/techvidvan.com\/tutorials\/wp-content\/uploads\/sites\/2\/2023\/06\/simple-calculator.webp\")
<\/a><\/p>\nAndroid Simple Calculator Output<\/h3>\n
1. Home Screen:<\/strong><\/p>\n
![\"simple](\"https:\/\/techvidvan.com\/tutorials\/wp-content\/uploads\/sites\/2\/2023\/06\/simple-calculator-home-screen-2.webp\")
<\/a><\/p>\n2. Addition & Subtraction Operations:<\/strong><\/p>\n
![\"simple](\"https:\/\/techvidvan.com\/tutorials\/wp-content\/uploads\/sites\/2\/2023\/06\/simple-calculator-project-output.webp\")
<\/a><\/p>\n3. Multiplication & Division Operations:<\/strong><\/p>\n
![\"simple](\"https:\/\/techvidvan.com\/tutorials\/wp-content\/uploads\/sites\/2\/2023\/06\/simple-calculator-output.webp\")
<\/a><\/p>\n4. Before & After Clear Button Clicked:<\/strong><\/p>\n
- XML:<\/strong> Another crucial component of our Android application is XML. It will be applied to the development of the application’s user interface.<\/li>\n
![\"android](\"https:\/\/techvidvan.com\/tutorials\/wp-content\/uploads\/sites\/2\/2023\/06\/android-kotlin-simple-calculator-output-1.webp\")
<\/a><\/p>\n![\"simple](\"https:\/\/techvidvan.com\/tutorials\/wp-content\/uploads\/sites\/2\/2023\/06\/simple-calculator-after-all-clear-4.webp\")
<\/a><\/p>\n