Creating a small Calculater

.Small Calculator:-
We try to making a simple calculator.In which we take two number and do some kind of addition,subtraction operation.
Before doing Android application we must take consider the layout issue

Layout of Simple Calculator

Layout issue
(1)A TextView that would be a Label i.e.Simple Calculator
(2)A Line which separate the Label and EditText
(2)A EditText in which number and result will be shown.
(3)A List of Button  from 0 to 9 with additional button + , - ,Enter and Clear button

Select the build target

In my previous post I take the Android 4.03 target machine.Here we take Android 1.5. This is compatible with Android 1.6, Android 2.0, Android 2.1, Android 2.2 , Android 2,3 and Android 3.0 version.

Small Calculator Android Project

This is a new simple calculator Android Project.

main.xml

<?xml version="1.0" encoding="utf-8"?>
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/tableLayout1"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent" >

    <TextView
        android:id="@+id/tv1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/cal"
        android:textSize="32dp"       
        android:background="@color/colu"
                       
        />
     <View
        android:layout_height="6dip"
        android:background="#FF0000" />

     <EditText
         android:id="@+id/edtext"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:layout_marginTop="10dip"
       
      />
      <TableRow
        android:id="@+id/Row1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:padding="5dip" >
    
     <Button
        android:id="@+id/one"
        android:textSize="30dp" 
        android:background="@drawable/but_img"    
        android:layout_width="50dp"
        android:layout_height="50dp"
        android:text="1"
      
       />
       <Button
        android:id="@+id/two"
        android:textSize="30dp" 
        android:background="@drawable/but_img"    
        android:layout_width="50dp"
        android:layout_height="50dp"
        android:layout_marginLeft="60dip"
        android:text="2"
       />
      
       <Button
        android:id="@+id/three"
        android:textSize="30dp" 
        android:background="@drawable/but_img"    
        android:layout_width="50dp"
        android:layout_height="50dp"
        android:layout_marginLeft="60dip"
        android:text="3"
       />
       </TableRow>
      
       <TableRow
         android:id="@+id/Row2"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:padding="5dip">
      
        <Button
        android:id="@+id/four"
        android:textSize="30dp" 
        android:background="@drawable/but_img"    
        android:layout_width="50dp"
        android:layout_height="50dp"
        android:text="4"
       />
      
          <Button
        android:id="@+id/five"
        android:textSize="30dp" 
        android:background="@drawable/but_img"    
        android:layout_width="50dp"
        android:layout_height="50dp"
        android:layout_marginLeft="60dip"
        android:text="5"
       />
      
         
          <Button
        android:id="@+id/six"
        android:textSize="30dp" 
        android:background="@drawable/but_img"    
        android:layout_width="50dp"
        android:layout_height="50dp"
        android:layout_marginLeft="60dip"
        android:text="6"
       />       
         
        </TableRow>
       
      
        <TableRow
         android:id="@+id/Row3"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:padding="5dip">
      
        <Button
        android:id="@+id/seven"
        android:textSize="30dp" 
        android:background="@drawable/but_img"    
        android:layout_width="50dp"
        android:layout_height="50dp"
        android:text="7"
       />
      
          <Button
        android:id="@+id/eight"
        android:textSize="30dp" 
        android:background="@drawable/but_img"    
        android:layout_width="50dp"
        android:layout_height="50dp"
        android:layout_marginLeft="60dip"
        android:text="8"
       />
      
         
          <Button
        android:id="@+id/nine"
        android:textSize="30dp" 
        android:background="@drawable/but_img"    
        android:layout_width="50dp"
        android:layout_height="50dp"
        android:layout_marginLeft="60dip"
        android:text="9"
       />       
         
        </TableRow>
       
       <TableRow
         android:id="@+id/Row4"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:padding="5dip">
      
        <Button
        android:id="@+id/zero"
        android:textSize="30dp" 
        android:background="@drawable/but_img"    
        android:layout_width="50dp"
        android:layout_height="50dp"
        android:text="0"
       />
      
          <Button
        android:id="@+id/plus"
        android:textSize="30dp" 
        android:background="@drawable/but_img"    
        android:layout_width="50dp"
        android:layout_height="50dp"
        android:layout_marginLeft="60dip"
        android:text="+"
       />
      
         
          <Button
        android:id="@+id/minus"
        android:textSize="30dp" 
        android:background="@drawable/but_img"    
        android:layout_width="50dp"
        android:layout_height="50dp"
        android:layout_marginLeft="60dip"
        android:text="-"
       />       
         
        </TableRow>
       
      
       <TableRow
         android:id="@+id/Row5"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:padding="5dip">
      
        <Button
        android:id="@+id/enter"
        android:textSize="18dp" 
        android:background="@drawable/but_img"    
        android:layout_width="50dp"
        android:layout_height="50dp"
        android:text="Enter"
       />
      
          <Button
        android:id="@+id/clear"
        android:textSize="18dp" 
        android:background="@drawable/but_img"    
        android:layout_width="50dp"
        android:layout_height="50dp"
        android:layout_marginLeft="60dip"
        android:text="Clear"
       />       
         
        </TableRow>

Explanation: if you see carefully the layout of the calculator you will observe that it is structure of combination of row and column

  There are number of layout in available in android.Here we not discuss all. we discuss only In my next coming post I discuss all category of layout.

TableLayout:--The children  under TableLayout are ROW and COLUMN.  but it has no border of their children .A table can leave cells empty.Our all designing layout under the TableLayout.

TableRow:   Each TableRow define a row in table , each row may have zero or more view or cell, each cell or view may define any other kind of view (Button,EditText,TextView,ImageView etc) or viewGroup ie a another TableLayout.     


TextView:   If you see carefully the Label "Simple Calculator" .What it show? It has big size font and backgroundColor.
                 

android:textSize="32dp"       
The textSize is 32dp The number of pixels within a specific area of the screen.it is referred as as dpi (dots per inch).ie  1 dp equals 1.5 physical pixels.

  android:background="@color/colu"  you are seeing in above figure that we make color resources in string.xml since color is also is a kind of resocuces
<string name="cal">Simple Calculator</string> Here we define label on TextView in form of String resource i.e you have to define the color in string.xml file as above

View:-  We draw a single line which demarcate the  EditText and label.it has 6dip width android:layout_height="6dip"and the backgroud color is specified android:background="#FF0000"

     
EditText :-  
android:id="@+id/edtext" It is id (edtext) tag used in Java Source Code.
android:layout_marginTop="10dip" maginTop from Top is 10dip      

TableRow :-   android:id="@+id/Row1" Here is each Row has id attribute
                    android:padding="5dip The View under Row has 5padding space around

Button :-  android:background="@drawable/but_img"  I used button image 50*50 pixel which is stored in /res/drawable/but_img it is in png format but you will never  mention the extension name in android:background="@drawable/but_img" There is no need to specify the full path /res/drawable/but_img in above code since when @ character is specifies it  is understood that it must be in resource folder.The below is mention the how much width and height of but_img.           
        android:layout_width="50dp"
       android:layout_height="50dp"
       android:layout_marginLeft="60dip" android:layout_marginLeft=60dip it is distance between two button.
 Java Source Coding:-



package abh.lay.com;

import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.Button;
import android.widget.EditText;

public class LayoutActivity extends Activity implements OnClickListener {
    /** Called when the activity is first created. */
 
    private EditText edtxt;
    private String inital_str="0";
    private String end= "  ";
    private int res=0;
  
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
        edtxt = (EditText)findViewById(R.id.edtext);
        edtxt.setText("0");
      
       ((Button)findViewById(R.id.one)).setOnClickListener(this);
       ((Button)findViewById(R.id.two)).setOnClickListener(this);
       ((Button)findViewById(R.id.three)).setOnClickListener(this);
       ((Button)findViewById(R.id.four)).setOnClickListener(this);
       ((Button)findViewById(R.id.five)).setOnClickListener(this);
       ((Button)findViewById(R.id.six)).setOnClickListener(this);
       ((Button)findViewById(R.id.seven)).setOnClickListener(this);
       ((Button)findViewById(R.id.eight)).setOnClickListener(this);
       ((Button)findViewById(R.id.nine)).setOnClickListener(this);
       ((Button)findViewById(R.id.zero)).setOnClickListener(this);
       ((Button)findViewById(R.id.plus)).setOnClickListener(this);
       ((Button)findViewById(R.id.minus)).setOnClickListener(this);
       ((Button)findViewById(R.id.enter)).setOnClickListener(this);
       ((Button)findViewById(R.id.clear)).setOnClickListener(this);
    
    }

    public void onClick(View v) {
        // TODO Auto-generated method stub
        switch (v.getId()) {
        // Number buttons: '0' to '9'
        case R.id.one:
        case R.id.two:
        case R.id.three:
        case R.id.four:
        case R.id.five:
        case R.id.six:
        case R.id.seven:
        case R.id.eight:
        case R.id.nine:
        case R.id.zero:
            String lab_num= ((Button)v).getText().toString();
            if(lab_num.equals("0")){inital_str=lab_num;}
            else {inital_str = inital_str+lab_num;}
            edtxt.setText(inital_str);  
            break;
        case R.id.plus:
           calculate();
            end = "+";
            break;
         case R.id.minus:
             calculate();
            end = "-";
            break;
       
         case R.id.enter:
             calculate();
            end = "Enter";
            break;
 
         // Clear button
         case R.id.clear: 
            res = 0;
            inital_str = "0";
            end = " ";
            edtxt.setText("0");
            break;
        }
      }
        private void  calculate() {
              int inNum = Integer.parseInt(inital_str);
              inital_str= "0";
              if (end == " ") {
                 res = inNum;
              } else if (end == "+") {
                 res += inNum;
              } else if (end == "-") {
                 res -= inNum;
              }
               else if (end == "Enter") {
                 // Keep the result for the next operation
              }
              edtxt.setText(String.valueOf(res));
           }
        }

Explanation:

       P4WSGRJ95N7E