Processing for android - installation

We will install processing for android. Since Processing uses Java, we first install the JDK.
Follow this link to download the JDK Standard Edition.
http://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.html
Install the JDK. Now, we need to add the path of JDK to our system path. Go to the bin folder of the Java installation. It will be located in the following folder.

Copy this path to clipboard. Right click on your computer and select properties.

Select Advanced System Properties.

Select Environment Variables.

Search for the System Variables called Path, select it and click Edit...

Paste the path copied into the clipboard in this location (add a semi colon before it) and click OK.

Now, the underlying system knows where JDK is. We proceed to install Processing.

Go to the following link:
https://www.processing.org/download/?processing

Download the version appropriate for your OS. The latest stable release at this time is 2.2.1 (released on 19 May 2014).
It downloads as a zipped package. Extract the package and copy that into any convenient location. I use my desktop to store the unzipped package.

Next, we need to install the android SDK. This installation has already been briefed in my previous post, except for one minor correction. We don't need to download the entire ADT with Eclipse. Since, we will be using the Processing IDE, we will download the android SDK for an existing IDE.

Use the android SDK manager to install the required API files and related google documentation for your devices's android version. Procedure for installing the API files are given in my blog post as below.
Link to my previous post on setting up ADT.
http://presentingthefuture.blogspot.com/2014/01/android-app-development-what-lured-me.html

Now, we need to copy the Android mode template for Processing software. Click on the below link and save the zip package on your desktop.
https://dl.dropboxusercontent.com/u/5898761/AndroidMode.zip

Unzip the package to Documents/Processing/modes folder.

Next, open Processing software and click on the drop down menu that reads "Java" and select "Android".

Processing asks for the path where android SDK is installed. Select the path to your "android-sdk" folder in the android SDK installation path.

We have successfully installed Processing for android. Type the following snippet and run in emulator to check if the installation works correctly.

Warning: Emulator may take a lot of time to open depending on the configuration of your computer; people with less patience are requested to take a long walk after selecting this option.

Further information on how to run this snippet on a real device or a virtual device can be found on my post as below.

http://presentingthefuture.blogspot.com/2014/01/android-app-development-hello-world.html

Processing for android - introduction

I'm a big fan of Processing software! The next series of posts are meant to provide comprehensive information about Processing for android.

Processing is a programming language and an integrated development environment (IDE). In fact, Processing was the first open source programming language that was meant for non-programmers to create visual artworks. It was started as a project at MIT by Casey Reas and Ben Fry, under the supervision of John Maeda. It provides tools for developing sketches for android, online applications and desktop applications for major operating systems.

Processing itself is a Java application and runs on the JVM. Because of this fact, it can run as a HTML code on any HTML supported browser or on a local machine such as JVM installed on a desktop or a mobile device running android OS.

Initially created to serve as a software sketchbook and to teach computer programming fundamentals within a visual context, Processing evolved into a development tool for professionals. Today, there are tens of thousands of students, artists, designers, researchers, and hobbyists who use Processing for learning, prototyping, and production.

Striking features that made Processing popular are:

·        Free to download and open source

·        Interactive programs with 2D, 3D or PDF output

·        OpenGL integration for accelerated 3D

·        For GNU/Linux, Mac OS X, and Windows

·        Over 100 libraries extend the core software

·        Well documented, with many books available

References:

1.     Programming Interactivity, 2nd Edition, by Joshua Noble

2.     https://www.processing.org/

Android app development - how to create an APK file

Now that we have developed an app, whats the fun without showing it off to our friends?

Most of us will be aware of what an .apk file means. According to wikipedia, Android application package file (APK) is the package file format used to distribute and install application software and middleware onto Google's Android operating system, and certain other operating systems, such as Blackberry 10 Devices with the OS version 10.2.1. For tech savvy people, here is the link which gives complete details about APK file format.

Here's how we create an .apk file from our Temperature Converter project. The same procedure may be followed for any other project.

Right click on the Temperature Converter project (the required project) from the project explorer and select export.

Select "Export Android Application" under the "Android" folder of the Export window.

Click Next in the Export Android Application window. This window checks if there are any errors in the developed application.

Now, we have to create a key for the application. Select Create new keystroke, select a location to save the keystroke and create a password for the key.

Give specific details about the key. Validity of the key is generally 25 years.

Click finish in the final window. Now, you have successfully exported the project to an .apk file. You can share this file with your friends. Just transfer this file to your android phone and install the file from your phone. 

Android app development - Temperature Converter

We displayed our "Hello world!" message in our last post. Now, we'll get our hands on some basic coding. We'll be doing our very own converter app that converts temperature from degree Celsius to Fahrenheit and vice-versa.

We'll start off with a New Android Application.

Create some custom icon for the launcher, like the one below.

Use a blank template for the app and click finish.

We will now create some static attributes for the elements that are going to hold our temperature values. We can also add the static attribute for color, to change the background color of the app.
To add an element, open the file res/values/strings.xml and press the add button.

Now select the Color entry as shown.

Edit the attributes for the Color attribute.

Similarly, create three more String attributes with the following values.

The below image shows the created static attributes placed besides the automatically generated xml code.

Now switch to layout editor by double clicking the activity_main.xml and then switching to Graphical Layout. Right click on the "Hello world!" text and select delete option to delete it. Now add a text field by dragging and dropping the text field box into the layout of the application. Also, drag a RadioGroup and one push button from the Form Widgets tab as shown. Delete one of the radio buttons, as we'll require only two of the three buttons.

Next, we'll proceed by assigning the static attributes which we had previously created to these user interfaces. We'll begin by right clicking on the first radio button and selecting the edit text option.

Select the string attribute "celsius" in the Resource Chooser and click OK.

Similarly assign the attributes "fahrenheit" and "calc" to the second radio button and the push button respectively. Set the checked property of the first radio button to true by right clicking on it.

Set the Input type property of the text input field to numberSigned and numberDecimal.

Now, we'll create the main program. Open the MainActivity.java from the src folder. Type the following code and save the program.

package com.example.temperatureconverter;

import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.widget.EditText;
import android.widget.RadioButton;
import android.widget.Toast;
public class MainActivity extends Activity {
private EditText text;
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
text = (EditText) findViewById(R.id.editText1);
}
// This method is called at button click because we assigned the name to the
// "OnClick property" of the button
public void onClick(View view) {
switch (view.getId()) {
case R.id.button1:
RadioButton celsiusButton = (RadioButton) findViewById(R.id.radio0);
RadioButton fahrenheitButton = (RadioButton) findViewById(R.id.radio1);
if (text.getText().length() == 0) {
Toast.makeText(this,"Please enter a valid number",
Toast.LENGTH_LONG).show();
return;
}
float inputValue = Float.parseFloat(text.getText().toString());
if (celsiusButton.isChecked()) {
text.setText(String.valueOf(convertFahrenheitToCelsius(inputValue)));
celsiusButton.setChecked(false);
fahrenheitButton.setChecked(true);
} else{
text.setText(String.valueOf(convertCelsiusToFahrenheit(inputValue)));
fahrenheitButton.setChecked(false);
celsiusButton.setChecked(true);
}
break;
}
}
// Converts to celsius
private float convertFahrenheitToCelsius(float fahrenheit) {
return ((fahrenheit - 32) * 5 / 9);
}
// Converts to fahrenheit
private float convertCelsiusToFahrenheit(float celsius) {
return ((celsius * 9) / 5) + 32;
}
}

Android app development - Hello world!

We saw about how to install the Android ADT in my previous post. Now we'll see how to develop a basic android app.

Open the "exclipse.exe" application from the "eclipse" folder of the installation directory. Don't get bogged down by the complexity of the layout!
We will now open a new project.
File - New - Android Application Project.

In the New Android Application window that appears, we will give a name to the application. (App names preferably start with a capital letter). The fields "Minimum Required SDK", "Target SDK", "Compile With" and "Theme" are pretty self explanatory from their names. I presume you should be aware of the fact that the version for which you are developing an app should be selected in the "Target SDK" and "Compile With" drop down list boxes. Keep clicking next and hit finish.

Now, if you are witnessing the coding behind android apps for the first time, brace yourself! Even I never expected "Java" to be here! I'm mostly from an electrical and electronics background. Though I had some coding classes at college, that was just at novice level. But, I could manage to grasp some basic concepts and believe me, these basics are more than enough for a hobbyist programmer.

On the left, there is the project explorer pane. As of now, we need to understand just a few areas we are going to meddle with. I've highlighted them for you.

"MainActivity.java" is like the main function of a c program. It is where all the function blocks are brought together and are given their functionality. The "activity_main.xml" file under the "layout" area of the "res" folder is where the various elements (like text input, number input, buttons, etc.) are defined and arranged. This will decide how the layout will look when the app runs on any android platform. Next is the "strings.xml" file under the "values" area of the folder. This is the file that holds the variables that are used in the app.

Open the "activity_main.xml" file. Voila! On the right pane, we can visualize how the app will look like when it is actually running. Don't be baffled. The default blank template comes with a "Hello world!" message already!

You may need to select the Graphical Layout tab to see this.

Now that we are done with the development, we need to run it, to see it live!

We have two options;

• Simulate on a virtual android device.
• Use a real android device.

We'll see how both work individually.

Running the app on a simulated device.

We have to first create a simulated device in order to run the app in it. Lets begin by clicking on the Window menu and selecting the Android Virtual Device Manager. Click New to add a new Android Virtual Device (AVD).

Give the AVD a name. I'll name it vijay. I've used Nexus 4 as the Device and "Android 4.2.2 - API Level 17" as the Target. All the remaining setting depend on the hardware configuration of your laptop or PC that is currently running the eclipse application. If you use host GPU, you'll have a faster emulation, at the cost of your laptop's graphic card! Additionally, you can select the snapshot option to optimize the speed. This will save the last state of the emulator while you close it, so that it will start quickly on your next run. (Obviously, the first run will be slower.) Close the Virtual Device Manager.

Select the "MainActivity.java" file from the Project Explorer by double clicking it. Click the run button on the tool bar or under the run menu (Ctrl + F11 is the shortcut). In the window that appears, select run as "Android Application" and click OK.

In the Android Device Chooser window, select the virtual device you just created and click OK. Now, wait patiently till the device boots up. This really tests the degree of patience in us, especially if the processor of your laptop is slow!

And when its done, its celebration time!

To maximize the emulator, use the shortcut Alt+Enter.
To change the orientation of the emulator, use Ctrl+F11.
To toggle network ON or OFF, use F8 key.


Running the app on a real device.

If you own a real android device, you could relish the fun of watching your first app perform in your own device. Firstly, you may need to enable "Developer options". It was openly available in previous versions of android. But from the version 4.2.2, they are hidden. To reveal this option, open "About device" from the settings menu and tap on the "Build number" several times. Now enable "USB debugging" under the Developer options. Connect the phone to your laptop. The USB driver will automatically be installed from the OEM site.

Now every time you click the run button in the eclipse application, you have an option to run the Android application on either the virtual device you created above or your phone.

Kudos! You've just experienced your first android app on your own phone!

Android app development - What lured me to it!

The invention of telephone was definitely one of the finest inventions of mankind! I'm quite fascinated on witnessing the development from the then wired, bulky telephones to the present wireless mobiles. The past decade has seen tremendous development in the way we interact with our fellow humans. I still remember the days when cordless phones were first used; I used to wonder how such a thing is even possible! And then there was this "pager", going viral among the business class. Within a few years, came the mobile phones. At that time, I didn't fathom that this technology would be the future of a revolution in the communication industry. Now I know exactly where we are heading to; at least in the present scenario dominated by the Android market!

Since the day I bought my first android device, I was always curious to know how things worked. I've always been raring to understand how android apps worked, but procrastinating, thinking that this was just for the computer geeks. But things proved wrong when I started experimenting. I'm writing this blog to share my experiences on how to develop apps for the android OS.

Lets get started straight away!

As of today's world, everything starts with a Google search! I too started off with those generic words, "how to create android apps".

The android development software is a freeware and can be downloaded from the following link. For the comfort of beginners, the download package consists of all prerequisites that are needed for the proper functioning of this software.

http://developer.android.com/sdk/index.html

After downloading the Android SDK from the above link, extract the contents of the file to the root folder. (i.e. C drive for most cases). You could extract them into a folder called "Development".
One word of caution is not to move or rename any of the folders. This may render certain internal links unusable and we may need to manually reestablish the links.

So finally, the installation path will be C:/Development/adt-bundle-windows-x86-20131030

Inside this "adt-bundle-windows-x86-20131030" folder, there are three folders (eclipse, sdk and workspace). We'll be developing apps using the "eclipse.exe" application in the "eclipse" folder. The workspace folder will contain the backups of the apps we develop. Additionally, there is one "SDK Manager.exe" application in the "adt-bundle-windows-x86-20131030" folder. This is used to install add-ons. For eg. the Android ADT will presently install only the  files required for running the apps in 4.4 (kitkat) version. If you want to run the app in a different platform, Jelly Bean say, you have to manually download the required files for version 4.2.

Now, give yourself a pat on the back for successfully installing the Android ADT. We'll see about displaying the generic "Hello world" message in our first android app in the next post!