f /shuttereditz

shutter Adobe Photoshop Tutorials

Android Studio Tutorial

Calculator Part 1: Simple Calculations

0 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…..).

1 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

2 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.

3 shuttereditz.blogspot.com
 f /shuttereditz

shutter Adobe Photoshop Tutorials

4 shuttereditz.blogspot.com
 f /shuttereditz

shutter Adobe Photoshop Tutorials

5 shuttereditz.blogspot.com
 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 Id
Button 0 btn0
Button 1 btn1
Button 2 btn2
Button 3 btn3
Button 4 btn4
Button 5 btn5
Button 6 btn6
Button 7 btn7
Button 8 btn8
Button 9 btn9
Button + btnAdd
Button - btnSubtract
Button * btnMultiply
Button / btnDivide
Button C btnClear
Button . 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-->

6 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 don’t 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 Id’s 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 android.support.v7.app.ActionBarActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.EditText;
import 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 let’s check it out:

That’s it….. We have completed creating a simple calculator. Thank you for using this tutorial…ENJOY!

VISIT US
shuttereditz.blogspot.com

18 shuttereditz.blogspot.com