Developing Complex UI Part 1 Outputs

Div Button is pressed

Add Button is pressed



Sub Button is pressed

Mul Button is pressed



Developing Complex UI Part 1(Contd...)

Functional Logic for Calculator App..

package com.findandroidhub.democalculator;
import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.EditText;
import android.widget.TextView;
public class MainActivity extends Activity
{
 private EditText t1,t2;
 private Button b1,b2,b3,b4;
 private TextView tv;
 @Override
 protected void onCreate(Bundle savedInstanceState) {
  // TODO Auto-generated method stub
  super.onCreate(savedInstanceState);
  setContentView(R.layout.activity_main);
  t1=(EditText)findViewById(R.id.editText1);
  t2=(EditText)findViewById(R.id.editText2);
  b1=(Button)findViewById(R.id.button1);
  b2=(Button)findViewById(R.id.button2);
  b3=(Button)findViewById(R.id.button3);
  b4=(Button)findViewById(R.id.button4);
  tv=(TextView)findViewById(R.id.disp);

  b1.setOnClickListener(new View.OnClickListener() {
 
   @Override
   public void onClick(View v) {
    float a,b;
    a=Float.parseFloat(t1.getText().toString());
    b=Float.parseFloat(t2.getText().toString());
    float add=a+b;
    tv.setText("Your total is:"+add);
  
  
   }
  });
  b2.setOnClickListener(new View.OnClickListener() {
 
   @Override
   public void onClick(View v) {
    float a,b;
    a=Float.parseFloat(t1.getText().toString());
    b=Float.parseFloat(t2.getText().toString());
    float sub=a-b;
    tv.setText("Your total is:"+sub);
  
  
   }
  });
  b3.setOnClickListener(new View.OnClickListener() {
 
   @Override
   public void onClick(View v) {
    float a,b;
    a=Float.parseFloat(t1.getText().toString());
    b=Float.parseFloat(t2.getText().toString());
    float multi=a*b;
    tv.setText("Your total is:"+multi);
  
  
   }
  });
  b4.setOnClickListener(new View.OnClickListener() {
 
   @Override
   public void onClick(View v) {
    float a,b;
    a=Float.parseFloat(t1.getText().toString());
    b=Float.parseFloat(t2.getText().toString());
    float div=a/b;
    tv.setText("Your total is:"+div);
  
  
   }
  });


 }


}

Developing Complex UI Part 1

Layouts can be nested inside another layouts...

<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
  android:paddingLeft="10dp"
   android:paddingRight="10dp" >
   
    <TextView android:text="Welcome to the Calculator App"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:textSize="20sp"
        android:gravity="left"/>
    <EditText
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:hint="Enter the First Number"
        android:id="@+id/editText1"
        android:paddingTop="20dp"/>
   
    <EditText
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:hint="Enter the Second Number"
        android:id="@+id/editText2"
        android:paddingTop="20dp"/>
   
    <LinearLayout
        android:orientation="horizontal"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:weightSum="60"
        android:id="@+id/l1">
       
    <Button
        android:id="@+id/button1"
        android:text="Add"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight="30"
        />   
       
    <Button
        android:id="@+id/button2"
        android:text="Sub"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
         android:layout_weight="30"/>   
    </LinearLayout>
   
      <LinearLayout    
        android:orientation="horizontal"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:weightSum="60"
        android:id="@+id/l2"> 
       
        <Button
        android:id="@+id/button3"
        android:text="Mul"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight="30"
        />   
       
    <Button
        android:id="@+id/button4"
        android:text="Div"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
         android:layout_weight="30"/>        
       
        </LinearLayout>
          
     
    <TextView
        android:text="Your Result is"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:textSize="20sp"
        android:paddingLeft="80dp"/>
   
   
</LinearLayout>

Following is the UI :

 

Displaying the Name and Age of the user(Contd..)

Demo 3(Contd)

This is the business logic of the Demo3

package com.findandroidhub.demo3;

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

public class MainActivity extends Activity
{

private EditText t1,t2;
private Button b;
private TextView tv;

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
t1=(EditText)findViewById(R.id.editText1);
t2=(EditText)findViewById(R.id.editText2);
b=(Button)findViewById(R.id.button1);
tv=(TextView)findViewById(R.id.display);

b.setOnClickListener(new View.OnClickListener() {

@Override
public void onClick(View v) {

String name=t1.getText().toString();
int age=Integer.parseInt(t2.getText().toString());

tv.setText("Your details are:"+"\n"+"Name: "+name+"\n"+"Age: "+age);

}
});
}

}

Displaying the Name and Age of the user

Demo 3:

<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical"
    android:padding="10dp">
    <TextView
        android:text="Name"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:textSize="20sp"/>
    <EditText
        android:id="@+id/editText1"
        android:hint="Enter your name"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"/>
   
     <TextView
        android:text="Age"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:textSize="20sp"
        android:paddingTop="20dp"/>
   
      <EditText
        android:id="@+id/editText2"
        android:hint="Enter your age"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
       />
      <LinearLayout
          android:id="@+id/linear1"
          android:layout_width="match_parent"
          android:layout_height="match_parent"
          android:orientation="vertical"
          android:padding="20dp">
      <Button
          android:id="@+id/button1"

          android:text="Submit"
          android:layout_width="150dp"
          android:layout_height="wrap_content"
          android:layout_gravity="center"
       
          />
        <TextView
          android:id="@+id/display"
          android:text="Your Details are:"
          android:layout_width="match_parent"
          android:layout_height="match_parent"
          android:textSize="20sp"
          android:padding="20dp"
         
          />
      </LinearLayout>
     
</LinearLayout>

Finding the sum of two numbers(Contd..)

Demo 2 (Contd...)

The MainActivity.java file code which contains the logic for the addition of two numbers

package com.addition.demo2;
import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.widget.*;

public class MainActivity extends Activity
{

 EditText t1,t2;
 TextView display;
 Button b;

 @Override
 protected void
onCreate(Bundle savedInstanceState) { 

super.onCreate(savedInstanceState); 
setContentView(R.layout.activity_main); 

t1=(EditText)findViewById(R.id.editText1);
t2=(EditText)findViewById(R.id.editText2);
display=(TextView)findViewById(R.id.display); 
b=(Button)findViewById(R.id.button1);
 
b.setOnClickListener(new
View.OnClickListener() {
    
  
@Override
   public void
onClick(View v) {
   
float n1,n2;
   
n1=Float.parseFloat(t1.getText().toString());

   n2=Float.parseFloat
(t2.getText().toString());
  
 float sum=(float)n1+n2;  
 display.setText("Your Sum is "+sum);
  
  
}
  });
 }
}

Finding the Sum of two numbers

Demo 2:

The UI Code(activity_main.xml)

<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">
   
    <EditText
        android:id="@+id/editText1"
        android:hint="Enter a number"
   android:layout_width="fill_parent"
        android:layout_height="wrap_content"/>
   
    <EditText
        android:id="@+id/editText2"
        android:hint="Enter a number"
   android:layout_width="fill_parent"
        android:layout_height="wrap_content"/>
   
    <Button
        android:id="@+id/button1"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:text="Add"/>
   
    <TextView
        android:id="@+id/display"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:text="Your Sum is 0"
        android:layout_gravity="center"
        android:gravity="center"
        android:paddingTop="20dp"/>
   

   
</LinearLayout>

Developing and Running the Android Application (contd...)

Demo 1 (contd...)

In the last blog we designed the User Interface for our application. Now we will write the business logic so that when the user enters the name in the Edit Text and clicks on submit then the Application displays the User name.

The business logic is written in the java file. We have one java file with the name MainActivity.java.

Now write the following code in the MainActivity.java

package com.example.demo1;
import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.EditText;
import android.widget.TextView;
public class MainActivity extends Activity
{
 EditText name;
 Button submit;
 TextView display;

 @Override
 protected void onCreate(Bundle savedInstanceState) {
   super.onCreate(savedInstanceState);
   setContentView(R.layout.activity_main);
   name=(EditText)findViewById(R.id.editText1);
   display=(TextView)findViewById(R.id.textView1);
   submit=(Button)findViewById(R.id.button1);
   submit.setOnClickListener(new View.OnClickListener() {
   
    @Override
    public void onClick(View v) {
     String user_name;
     user_name=name.getText().toString();
     display.setText("Your Name is: "+user_name);
    
    
    }
   });
 }

}



 

Developing and Running the Android Application

Demo 1:

In order to design and develop android applications, you require two things: XML file and Java File.

Let's start with the Application.

First Go to the File Tab and create a new Android Project. Enter the Application name as Demo 1 and then click Next for 4 times followed by finish option. Sooner IDE will provide you activity_main.xml and MainActivity.java file.

Clear the content of the activity_main.xml file because I am goanna teach you how to design the UI from scratch.

 Start Writing:
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:padding="10dp">
   
    <EditText
        android:id="@+id/editText1"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:hint="Enter Your Name"/>
   
    <Button
        android:id="@+id/button1"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:text="Submit"/>
   
    <TextView
        android:id="@+id/textView1"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:text="Your Name is"
        android:textSize="30sp"
        />
   
</LinearLayout>

In order to complete this Demo, read the next blog with title Developing and Running the Android Application(contd...)

Android Architecture

Android architecture is a 4 layered structured.

1. Linux Kernel
2. Libraries and Android Runtime
3. Application Framework
4. Application

Linux Kernel is the bottom layer, above to it we have Libraries, Android Runtime with Application Framework as Middleware, and Application as the top most layer.

Linux Kernel is the core part of the android architecture which manages power, memory and hardware resources. In simple words, we can say that it acts as the interface between an application and the hardware. Moreover it also manages the device drivers required for proper functioning of the hardware such as Camera, Wi-Fi and etc. That's not the complete set, lot more drivers to go in the list.

 

Libraries and Android Runtime provides the support for database such as SQLite, Media Framework for audio and video, Web Kit for browsing support and many more. At the same time the Application built for android platform must be compiled. In order to accomplish the compilation we need a Dalvik Virtual Machine (DVM) which is provided by the Android Runtime. DVM is optimized for mobile devices solely responsible for running the application. It performs the work similar to your JVM.

 

Application Framework includes API's for making call, managing windows, content providers, location manager and contact manager. Prior to anything, it provides the classes and interfaces for developing an application.

 

Application is the top most layer where the user will find or interact with Home, Contacts, Browsers and etc.

 

Start With Your First App

To start with Android Application development, one must have the basic knowledge in Java, XML and SQLite database.

In my tutorial, I am using the Eclipse + ADT.

Steps for creating a new Android Application Project:

1. File-> New-> Android Application Project 

2. Enter the Application Name as Hello
3. Click on Next for 4 times.

4. Click Finish after noting down the Activity Name and Layout Name from the New Android Application window. By default it will be MainActivity and activity_main. For beginners it is advisable to leave it as the default ones.

 

Now you have successfully created your Android Application. Now it's the time to display " Say Hello to Android World " in the Virtual Device.

 

Note: You have to create a Virtual Device for testing the application before launching it in the real devices.

 

In order to display it locate the res folder within the Hello project. Expand the res folder. Within it you will find the values folder; Expand it and double click the strings.xml file.

 

Now select the hello(string) from the left pane of the Android Resources (default) window. On the right pane of the same window, you will find attributes for hello_world string. Modify the value to "Say Hello to Android World".

 

 

With this your First App is ready for test.

 

Launching the Application in the Android Virtual Device.

1. Click on the Project and Select Run as Android Application.

Within no time, your application will be launched in the AVD.



 

Introduction to the Android Platform

Android is one of the most popular mobile platform.
-- Basically it is a Platform with Linux Operating System.
-- It is backed by Google Inc. and OHA (Open Handset Alliance)
-- It uses SQLite Database
--Recent Android version (6.0) is Marshmallow

Before heading to the Android Development, one has to know the various platforms available for the Mobile.
1. Manufacturer Platform ( E.g. Apple, BlackBerry)
2. Third Party Platform (E.g. Windows)
3. Open Source Platform (E.g. Android, Symbian)

Now let's us explore the Android Platform which is a open source  platform. This platform can be deployed or installed over various mobile devices with different screen size, resolution, form factors and aspect ratio. In order to develop an application for the Android platform one must have the respective environment. For Android Applications, Eclipse + ADT or Android Studio and SDK is required.

 

Applications can also be of various types like either it can be Communication App, Entertainment App, Utility App, Productivity App, Travel App, Enterprise App, Social Networking App or an Web based App.

WhatsApp, Skype are the example of Communication App.

 

To download the Android Environment, follow the mentioned link

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