Android Application Development Session-2From Beginner to Advanced

By : Ahesanali Sutharemail:ahesanali.suthar@gmail.com

Topics Covered1. Android Framework (Activity,Service,Broadcastreceiver,Content Providers)

2. Android Layout

3. Basic UI Widgets (Button,TextBox,Choice Box)

1. Android Framework ● Android App framework have four basic components which are listed

below

1. Activity.

2. Service.

3. Broadcast Receiver.

4. Content Providers

● We will see each component in small detail

1. Android Framework 1. Activity:

● An Activity is an application component that provides a screen with which users can interact in order to do something, such as dial the phone, take a photo, send an email, or view a map

● Each activity is given a window in which to draw its user interface. The window typically fills the screen.

● Activity handle events in short for a windows .NET programer Activity is a code that is generated when we place button in form and double click on it and Visual Studio IDE generate button1_click() method or function.

● Activity decides which Screen(in android terminology it's call View) to be diaplayed. We are designing the screen in xml fomrat as we seen in Hello word case we have main.xml which is view for hello word activity.

1. Android Framework: Activity● In Activity code we setting up the view we have to write following code.

setContentView(R.layout.main);

● Please note that we have to just mention R.layout.main not R.layout.main.xml.

● As discussed earlier(First PPT) please note that what ever views we are creating for screen, we are putting it in res/layout folder.

● There can be more than one activity in the app, and all activity must be declared in the manifest file as follow.

<activity android:name=".HelloWorldActivity" android:label="@string/app_name" >

<intent-filter><action android:name="android.intent.action.MAIN" /><category android:name="android.intent.category.LAUNCHER"

/></intent-filter>

</activity>

1. Android Framework: Activity● To declare activity in manifest file only <acivity> and </activity> tag is

enough but please note that in above there is also a <intent-filter> tag and inside intent-filter there is action and category tag. This is for declaring the activity which runs first when app is started. So from the category we can figure out that this is the LAUNCHER activity.

● We can set only one activity as a launcher activity.

● To read More About Activity Please read:http://developer.android.com/guide/components/activities.html

1. Android Framework: Activity

1. Android Framework: Service2. Service:

● Service is an application components that will run in background and do not have user-interface.

● Service is executing in background and provide result to activity so activity updates the user-interface.

● To user service in application we must have to register service in the manifest file like activity.

● To start service from activity Context.startService() is used.

1. Android Framework: Broadcast Receiver3. Broadcast Receiver:

● Android broadcast event when ever some specified actions like call state is changed (Incoming,outgoing),New Message,Battery is low etc.

● So broadcast receiver is the application component which receives these broadcast.

● To use broadcast receiver we have to declare it in android.manifest or we can register/unregister it from activity code.

<uses-permission android:name="android.permission.READ_PHONE_STATE" />

<receiver android:name=".BootReceiver"><intent-filter>

<action android:name="android.intent.action.BOOT_COMPLETED" />

</intent-filter></receiver>

1. Android Framework: Service● So when ever phone state is changed from IDLE to RINGING our

broadcast receiver is called and we can handle the event.

● Normally broadcast receiver have less time for execution so we should not have to do processing much in broadcast receiver instead we should have to start serivce and have more processing in service code.

1. Android Framework: Content Providers4. Content Providers:

● Content Providers are used for data operations like storing and retrieving the data.

● Content providers manage access to a structured set of data. They encapsulate the data, and provide mechanisms for defining data security .

● Content providers are the standard interface that connects data in one process with code running in another process. In short content provider are more or less same like class any driver which we are normally using database connection.

● To read more about content provider please check link:http://developer.android.com/guide/topics/providers/content-provider-basics.html

2. Android Layouts● A layout defines the visual structure for a user interface, such as the UI for

an activity or app widget. You can declare a layout in two ways:● Declare UI elements in XML. Android provides a straightforward XML

vocabulary that corresponds to the View classes and subclasses, such as those for widgets and layouts.

● Instantiate layout elements at runtime. Your application can create View and ViewGroup objects (and manipulate their properties) programmatically

● Common Layout used in app design1. Linear Layout2. Relative Layout3. List View4. Grid View

2. Android Layouts1. Linear Layout : To create linear layout we need to add below code in

layout xml file.Using linear layout we can put other controls either vertically

or horizontally which we can define by android:orientation attribute.<LinearLayout

android:layout_width="fill_parent"

android:layout_height="fill_parent"

android:paddingLeft="16dp"

android:paddingRight="16dp"

android:orientation="vertical" ></LinearLayout >

2. Android Layouts2.Relative Layout : is a view group that

displays child views in relative positions. The

position of each view can be specified as

relative to sibling elements.<?xml version="1.0" encoding="utf-8"?>

<RelativeLayout xmlns:android="http://schemas.android.

com/apk/res/android"

android:layout_width="fill_parent"

android:layout_height="fill_parent"

android:paddingLeft="16dp"

android:paddingRight="16dp" >

<EditText

android:id="@+id/name"

android:layout_width="fill_parent"

android:layout_height="wrap_content"

android:hint="@string/reminder" />

<Spinner

android:id="@+id/dates"

android:layout_width="0dp"

android:layout_height="wrap_content"

android:layout_below="@id/name" android:layout_alignParentLeft="true" android:layout_toLeftOf="@+id/times" />

<Spinner

android:id="@id/times"

android:layout_width="96dp"

android:layout_height="wrap_content"

android:layout_below="@id/name" android:layout_alignParentRight="true" />

<Button

android:layout_width="96dp"

android:layout_height="wrap_content"

android:layout_below="@id/times" android:layout_alignParentRight="true" android:text="@string/done" />

</RelativeLayout>

2. Android Layouts

2. Android Layout3.Listview : ListView is a view group that displays a list of scrollable items. The

list items are automatically inserted to the list using an Adapter that pulls

content from a source such as an array or database query.

● Lets take an example of network list displayed where we have to display

custom type of item.

2. Android LayoutMian Activty Layout screen

<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=".Network" >

<ListView

android:id="@+id/lvNetworkList"

android:layout_width="match_parent"

android:layout_height="match_parent"

android:scrollbars="vertical" >

</ListView>

</RelativeLayout>

2. Android LayoutList View Item Detail Desig<?xml version="1.0" encoding="utf-8"?><RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="fill_parent" >

<TextView android:id="@+id/txtNetworkName" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentLeft="true" android:layout_alignParentTop="true" android:layout_marginLeft="20dp" android:layout_marginTop="22dp" android:text="@string/network_name" android:textAppearance="?android:attr/textAppearanceLarge" />

<TextView android:id="@+id/txtNetworkType" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignLeft="@+id/txtNetworkName" android:layout_below="@+id/txtNetworkName" android:layout_marginTop="21dp" android:text="@string/network_type" android:textColor="#AAA" android:textAppearance="?android:attr/textAppearanceMedium" />

<TextView android:id="@+id/txtPortType" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignBaseline="@+id/txtNetworkType" android:layout_alignBottom="@+id/txtNetworkType" android:layout_alignParentRight="true" android:layout_marginRight="22dp" android:text="@string/port_type" android:textColor="#AAA" android:textAppearance="?android:attr/textAppearanceMedium" />

<TextView android:id="@+id/txtNetworkDscr" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignLeft="@+id/txtNetworkName" android:layout_alignRight="@+id/txtPortType" android:layout_below="@+id/txtNetworkName" android:text="@string/port_type" android:textColor="#AAA" android:textAppearance="?android:attr/textAppearanceSmall" />

</RelativeLayout>

2. Android LayoutAtcivity Code for Initialize listview

private ListView lvNetworkListCode = (ListView) findViewById(R.id.lvNetworkList);public ArrayList<NetworkModel> Networks = new ArrayList<NetworkModel>();lvNetworkListCode.setAdapter(adapter);

ItemAdapter adapter = new ItemAdapter(this,R.layout.network_item, Networks);

● Here NetworkModel is the model class have attributes of single item.

● ItemAdapter class is the important it has getView method which will iterate on models arraylist and print one byone item.

private final Context context;private ArrayList<NetworkModel> Ids;private final int rowResourceId;

public ItemAdapter(Context context, int resource,ArrayList<NetworkModel> objects) {

super(context, resource, objects);this.context = context;this.Ids = objects;this.rowResourceId = resource;

}

@Overridepublic View getView(int position, View convertView,

ViewGroup parent) {

LayoutInflater inflater = (LayoutInflater) context

.getSystemService(Context.LAYOUT_INFLATER_SERVICE);

View rowView = inflater.inflate(rowResourceId, parent, false);

txtNwNameCode = (TextView) rowView.findViewById(R.id.txtNetworkName);

txtNwDscrCode = (TextView) rowView.findViewById(R.id.txtNetworkDscr);

txtNwTypeCode = (TextView) rowView.findViewById(R.id.txtNetworkType);

txtPortTypeCode = (TextView) rowView.findViewById(R.id.txtPortType);

if (Ids.size() > 0) {// setting values from modeltxtNwNameCode.setText(Ids.get

(position).getNetworkName());txtNwDscrCode.setText(Ids.get

(position).getNetworkDescr());txtNwTypeCode.setText("N/W Type:

"+Ids.get(position).getNetworkType());txtPortTypeCode.setText("Port Type:

"+Ids.get(position).getPortType());

}return rowView;

}

3. Basic UI Widgets● In section we will see how to add basic UI controls like text-box,label,

button and checkbox.● Lets consider below UI if we wanted to design.

3. Basic UI WidgetsLayout Design<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="fill_parent" android:orientation="vertical" > <TextView android:layout_width="fill_parent" android:layout_height="wrap_content" android:text="@string/enterNameLable" /> <EditText android:id="@+id/nameTxt" android:layout_width="fill_parent" android:layout_height="wrap_content" android:hint="@string/enterNameHint" /> <CheckBox android:id="@+id/appendHelloCheck" android:layout_width="fill_parent" android:layout_height="wrap_content" android:text="@string/appendHello" /><RadioGroup android:id="@+id/radioGroup" android:layout_width="fill_parent" android:layout_height="wrap_content"> <RadioButton android:id="@+id/maleradio" android:layout_width="fill_parent" android:layout_height="wrap_content" android:text="@string/maleLbl"/>

<RadioButton android:id="@+id/femaleradio" android:layout_width="fill_parent" android:layout_height="wrap_content" android:text="@string/femaleLbl" /></RadioGroup><Button android:id="@+id/showDataBtn" android:layout_width="fill_parent" android:layout_height="wrap_content" android:text="@string/okBtnTxt" /> <TextView android:id="@+id/resultText" android:layout_width="fill_parent" android:layout_height="wrap_content" /> <ImageView android:src="@drawable/maktabah" android:layout_width="fill_parent" android:layout_height="wrap_content" android:contentDescription="@+string/Image" /></LinearLayout>

3. Basic UI Widgets

Activity Code:public class Tutorial1Activity extends Activity {

private Button showDataBtn;

private EditText userNametxt;private CheckBox appendCheck;private RadioGroup maleFemaleRadioGroup;private TextView resultantText;

/** Called when the activity is first created. */ @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.screen1); initViewCOntrols(); } public void initViewCOntrols() { userNametxt = (EditText) findViewById(R.id.nameTxt); appendCheck = (CheckBox) findViewById(R.id.appendHelloCheck); maleFemaleRadioGroup = (RadioGroup) findViewById(R.id.radioGroup); showDataBtn = (Button) findViewById(R.id.showDataBtn); resultantText = (TextView) findViewById(R.id.resultText); showDataBtn.setOnClickListener(showDataClickListener); }

OnClickListener showDataClickListener =new OnClickListener() {

@Overridepublic void onClick(View v) {

String userName = userNametxt.getText().toString();

if(userName.length()>0){

RadioButton maleFRadio = (RadioButton) findViewById(maleFemaleRadioGroup.getCheckedRadioButtonId());

if(appendCheck.isChecked()){

resultantText.setText("Hello "+userName+" \n You are"+maleFRadio.getText().toString());

}else{

resultantText.setText(userName+" \n You are"+maleFRadio.getText().toString());

}}else{

userNametxt.setError("Please Enter Name.");

}

}};

}

Questions?