thebillington

development blog

Written by Mr Rebecchi

Building an Android calculator - Part 1

As more and more people convert to the mobile revolution, it's getting more and more important that developers understand the code they are writing, and more importantly why they are writing it. We have moved out of the initial craze over mobile apps, the Android and iOS market is more saturated than ever, and it's getting harder and harder for developers to provide well built Android apps.

This tutorial aims to teach you the basics of building an Android application, through use of XML to build up views and add interactive elements, and Java to provide an implementation of logic. I am a relatively experienced Android developer, but by no means are my words golden. There will be other ways, and there will be better ways to implement certain parts of the Android calculator we are going to develop. However I aim to breakdown the application building in succinct steps, and try and explain what is happening as best as I can.

So without further ado, lets get started!

Android studio

The first thing we are going to need is Android studio, and preferably an Android phone. I'm not aiming to reinvent the wheel, so here are two blog posts that will help you learn a bit about Android studio.

The first is a link to my own blog (shameless plug) which shows you a little bit about how the ADB (Android Debugging Bridge) works. This information is not necessary for this tutorial, however the ADB suite is an incredibly powerful tool which it is definitely worth learning more about. Read the blog here.

The second tutorial is from couchbase, and it shows you how to install and run a new Android Application on your phone. If you don't have an Android phone to test on, then you will need to learn how to setup your own Android Emulator. There are hundreds of tutorials around that show you how to do this, and it is very easy, especially with the latest Android Studio. Here's the couchbase tutorial.

Importing the code

I've taken a different tact with this tutorial compared to previous ones. Instead of going through step by step and building the codebase from scratch, I have decided to create my own basic framework with a very simple calculator implemented already. The tutorial has an in-depth explanation of the code, and some ghost methods that I have written to let you implement your own methods.

There are a few reasons for this. Firstly, my last tutorial had a number of comments from people suggesting that I start to use github as a teaching tool, so that's exactly what I've done. We'll cover git in a bit more detail later. Secondly, Android has a very steep learning curve compared to Python, and it takes a lot longer to see results. Therefore I've built you a framework which explains what is happening, and allows you to jump straight into writing code.

So now, head over to the github repository where the code is stored, and create a github account if you haven't already:

https://github.com/thebillington/androidCalculator

You now need to setup github on your own computer. For the purposes of this tutorial I will be using the github command line application, as I find it much nicer to use. Once again, I'm not going to go into depth on how git works, but if you want a good start then head over to the github tutorials pages. For the purpose of this tutorial, all you really need to know is how to clone a repository to your local computer.

We do this by cloning the repository onto our local hard drive. With the github command line installed, head over to your Terminal and navigate to whatever directory you want to clone the repository to. I'm going to use my documents:

cd /Users/thebillington/Documents

Next head to the github repository, and copy the URL shown where it says HTTPS:

Now type into your Terminal window:

git clone https://github.com/thebillington/androidCalculator.git

It should download the repository into your Documents folder, or whatever folder you've chosen. Now we need to import this project into Android. First head to Android Studio, select 'File > Open' and navigate to your Documents, before selecting the androidCalculator folder, and clicking on choose:

You should now be able to see the source files by clicking on Project in the top left hand side:

Open up the activity_calculator.xml file located in 'App>src>main>res>layout' and the Calculator.java file located in 'App>src>main>java>uk>co>thebillington>calculator'.

And that's everything, you should now have the full code available to start completing the tutorial. Read through all the code in the layout XML file first, as this explains how the button objects are accessed in the Calculator Activity. Then read through the code in the Calculator class and try understand what it is doing, before completing the implementations of the multiply, divide and squared methods, as well as providing an implementation to access these from a button click.

Then at the end of the tutorial I have provided 4 other buttons, which will allow you to start designing and creating your own methods.

NOTE: Comments have been disabled on the website as spambots have so far broken through every barrier I've tried to put up, and I don't have the time to build a bespoke commenting system. If you have any questions don't hesitate to fire me an email, or head over to my Facebook page or send me a Tweet!