f /shuttereditz

shutter

Adobe Photoshop Tutorials

Android Studio Tutorial

Calculator Part 1: Simple Calculations

shuttereditz.blogspot.com

f /shuttereditz

shutter

Adobe Photoshop Tutorials

Intro:
In this Tutorial we are going to start a new project Calculator.
First of all, to start with we are going to create a simple calculator to do simple arithmetic operations (i.e., one
operator and two operands).

Step 1:
Start Android Studio .Create a new Project .

Application Name : Calculus or anything you like

Target Android devices >>
Check Phone and Tablet
Minimum SDK Android 2.3 Gingerbread
Select a Blank Activity >>
Click Finish keeping the default settings for Activity (Name: Main Activity..).

shuttereditz.blogspot.com

f /shuttereditz

shutter

Adobe Photoshop Tutorials

Step 2: Setting Up Layout

Skip to XML Code

First of all insert a Linear Layout (Vertical) inside the Relative Layout. (Delete the Hello World).

Next Insert a Text Field inside the Linear Layout (Vertical).

Change the following settings for the Text Field in the XML tab.
<EditText
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="@+id/txtScreen"
android:inputType="number|numberDecimal|numberSigned" />

Now go back to Design tab insert a Table Layout below the Text Field txtScreen.

Now insert a Table Row inside the Table Layout

shuttereditz.blogspot.com

f /shuttereditz

shutter

Adobe Photoshop Tutorials

Change its settings in XML/Text tab

<TableRow
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:orientation="horizontal">
</TableRow>

Go to Design Tab and insert Buttons for operators in the first row.

Insert a new Table Row below the first one and add Buttons to it to finish the Layout.

shuttereditz.blogspot.com

f /shuttereditz

shutter

shuttereditz.blogspot.com

Adobe Photoshop Tutorials

f /shuttereditz

shutter

shuttereditz.blogspot.com

Adobe Photoshop Tutorials

f /shuttereditz

shutter

Adobe Photoshop Tutorials

Apply the same settings to all the Table Rows

Change the id-s for all Buttons according to this Table:

Button
Button 0
Button 1
Button 2
Button 3
Button 4
Button 5
Button 6
Button 7
Button 8
Button 9
Button +
Button Button *
Button /
Button C
Button .

Button Id
btn0
btn1
btn2
btn3
btn4
btn5
btn6
btn7
btn8
btn9
btnAdd
btnSubtract
btnMultiply
btnDivide
btnClear
btnDot

For Equals Button apply the following settings

<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="="
android:id="@+id/btnEquals"
android:layout_span="4" /> <!--Cover all columns-->

shuttereditz.blogspot.com

f /shuttereditz

shutter

Adobe Photoshop Tutorials

The final xml code will be:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
android:paddingBottom="@dimen/activity_vertical_margin"
tools:context=".MainActivity">
<LinearLayout
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<EditText
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="@+id/txtScreen"
android:inputType="number|numberDecimal|numberSigned" />
<TableLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<TableRow
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:orientation="horizontal">
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="+"
android:id="@+id/btnAdd" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="-"
android:id="@+id/btnSubtract" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="/"
android:id="@+id/btnDivide" />
<Button
android:layout_width="wrap_content"
7

shuttereditz.blogspot.com

f /shuttereditz

shutter

Adobe Photoshop Tutorials

android:layout_height="wrap_content"
android:text="*"
android:id="@+id/btnMultiply" />
</TableRow>
<TableRow
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:orientation="horizontal">
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="1"
android:id="@+id/btn1" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="2"
android:id="@+id/btn2" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="3"
android:id="@+id/btn3" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="4"
android:id="@+id/btn4" />
</TableRow>
<TableRow
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:gravity="center">
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="5"
android:id="@+id/btn5" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="6"
android:id="@+id/btn6" />
8

shuttereditz.blogspot.com

f /shuttereditz

shutter

Adobe Photoshop Tutorials

<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="7"
android:id="@+id/btn7" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="8"
android:id="@+id/btn8" />
</TableRow>
<TableRow
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:gravity="center">
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="9"
android:id="@+id/btn9" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="0"
android:id="@+id/btn0" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="."
android:id="@+id/btnDot" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="C"
android:id="@+id/btnClear" />
</TableRow>
<TableRow
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:gravity="center">
<Button
android:layout_width="wrap_content"
9

shuttereditz.blogspot.com

f /shuttereditz

shutter

Adobe Photoshop Tutorials

android:layout_height="wrap_content"
android:text="="
android:id="@+id/btnEquals"
android:layout_span="4" />
</TableRow>
</TableLayout>
</LinearLayout>
</RelativeLayout>

10

shuttereditz.blogspot.com

f /shuttereditz

shutter

Adobe Photoshop Tutorials

Step 3: Setting Up Java

Delete the onCreateOptionsMenu and onOptionsItemSelected functions. We dont need them

package com.blogspot.shuttereditz.calculus;
import android.support.v7.app.ActionBarActivity;
import android.os.Bundle;

public class MainActivity extends ActionBarActivity {

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

Below - public class MainActivity extends ActionBarActivity Insert the code:

private EditText Scr;
private float NumberBf =0, NumAf, result=0;
private String Operation, mod= "replace";

Inside the onCreate() function below the setContentView(R.layout.activity_main); Add the following
code:Scr = (EditText) findViewById(R.id.txtScreen);
Scr.setText("");

To add functions to the Buttons create an Array of Ids by inserting this code below:
int idList[] = {R.id.btn0, R.id.btn1, R.id.btn2, R.id.btn2, R.id.btn3, R.id.btn4,
R.id.btn5, R.id.btn6, R.id.btn7, R.id.btn8, R.id.btn9,
R.id.btnAdd, R.id.btnSubtract, R.id.btnMultiply, R.id.btnDivide,
R.id.btnClear,R.id.btnEquals, R.id.btnDot};

11

shuttereditz.blogspot.com

f /shuttereditz

shutter

Adobe Photoshop Tutorials

Now set the Onclick functions to these Buttons:

for(int id:idList) {
View v = (View) findViewById(id);
v.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
onButtonClick(v);
}
});
}

Below the OnCreate() function create a new function onButtonClick();

public void onButtonClick(View v) {
switch (v.getId()) {
case R.id.btnClear: //Clear
Scr.setText("");
NumberBf = 0;
Operation = "";
break;
case R.id.btnAdd:
mMath("+");
break;
case R.id.btnSubtract:
if(mod.equals("replace")) {
String numb = ((Button) v).getText().toString();
getKeyboard(numb);
}
else mMath("-");
break;
case R.id.btnMultiply:
mMath("*");
break;
case R.id.btnDivide:
mMath("/");
break;
case R.id.btnEquals:
mResult();
Operation = "";
NumberBf = 0;
break;
default:
String numb = ((Button) v).getText().toString();
getKeyboard(numb);
break;
}
}
12

shuttereditz.blogspot.com

f /shuttereditz

shutter

Adobe Photoshop Tutorials

Now we need to create mMath() and mResult() function so above the onButtonClick() function add
public void mMath(String str) {
mResult();
try {
NumberBf = Float.parseFloat(Scr.getText().toString());
Operation = str;
}catch (Exception e) {
Toast.makeText(getApplicationContext(),(CharSequence) e,
Toast.LENGTH_SHORT).show();
Scr.setText("SYNTAX ERROR");
mod="replace";
}
}
public void mResult() {
NumAf = 0;
if(!Scr.getText().toString().trim().isEmpty())
NumAf = Float.parseFloat(Scr.getText().toString());
try {
switch (Operation) {
case "+":
result = NumAf + NumberBf;
break;
case "-":
result = NumberBf - NumAf;
break;
case "*":
result = NumAf * NumberBf;
break;
case "/":
result = NumberBf / NumAf;
break;
default:
result = NumAf;
break;
}
} catch (Exception e) {
e.printStackTrace();
}
Scr.setText(String.valueOf(result));
mod = "replace";
}

13

shuttereditz.blogspot.com

f /shuttereditz

shutter

Adobe Photoshop Tutorials

Now add the following code:

public void getKeyboard(String str) {
String ScrTxt = Scr.getText().toString();
ScrTxt += str;
if(mod.equals("add"))
Scr.setText(ScrTxt);
else
Scr.setText(str);
mod = "add";
}

14

shuttereditz.blogspot.com

f /shuttereditz

shutter

Adobe Photoshop Tutorials

The complete Java Code is:

package com.blogspot.shuttereditz.calculus;
import
import
import
import
import
import

android.support.v7.app.ActionBarActivity;
android.os.Bundle;
android.view.View;
android.widget.Button;
android.widget.EditText;
android.widget.Toast;

public class MainActivity extends ActionBarActivity {

private EditText Scr;
private float NumberBf=0, NumAf, result=0;
private String Operation, mod="replace";
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
Scr = (EditText) findViewById(R.id.txtScreen);
Scr.setText("");
int idList[] = {R.id.btn0, R.id.btn1, R.id.btn2, R.id.btn2, R.id.btn3, R.id.btn4,
R.id.btn5, R.id.btn6, R.id.btn7, R.id.btn8, R.id.btn9,
R.id.btnAdd, R.id.btnSubtract, R.id.btnMultiply, R.id.btnDivide,
R.id.btnClear,R.id.btnEquals, R.id.btnDot, };
for(int id:idList) {
View v = (View) findViewById(id);
v.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
onButtonClick(v);
}
});
}
}
public void mMath(String str) {
mResult();
try {
NumberBf = Float.parseFloat(Scr.getText().toString());
Operation = str;
}catch (Exception e) {
Toast.makeText(getApplicationContext(),(CharSequence) e, Toast.LENGTH_SHORT).show();
Scr.setText("SYNTAX ERROR");
mod="replace";
}
15

shuttereditz.blogspot.com

f /shuttereditz

shutter

Adobe Photoshop Tutorials

}
public void mResult() {
NumAf = 0;
if(!Scr.getText().toString().trim().isEmpty())
NumAf = Float.parseFloat(Scr.getText().toString());
result = NumAf;

try {
switch (Operation) {
case "+":
result = NumAf + NumberBf;
break;
case "-":
result = NumberBf - NumAf;
break;
case "*":
result = NumAf * NumberBf;
break;
case "/":
result = NumberBf / NumAf;
break;
default:
result = NumAf;
break;
}
} catch (Exception e) {
e.printStackTrace();
}
Scr.setText(String.valueOf(result));
mod = "replace";
}
public void getKeyboard(String str) {
String ScrTxt = Scr.getText().toString();
ScrTxt += str;
if(mod.equals("add"))
Scr.setText(ScrTxt);
else
Scr.setText(str);
mod = "add";
}
public void onButtonClick(View v) {
switch (v.getId()) {
case R.id.btnClear: //Clear
Scr.setText("");
NumberBf = 0;
Operation = "";
break;
16

shuttereditz.blogspot.com

f /shuttereditz

shutter

Adobe Photoshop Tutorials

case R.id.btnAdd:
mMath("+");
break;
case R.id.btnSubtract:
if(mod.equals("replace")) {
String numb = ((Button) v).getText().toString();
getKeyboard(numb);
}
else mMath("-");
break;
case R.id.btnMultiply:
mMath("*");
break;
case R.id.btnDivide:
mMath("/");
break;
case R.id.btnEquals:
mResult();
Operation = "";
NumberBf = 0;
break;
default:
String numb = ((Button) v).getText().toString();
getKeyboard(numb);
break;
}
}
}

17

shuttereditz.blogspot.com

f /shuttereditz

shutter

Adobe Photoshop Tutorials

Now lets check it out:

Thats it.. We have completed creating a simple calculator. Thank you for using this tutorialENJOY!

VISIT US
shuttereditz.blogspot.com

18

shuttereditz.blogspot.com