A Simple Android Application For Adding Two Numbers

A Simple Android Application For Adding Two Numbers

In this tutorial, we’ll create a simple android application for adding two numbers. It’s a simple beginner’s level application and the understanding of this code will help in the implementation of other features of a basic calculator. I’m using Eclipse IDE for android application development.

Source code from this tutorial is available on GitHub.

We’ll start by creating an android application. Once the project has been created, you should have basic project structure. Let’s design the required user interface for our mobile application.

Also read : How to create Hybrid Mobile App for Adding Two Numbers

Creating the Simple Android Application User Interface

Open up the xml file in res/layout and you should have the app layout in graphical view. From the left palette, under the Form Widgets, pick up the text medium text and place on the form. Customize the look and feel as you wish using the properties in the right side. Set the text as Addition and it should serve as a heading for our application. Using the text and button controls in the Form Widgets and the number control under the Text Fields, you should be able to build the user interface. Here is how the interface would look like:

A Simple Android Application for Adding Two Number
A Simple Android Application for Adding Two Number

Here is the XML code for the design.


<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:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
tools:context="com.example.addition.AdditionActivity" >

<TextView
android:id="@+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginTop="97dp"
android:text="Addition"
android:textAppearance="?android:attr/textAppearanceMedium"
android:textSize="@dimen/abc_action_bar_default_height_material" />

<TextView
android:id="@+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="@+id/textView1"
android:layout_marginLeft="20dp"
android:layout_marginTop="43dp"
android:text="Number One"
android:textAppearance="?android:attr/textAppearanceMedium" />

<EditText
android:id="@+id/txtNumber1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="@+id/textView2"
android:layout_alignRight="@+id/textView1"
android:ems="2"
android:inputType="number" >

<requestFocus />
</EditText>

<TextView
android:id="@+id/textView3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="@+id/textView2"
android:layout_below="@+id/textView2"
android:layout_marginTop="47dp"
android:text="Number Two"
android:textAppearance="?android:attr/textAppearanceMedium" />

<Button
android:id="@+id/btnAdd"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="@+id/textView3"
android:layout_alignRight="@+id/textView3"
android:layout_below="@+id/textView3"
android:layout_marginTop="46dp"
android:text="Add" />

<EditText
android:id="@+id/txtNumber2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="@+id/btnAdd"
android:layout_alignLeft="@+id/txtNumber1"
android:ems="2"
android:inputType="number" />

<TextView
android:id="@+id/txtResult"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignRight="@+id/txtNumber2"
android:layout_alignTop="@+id/btnAdd"
android:textAppearance="?android:attr/textAppearanceMedium" />

</RelativeLayout>

Implementing the Addition App

Now, open up the your activity java file from src/com.example.addition. Declare a few variables before the onCreate function.


EditText firstNumber;
EditText secondNumber;
TextView addResult;
Button btnAdd;

double num1,num2,sum;

In the onCreate function once the content view has been set, we’ll read the values entered in the Text Views using an id which we have set in the XML code above.


firstNumber = (EditText)findViewById(R.id.txtNumber1);
secondNumber = (EditText)findViewById(R.id.txtNumber2);
addResult = (TextView)findViewById(R.id.txtResult);
btnAdd = (Button)findViewById(R.id.btnAdd);

When the Add button has been clicked we need to add the values entered in the text boxes, sum it up and render the output in the txtResult text view. So, first we need to add an click listener to the Add button.


btnAdd.setOnClickListener(new OnClickListener() {   
    public void onClick(View v) {
         // code will be here
    }
});

Inside the on click listener, we’ll add the numbers and set the sum to the txtResult Text View.


btnAdd.setOnClickListener(new OnClickListener() {
            
    public void onClick(View v) {
        num1 = Double.parseDouble(firstNumber.getText().toString());
        num2 = Double.parseDouble(secondNumber.getText().toString());
        sum = num1 + num2;
        addResult.setText(Double.toString(sum));
    }
});

Save the above changes and run the application. You should have the addition app running. Input the two numbers and you should be above to view the result in the Text View.

A Simple Android Application for Adding Two Number
A Simple Android Application for Adding Two Number

Wrapping It Up

In this very simple and short tutorial, we saw how to get started with Android application development by creating a simple android application for adding two numbers. You can use this as basis for implementing a calculator app in android. For in depth knowledge and info refer the official documentation.

Do let us know you thoughts, suggestions or any corrections in the comments below. Thanks and Happy coding 🙂