Tuesday, August 26, 2014

Android programming tutorial

Android is an open source linux based operating system for mobile devices like smart phones, tables and other devices. The purpose of this blog is to introduce a developer to android development. There are already many tutorials for Android. So why another ? Mobile development is fun and easy. But despite lots of documentation from Google and several blogs, the initial startup for new developer is not easy. There is substantial trial and error even for the experienced programmer before you get comfortable with the development process.

In the rest of the blog I will
  • Describe some android application concepts
  • Describe what SDKs and tools you need to download
  • Develop a very simple android application.
This blog will be most useful when used in conjunction with the official Android developers documentation. There are new terms like Activity or Layout that I describe only briefly. You should read more about it from the original documentation.

Concepts

  • Android applications are mostly developed in JAVA.
  • Android development is like any other event driven UI development. Layout UI elements on the screen and write code to handle event like user tapping a button or a menu option.
  • An activity is a single screen of an application that a user interacts with. 
  • An application may have many activities. Each activity has a layout that describes how the user interface widgets are layed out on the screen.
  • Activities communicate by sending Intents to each other. For example, if by clicking a button, a particular screen needs to replace the current one, the current activity will send an intent to the one that needs to come to the foreground.
  • Android SDK supports all the UI elements like text boxes, buttons, lists , menus, action bar etc that are necessary to build a UI.
  • The layouts determine how the UI elements are positioned on the screen respective to each other. With LinearLayout, the UI elements are positioned one after the other.  With RelativeLayout, the UI elements are positioned relative to one another.
  • Additionally, there are APIs
    • to store data to a file or to a local SQLite relational database.
    • to phone other devices.
    • to send text messages to other devices.
    • to send messages to other applications.
  • Using HTTP, REST or other general purpose client libraries, you can make requests to remote servers.
  • Most of the time, any JAVA library that you can use in any JAVA application is generally usable in Android. ( of course sometimes there are issues such as supported JDK versions)
Required Tools
  • JAVA SDK  
  • Android Studio
    • This has the Android SDK and an IntelliJ based IDE.
    • You could also use the eclipse ADT or just the plain SDK with command line.
    • For this tutorial I have used Android studio 0.8.2.
  • Optional - A mobile device
    • Android SDK has emulators that you can run the app on. But they are slow.
    • Running on a real device gives more satisfaction. I used a Nexus 7. 
  • Optional - Download the source code for the tutorial below from https://sites.google.com/site/khangaonkar/home/android
In the rest of the blog we will work through a very simple tutorial to develop an android application.

Tutorial

Step 1: Download the android SDK

Download the android SDK from http://developer.android.com/sdk/installing/index.html. The SDK is available in 3 flavors : eclipse ADT , android studio (intelliJ) and commandline. For this tutorial, I used android studio because that seems to be the recommended direction from google. But (except on MacOs) eclipse works fine as well.

Step 2 : Create a new project

Start Android Studio
Select File > New Project
Enter Application name and click next
Accept default for form factors and click next
Select the default blank activity and hit next
Select the defaults for the new activity and hit finish

You should see a project as shown below















Step 3: Create an emulator
An emulator lets you test your application on a variety of devices without actually having the device. Let us create a Nexus 7 emulator.

Click Tools > Android > AVD Manager
Click create and enter the information as shown below




















Click Ok
Select the created device and hit Start
This will a take a couple of minutes. The emulators are slow. Eventually you will see the window shown below













In the main project, in the lower window, you should see that the emulator is detected.








Caution: Emulators are very slow and take a lot of time to start. The first time I install a new version of AppStudio or eclipse ADT, they almost never work. It takes a little bit of trial and error to get them going.

Step 4 : Run the application

Click Run > Run App
When prompted, Select the emulator
The default apps shows hello world on the screen













Step 5: Review generate files

Under Greeting/app/ src/main/java is the class com.mj.greeting.MyActivity. This is the main class the represents the logic around what is shown on the screen.
line 17  is setContentView(R.layout.activity_my);
This line sets the layout that is displayed on the screen. The layout is defined as an xml file Greeting/apps/src/main/res/layout/activity_my.xml. The LayoutManager and any UI elements like editboxes , buttons etc and their properties are defined here. In this case, a RelativeLayout surrounds a Textview whose default value is Hello World.

Step 6: Add some new code
Let us add an edittext box and a button to the UI. The user can type a message in the editbox and then click the button. On clicking the message replaces what is displayed in the textview.

In the file Greeting/apps/src/main/res/layout/activity_my.xml

add an android:id to the relativelayout
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/main"


add an android:id to the textview
        android:id="@+id/textview"
        android:text="@string/hello_world"


The ids will let us reference these widgets in code.

Add an edittext box
<EditText
        android:id="@+id/edittext"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@id/textview"
        android:ems="10"
        android:layout_marginTop="10dp"
        android:text="greeting" android:inputType="text" />


and a button
<Button
        android:id="@+id/button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@+id/edittext"
        android:layout_marginTop="10dp"
        android:text="Update Greeting"
        android:onClick="onClick"/>


OnClick attribute references the method that is called when the user clicks the button. So we will need to add an onClick method implementation

To the class com.mj.greeting.MyActivity add the method
public void onClick(View v) {
        View main = this.findViewById(R.id.main) ; // get a reference to the current view
        EditText edit = (EditText) main.findViewById(R.id.edittext) ; // get a reference to the edittext
        TextView tv= (TextView) main.findViewById(R.id.textview) ; // get the textview
        tv.setText(edit.getText()); // get the text entered in edittext and put it in the textview
    }


Run the application




















Step 7: Run on a real device

So far we have been running the application on a emulator. It is much more fun to run on a real device. Enable USB debugging on your device.  On the Nexus 7, USB debugging is enabled by selecting the option in Settings/Developer Options.

Connect it to your development machine with a USB cable. do Run > Run App

The application will be installed and run on the device.



















In summary, getting started with mobile development is simple and fun once you get comfortable with the concepts and tools.