Android NativeApp 10th Sep15 P91 Edited

8/19/2019 Android NativeApp 10th Sep15 P91 Edited

1/91

|7/8-R, 8/8-S MAP Tuesday, August 11-13, 2015| 7 March 2016, 10:01:54 AM |

1

ANDROID APPLICATION

APPROACH

Android follows code-behind approach

(a) Application Layout (UI Design) --> .xml

Ex. (test.xml)

(b) Logic File --> .java code

Ex. (JTest.java)

Android Application = Markup + Code

XML (Extensible Markup Language)

It is a not a programming language

It is a markup language which is used to design UI of the android

application (define activity)

All the information in xml follows tree order or hierarchical order

XML is used to define the app's user interface (define screen layout

& GUI controls)

JAVA

To provide the application logic

To implement the activities of application

NATIVE APP DETAILS

Technology : Android Native app

System Packages : import android.widgets.*;

Super Class : Activity or ActionBarActivity


2/91


2

HYBRID WEB APP DETAILS

Technology : Android Hybrid Web app

System Packages : import android. webkit.*;

Super Class : Activity or ActionBarActivity

ANDROID COMPILATION & EXECUTION PROCESS

Byte Code

Conversion

Application Source codes (.java)

Java Byte Code (.class)

java compiler (javac)

Dex compiler (dx)

Dalvik Byte Code (.dex)

Packing Tool (AAPT)

Target Output (.apk)


3/91


3

(i) Java Compiler (javac)

Javac is used to convert java source file (.java) into byte code

(.class)

Input : Source Code (.java)

Output : Java Byte Code (.class)

(ii) Dex compiler (dx tool)

dx tool is a platform specific tool

dx tool is used to convert all .class files (Java Byte Code) into single

.dex file (Dalvik Byte Code)

dex stands for "Dalvik Executable"

Input : Java Byte Code (.class)

Output : Dalvik Byte Code (.dex)

(iii) AAPT (apkbuilder)

It handles the packing process

It is a tool that will generate a ".apk file" from a "dex file + non-java

libraries + zipped resources" (this tool packages all non-compiled

resources(e.g. images), compiled resources & dex file into .apk file)

APK = dex file + zipped resources + any native libraries (non-java)

APK File Contents

resources.arsc classes.dex (dex files)

AndroidManifest.xml

res

META-INF


4/91


4

DIFFERENCE BETWEEN DVM & JVM

S.N DALVIK VM (DVM) JAVA VM (JVM)

1. It is a register machine It is a stack machine

2. It produces Dalvik executable code

(.dex)

It produces Java Bytecode

(.class)

3. Owned & maintained by Google Maintained by Oracle

FOUR IMPORTANT ELEMENTS IN GUI

1. Activity 2. UI Containers 3. UI Controls 4.Event

1. Activity

Basic building blocks for developing both native & web applications

Every GUI application starts with an Activity.

We can programmatically and manually create a activity, we can

inherit a activity from the Activity super class

Package: android.app.*;

2. Containers (Layouts)

A container for holding all controls

A container can contain another containers

Required package: android.widgets.*;

E.g. LinearLayout, RelativeLayout, FrameLayout, etc, ...

3. UI Widgets or UI Controls

UI element in Android applications

Each UI element in android can generate events


5/91


5

Used to create different GUI applications in android


E.g. TextView, Button, EditText, Spinner, etc,...

4. Event

Certain action in USER INTERFACE TECHNOLOGY

Each UI element can make an event in android application

Objects(components) can register themselves to register events of

interest

When an event happens, an appropriate method is called in all

listeners

A listener object must implement the interface corresponding to the

events, which means implementing all methods declared in the

interface

To handle Events, we write objects and methods which will be

invoked whenever a certain event happens.

E.g. Click event, Menu Event, Window event, etc.

5. Event Handling

A method which is responsible for handling an event is called

"Event Handling"


6/91


6

EVENT HANDLING IN JAVA

AIM

Write code to handle events that occur in a GUI

Create the appropriate interface and event handler methods for a

variety of event types

Register Event Listener

Fire

event

Fig: Event Handling in Java

In Java, the event handling concept is based on publisher-subscriber

pattern (ooad pattern)

Here publisher is called “server class” & subscriber is called “client

class”

Events and Event Source are the components of Server class

Event Listener and Event Handler are the components of client class

Event SourceEvent

Event Listener

Event Handler


7/91


7

(i) Events

Objects that describe what happened

Ex. Click, TextChanged, ValueChanged, etc

(ii) Event sources

It is a component of server class

The generator of an event

Ex. Button, TextView, ImageButton, etc,

(iii) Event Listener

It is a component of client class

Used to receive & handle the event Used to give the solution to event via Event Handler

(iv) Event Handler

It is a component of client class

A special method which gives the solution, when an event happens

Ex. “Button Click Event”

public void test(View v) {

// user code}

XML Event Handler (automated event handler)

(OR)

public void onClick(View v) {

// user code}

Java Event Handler (manual event handler)


8/91


8

7. TYPES OF EVENT

There are many types of events that are generated by android

Application.

These events are used to make the application more effective andefficient.

IMPORTANT EVENT LISTENERS & EVENT HANDLERS

S.N EVENT HANDLER EVENT LISTENER & DESCRIPTION

1. onClick() This is called when the user either clicks ortouches or focuses upon any widget likebutton, text, image etc.

2. onLongClick() This is called when the user either clicks ortouches or focuses upon any widget likebutton, text, image etc. for one or moreseconds.

3. onFocusChange() This is called when the widget loses itsfocus i.e. user goes away from the viewitem.

4. onKey() This is called when the user is focused on

the item and presses or releases a hardwarekey on the device.

5. onTouch() This is called when the user presses thekey, releases the key, or any movementgesture on the screen.

6. onMenuItemClick() This is called when the user selects a menuitem.

7. onCreateContextMenu() This is called when the context menu is

being built(as the result of a sustained "longclick)


9/91


9

IMPORTANT METHODS

(i) setText(CharSequence ch)

sets the text to UI elements like Button, TextView, etc

It takes only one argument

Return type: void

(ii) getText()

gets the text of UI elements like Button, TextView, etc

It does not take any arguments

Return type: CharSequence

I. UI WIDGETS

ANDROID UI WIDGETS

1. View

Create a view class

It is a base class for all UI widgets like Button, TextView, etc



10/91


10

Screenshot

2. Button

It represents the push button

A push button that can be pressed or clicked by the user to perform

an action

Buttons allow user tom perform some action

It is very similar to JButton in swing

Types of Buttons:

Button (Button)

Image Button (ImageButton)

Toggle Button (ToggleButton) Radio Button (RadioButton)

Important Methods


Sets the string value (text) of the button


11/91


11

It takes 1 argument

Return type : void

(ii) getText()

Gets the text of the button


Return type : CharSequence

Screenshot

3. TextView

It is used to set or get the messages (static message / dynamic

message)

It is very similar to JLabel in swing

Important Methods(i) setText(CharSequence ch)

Sets the string value (text) of the textview

It takes 1 argument

Return type : void


12/91


12

(ii) getText()

Gets the text of the textview



Screenshot

4. ImageButton

It is a special type of button

It is used for displaying images in android

Android supports 3 common image formats like PNG, JPG, GIF

along with 9 batch PNG Images

Images are stored in the directory "res/layout/drawable"

It is important to note that, all image filenames should be lowercase

and only contain letters, numbers & underscores


13/91


13

Important Methods of ImageButton

(i) setImageResource(int resId)

Sets the image to ImageButton

It takes 1 argument

Return type : void Image Id /drawable folder

(ii) setBackgroundColor(int color)

Set the background color to image

It takes 1 argument

Return type: void

Screenshot

Background

Color

Image of Image

Button


14/91


14

5. ImageView

Like ImageButton, It is the base element used for displaying

images in android

It is an alternative to ImageButton

Important Methods of ImageView

(i) setImageResource(int resId)

Sets the image to ImageButton

It takes 1 argument

Return type : void Image Id /drawable folder

(ii) setBackgroundColor(int color)

Set the background color to image

It takes 1 argument

Return type: void

Screenshot


15/91


15

6. EditText

It is the pre-defined subclass of TextView that includes rich editing

capabilities

It is used to create both single line textbox and multi-line textbox in

android

It allows the user to submit the runtime inputs

It is very similar to JTextField & JTextArea in java swing

Important Methods(i) setText(CharSequence ch)

Sets the string value (text) of the edittext

It takes 1 argument

Return type : void

(ii) getText()

Gets the text of the editext


Return type : Editable


16/91


16

Screenshot

7. CheckBox

It is used to select more than one option at a time

It present options to a user, usually in a multiple choice format.

CheckBox can be selected or deselected

Any number of check boxes in the group (none or some or all) can be

selected

It is similar to JCheckBox in swing

Important Methods


Sets the string value (text) of the checkbox

It takes 1 argument

Return type : void

(ii) getText()

Gets the text of the checkbox



17/91


17


(iii) setChecked(boolean checked)

Used to mark checkbox as checked or unchecked (changes

the checked state of this button)

Return type: void

(iv) isChecked()

It is used to find, whether checkbox is selected or not

It doesn't take any arguments

Return type: boolean

Screenshot


18/91


18

8. RadioButton

It is used to select only one option at a time

It present options to a user, usually in a multiple choice format.

It is similar to JRadioButton in java swing

Important Methods


Sets the string value (text) of the radio button

It takes 1 argument

Return type : void

(ii) getText()

Gets the text of the radio button




Used to mark radio button as checked or unchecked

Return type: void

(iv) isChecked()

It is used to find, whether checkbox is selected or not

It doesn't take any arguments



19/91


19

Screenshot

9. ToggleButton

It is a special type of button

It is used to display checked / unchecked (on/off) state on the

button (It is basically an on/off button with a light indicator )

Toggle button is very useful if you want to switch between two states.

A toggle button takes only two states ACTIVATED state &

DEACTIVATED state [or] ON state and OFF state.

The default value for on state is "ON" and for off state is "OFF".

This is the best alternative for radio buttons.

Important Methods


Sets the string value (text) of the toggle button

It takes 1 argument


20/91


20

Return type : void

(ii) getText()

Gets the current state (on state or off state) of toggle button




Used to mark toggle button as checked or unchecked

Return type: void

(iv) isChecked()

It is used to find, whether toggle button is selected or not


Screenshot

Event Listener : setOnCheckedChangeListener()

Event Handler : void onToggleClicked(View view) { ... }


21/91


21

10. RatingBar

It is used to get the rating from the user . (used to show rating in stars)

The rating bar shows number of stars in which the user can touch,

drag to set the value

The rating returns a floating-point number (e.g. 2.0, 3.0, 4.0, etc, ...)

It is an extension of SeekBar & ProgressBar

Android gives direct way to create the rating bars using in

the xml

Important Methods

(i) setRating(int float)

Sets the rating (the number of stars filled)

It takes 1 argument

Used to set the default value of the rating.

Ex. If we set the rating at 2.0f which means 2 stars will be

selected by default

Return type : void

(ii) getRating()

gets the current rating (used to get the value of the rating bar)


Return Type: float


22/91


22

ScreenShot

Event Listener : OnRatingBarChangeListener

Event Handler : void onRatingChanged(RatingBar rb, float rating,

boolean user)11. SeekBar

It is an extension of ProgressBar element

It is a kind of ProgressBar with draggable thumb.

It allows the selection of integer values using a natural user interface

It has a thumb that can be slided in order to choose a value between 0

& some maximum that can be set from the developer

The maximum value can be set either in the XML or programmatically.

Usage of SeekBar

It is used to adjust media player volume, set brightness of the screen,

seek a playing music etc.


23/91


23

Important Methods

(i) setProgress(int value)

sets the progress value (int value) of seekbar (sets the initial

value of seekbar)

It takes 1 argument

Return type : void

(ii) getProgress()

gets the current progress of seek bar (gets the current value of

seekbar)

Return type: int

Screenshot

Event Listener : OnSeekBarChangeListener

Event Handler :

1. onProgressChanged() : This is called when the progress level changes

2. onStartTrackingTouch() : This is called when the dragging starts

3. onStopTrackingTouch() : This is called when the dragging stops


24/91


24

12. Spinner

It is like the dropdown menu with multiple values from which the user

can select only one

It is used to select only one value (either none or one item) from the list

of options (set)

It is similar to JComboBox in swing

Important Methods of Spinner

(i) getSelectedItme()

Gets the selected item from JComboBox

Return Type : Object

(ii) getItemAtPosition(int pos)

Gets the index position of the currently selected item in the

spinner

Return Type : Object

(iii) setAdapter(SpinnerAdapter sp)

Sets the adapter object to spinner

Return type: void

Event Listener : OnItemSelectedListener\

Event Handler :public void onItemSelected(AdapterView parent, View v, int

position,long id) {

// user codesp.setText(items[position]);

}Spinner Object

public void onNothingSelected(AdapterView parent) {sp.setText("");


25/91


25

}Screenshot

13. TimePicker

It is used to select time. It allows user to select time by hour and

minute.

We cannot select time by seconds.


26/91


26

Screenshot

14. WebView

It is an extension of the view class that helps displays web content

If we want to deliver a web application (web apps) as a part of client

application, we can do it using webview Layout

It is used to display the web page inside the activity

It does not include any features of a fully developed web browser , such

as navigation controls or an address bar.

It doesn't support all features of a regular browser but we can enableJavascript inside our Web View and also override the Back button to

view if there are any history pages.


27/91


27

IMPORTANT METHODS

1. loadUrl(String url)

It is used to load a web page using an URL


Return Type: void

Ex.wb.loadUrl("www.google.com");

2. loadData(String htmlData, String mime, String Encoding)

It is used to load data from an HTML string

It takes 3 arguments

Return Type: void

Ex.String html= "A very basic WebView

demo!";

wb.loadData(html, "text/html", null);

Screenshot


28/91


28

II. UI LAYOUTS

LAYOUTS or CONTAINERS

Layout denotes the architecture of the application, where and how

the controls should be organized in the UI

It is classes that can have other components on it

So for creating a GUI, we need at least one container object

To design UI for an App, we need to know about Android Layout. It is

also known as ViewGroup.

1. Activity

Main screen in GUI

It is a top level layout with its own title, icon, settings menu (Action Bar)

It holds other UI Layouts & UI Widgets

2. LinearLayout

It is the simplest layout

It is a view group that arranges all children in a single direction vertically or horizontally (All the UI elements are displayed in a linear /

sequential fashion, either horizontally or vertically with help of

"android:orientation" attribute)

http://programmerguru.com/android-tutorial/android-layouts/http://programmerguru.com/android-tutorial/category/applications/http://programmerguru.com/android-tutorial/category/applications/http://programmerguru.com/android-tutorial/category/applications/http://programmerguru.com/android-tutorial/android-layouts/


29/91


29

Screenshot

3. RelativeLayout

It is the flexible layout for all

It is a view group, that displays child views in relative positions (All

the UI elements are arranged in relative to each other)

For ex, we can set a UI element to be positioned "above" or "below" or

"to the left of" or "to the right of" another control, referred to by its

unique identifier


30/91


30

Screenshot

4. FrameLayout

It is designed to display a stack of child view controls (UI widgets)

It allows the UI elements to be overlapped with each other

Multiple view controls (UI elements) can be added to this layout (This

can be used to show multiple controls within the same screen space)Screenshot


31/91


31

5. TableLayout

A table layout is a grid which contains rows & columns

It arranges its children in tabular view-Rows & Columns (All the

controls are arranged into rows & columns)

It is same as HTML table

is the parent and is its child. This is

similar to HTML and

can contain any UI elements like Button, TextView,

EditText, etc

Screenshot


32/91


32

6. ScrollView

It is a special type of FrameLayout that allows users to scroll through a

list of views that occupy more space than the physical display

Conditions

The ScrollView can contain only one child view or ViewGroup, which

normally is a LinearLayout.

Screenshot


33/91


33

7. AbsoluteLayout

It is used for placing UI elements at the exact location on the screen

using x and y co-ordinates

As shown below in the XML, for both EditText & Button 'x' & 'y'

coordinates have been specified via "android:layout_x" and

"android:layout_y"

Ex

http://schemas.android.com/apk/res/androidhttp://schemas.android.com/apk/res/android


34/91


34

Screenshot

8. GridLayout

It is a ViewGroup that displays items in a two-dimensional, scrollable

grid

It is an android layout that places its children in a rectangular grid

Screenshot


35/91


35

XML (UI Layer)

It is a markup language (not a programming language)

In android, XML files are used to define layout of Android apps and

store data

IMPORTANT XML ATTRIBUTES

S.N XML ATTRIBUTES MEANING

1. android:id

Syntax:

android:id=”@+id/name”

Ex.

android:id=”@+id/tb”

@ global variable

+ The plus symbol

indicates This is a new

resource name that must be

created & added to our

“R.class” file

Resource ID

id is used to identify the control in

the java code

Sets the identifier to UI views &

viewgroups (Ex. TextView, Button,

LinearLayout, etc, …)

2. android:layout_height

Ex.

android:layout_height=

”fill _parent”

(OR)


”match_parent”

Sets the layout height to UI

element

The height and width value can be

expressed using any of

the dimension units supported by

Android (px, dp, sp, pt, in, mm) or

with the following keywords:

fill_parent, match_parent,

wrap_content

match_parent: sets the dimension

http://developer.android.com/guide/topics/resources/more-resources.html#Dimensionhttp://developer.android.com/guide/topics/resources/more-resources.html#Dimension


36/91


36

(OR)


”wrap_content”

(OR)


”100dp” sets the custom

height using dp value

to match that of the parent

element. Added in API level 8 to

deprecate fill_parent

fill_parent: Sets the dimension to

match that of the parent element

wrap_content: Sets the dimensiononly to the size required to fit the

content of this element

dp value: we can set the custom

height & width using “dp” value

3. android:layout_width

Ex.

android:layout_width

=”fill_parent”


=”match_parent”


=”wrap_content”


=”55dp”

Sets the layout width to UI element

4. android:text

Ex.

Sets the text to UI elements

Sets the direct text using

assignment operator


37/91


37

android:text=”Hello World”

(OR)

android:text=”@string/lb”

Hello

World

Sets the indirect text using

file

5. android:textStyle

Ex.

android:textSyle=”bold”

android:textSyle=”normal”

android:textSyle=”italic”

Sets the styles for text to UI elements

(Ex. TextView, EditText, Button, etc)

6. android:textSize

Ex.

android:textSyle=”18sp”

Sets the text size to UI elements (Ex.

TextView, EditText, Button, etc)

7. android:textColor

Ex.

android: textColor =”#ffffff”

Sets the foreground color to UI

elements (Ex. TextView, EditText,

Button, etc)

8. android:background

Ex.

android: background=”12ffff”

Sets the background color to UI widgets

& Layouts (Ex. LinearLayout, TextView,

EditText, Button, etc)


38/91


38

9. android:src

Syntax:

android:src=”@drawable/

imageName”

Ex.

android:src=”@drawable/mit

”

mit.png

Sets the image or background

image to ImageView or

ImageButton

Supported formats: .png, .jpg, .gif

10 android:onClick

Ex.

android:onClick=”test”

// Event Handler

public void test(View v)

{

// code

}

Assign direct event handler to UIelements like Button, ImageButton(Automatic event handler)

NOTE

Difference b/w android:id=”@+id/name” & android:id=”@id/name”

android:id=”@+id/tb” means we are adding a new UI widget (view)

with the name tb in our “R.class” file

android:id=”@id/tb” means we are using or referring an already

defined UI widget (view) with the name tb in our “R.class” file


39/91


39

TERMINOLOGIES IN ANDROID

Screen Size

Screen size in android is grouped into categories small, medium, large,

extra-large, double-extra & triple-extra

Screen Density

Screen density is the amount of pixels within an area (like inch) of the

screen.

Generally it is measured in dots-per-inch (dpi).

Screen density is grouped as low, medium, high and extra high.

Resolution

Resolution is the total number of pixels in the screen

dp

Density Independent Pixel, it varies based on screen density

In 160 dpi screen, 1dp=1pixel

Except for font size, use dp always

dip

dip=dp. In earlier android versions dip was used & later changed

to dp

sp

Scale Independent Pixel, scale based on user’s font size

preference.

Fonts should use sp

px

Pixels-corresponds to actual pixels on the screen


40/91


40

in

Inches-based on the physical size of the screen

1 inch=2.54 centimeters

mm

Millimeters-based on the physical size of the screen

pt

Points-1/72 of an inch, based on the physical size of the screen

NOTE

Always use dp & sp only. sp for font size & dp for everything else (e.g.Height, Width, etc, …)

It will make UI compatible for android devices with different

densities

ACCESSING XML RESOURCES IN JAVA

All resources in XML can be accessed via findViewById() method in

java code

Ex.

objectname=< UI-Widget >findViewById(R.id.viewId);

Where,

can be Button, TextView, EditText, etc

Ex.

Button bt=(Button)findViewById(R.id.bb);


41/91


41

I. EXAMPLE OF TEXTVIEW DEMO

(Displaying Message using XML & Java)

Approach : Code-Behind

UI Design : XML

Logic : Java

1. XML CODE(test.xml)


42/91


42

2. JAVA CODEpackage com.example.textviewdemo;

import android.os.Bundle;

import android.app.Activity;

import android.widget.*;

// sub class should inherit the super class “Activity” public class JTest extends Activity {

TextView tv;

// called when activity is 1st created

@Override

protected void onCreate(Bundle savedInstanceState) {

super .onCreate(savedInstanceState);

// set the specific layout file for current screen

setContentView(R.layout.test );

// find XML resource

tv=(TextView)findViewById(R.id.tb);

// display message

tv.setText("Welcome to Android Programming...");

}

}


43/91


43

3. START AVD MANAGER


44/91


44

4. LIST OF EXISTING AVD DEVICES DETAILS


45/91


45

5. AVD CREATION


46/91


46

6. OUTPUT


47/91


47

EXAMPLE OF MATERIAL DESIGN APP CREATION IN ANDROIDSTUDIO

I. EXAMPLE OF TEXTVIEW DEMO USING ANDROID STUDIO

(Displaying Message using XML & Java)

Approach : Code-Behind

UI Design : XML

Logic : Java


48/91


48

Step 1: Project Creation in Android Studio


49/91


49

Step 2: SELECTION OF TARGET DEVICES


50/91


50

Step 3: ACTIVITY SELECTION IN ANDROID STUDIO


51/91


51

Step 4: HOME ACTIVITY DETAILS


52/91


52

1. XML CODE(test.xml) res/layout/test.xml

2. JAVA CODE(JTest.java)

package ganesh.pugazh.helloworld;

import android.support.v7.app.AppCompatActivity;


// current class must extend the super class “AppCompactActivity”

public class JTest extends AppCompatActivity {// called when activity is 1

st created

@Override




53/91


53

// set the specific layout file for current screen


}

}

3. START AVD MANAGER IN ANDROID STUDIO


54/91


54

4. LIST OF EXISTING AVD DEVICES DETAILS


55/91


55

5. AVD CREATION IN ANDROID STUDIO

5.1 HARDWARE SELECTION


56/91


56

5.2 VALID INSTALLED SYSTEM API IMAGE SELECTION


57/91


57

5.3 AVD DETAILS


58/91


58

5.4 AVD VERIFICATION & START AVD


59/91


59

5.5 START VIRTUAL MOBILE DEVICE (AVD)


60/91


60

6. OUTPUT

NOTE:

For classic native application, the current class must extend

“ Activity” super class

For material design native application, the current class must

extend “ AppCompactActivity” super class.


61/91


61

II. EXAMPLE OF TEXTVIEW DEMO

(Displaying Message w/o using XML)

AIM

Aim of this source code (.java) is used to display message without

using XML

Approach : Inline-Coding

UI Design : Java

Logic : Java

1. JAVA CODE

(JTest.java)

package com.example.textviewdemo;



import android.graphics.Color;


public class JTest extends Activity {

@Override



// Create TextView Object

TextView tv=new TextView(this);

// set the Text Size

tv.setTextSize(20.0f);

// display message

tv.setText("Good Morning :-)");

// set the TextView to Current Screen via setContentView

setContentView(tv);


62/91


62

}

}

2. OUTPUT


63/91


63

III. CHANGING THE BG COLOR & FG COLOR OF TEXTVIEW

(Displaying Message w/o using XML)

AIM

Aim of this code (.java) is used to change the background color &

fore color of TextView and display the message without using XML

Approach : Inline-Coding

UI Design : Java

Logic : Java1. JAVA CODE

(JTest.java)

package com.example.textviewdemo;import android.os.Bundle;import android.app.Activity;import android.graphics.Color;import android.view.*;import android.widget.*;public class JTest extends Activity {

protected void onCreate(Bundle savedInstanceState) {super .onCreate(savedInstanceState);

// Create TextView Object TextView tv=new TextView(this);

// Set the background color tv.setBackgroundColor(Color. parseColor ("#331e54"));

// set the foreground color tv.setTextColor(Color. parseColor ("#f7f7f7"));

// set the Text Sizetv.setTextSize(20.0f);

// display message tv.setText("Good Morning :-)");

// set the TextView to Current Screen via setContentView


64/91


64

setContentView(tv);}

}

USED METHODS

1. setText(CharSequence msg) Set the message to TextView

Here the message can be static message or dynamic message

This method takes only one argument

Return type: void

2. OUTPUT


65/91


65

IV. EXAMPLE OF BUTTON DEMO

(AUTOMATED EVENT HANDLER USING XML CODE)

Event : Click

Event Handler : test() onClick()

ANDROID EVENT HANDLER

In android, we can create two types of event handlers. They are:

1. XML Event Handler

This is automated approach

Here we can easily register the “event handler” by setting

android:onClick=”test” attribute in layout xml file

Ex.

2. Java Event Handler

This is manual approach

Here user is responsible for registering event, assigning event

& creating event handler using java code

public void onClick(View v){

// user code}


66/91


66

Ex.

Event Generator

Event Listener

Event Location

Event Handler

… Button bt;public void onCreate(Bundle b){

bt=(Button)findViewById(R.id.button);// register & assign events

bt.setOnClickListener(this);

}

// Event Handlerpublic void onClick(View v)

{// user code

}


67/91


67

1. INITIAL DESIGN

2. LAYOUT XML CODE(buttonexample.xml)


68/91


68

android:text="@string/l1" android:background="#0099e5" android:textColor ="#f7f7f7" android:textSize="18sp" android:textStyle="bold" android:onClick="test"

/> (Automatic event handler)

(string.xml)

ButtonDemo Settings

Hello world! Click Me

3. ACTIVITY JAVA CODE

package krish.pugazh.button1demo;

import android.os.Bundle; // supports Bundle class

import android.app.Activity; // supports Activity class (super class)

import android.view.*; // supports View & Menu classes

import android.widget.*; // supports UI elements like Button, … public class JButtonExample extends Activity {

// TextView Element Declaration

TextView tb;


69/91


69

// This method is called only ONCE, when activity is 1st created

@Override



// set the specific layout file to current screen via setContentView()

setContentView(R.layout.buttonexample);// find XML resources & map it to java widget

tb=(TextView)findViewById(R.id.tv );

}

// Button Code (Automated Event Handler)

public void test(View v) // XML Event handler

{

// Display the message tb.setText("Good Morning");

// Append the text message (add the text to end of the TextView) & display it

tb.append("Have a good day :-)");

}

}

USED METHODS

1. setText(CharSequence msg)

Set the message to TextView

Here the message can be static message or dynamic message


Return type: void

2. append(CharSequence msg) Add the text messages at the end of the TextView


Return type: void


70/91


70

4. OUTPUT

V. EXAMPLE OF BUTTON DEMO

(MANUAL EVENT HANDLER USING JAVA CODE)

AIM

Aim of this application is used to register & assign the event

handler to Button programmatically (manual) in java

Here user (client) is responsible for registering an event &

responding that event (event handler) Event location can be current class (via this keyword) or named

inner class or anonymous inner class.


71/91


71

1. UI LAYOUT CODE (.xml)(buttonexample.xml)

(string.xml)

ButtonDemo Hello world! Click Me


72/91


72

2. ACTIVITY CODE (.java)

(JButton2.java)

package krish.pugazh.button1demo;




import android.view.*;

// Sub class must extend Activity super class & implement OnClickListener

public class JButton2 extends Activity implements View.OnClickListener{

// TextView & Button Elements Declaration

TextView tb;

Button but;

// This method is called only when activity is 1st created

@Override

protected void onCreate(Bundle savedInstanceState)

{


// set the specific layout file to current screen via setContentView()

setContentView(R.layout.buttonexample);// find XML resources & map them to java widget

tb=(TextView)findViewById(R.id.tv );

but=(Button)findViewById(R.id.bt );

// registering event handler in same class

but.setOnClickListener(this);

}

// Button Code: Event Handler (Manual Approach)public void onClick(View v)

{

tb.setText("Hello World");

}

}


73/91


73

3. OUTPUT


74/91


74

V. EXAMPLE OF IMAGEBUTTON DEMO


Event : Click

Event Handler : info() onClick()

1. UI LAYOUT CODE (.xml)

(test.xml)

Input Image (.png)


75/91


75

/>

(string.xml)

ImageButton


(JTest.java)

import android.os.Bundle;import android.app.Activity;



public class JTest extends Activity {

TextView tw;

@Override

protected void onCreate(Bundle savedInstanceState) {super .onCreate(savedInstanceState);

// set the specific layout to current activity


// find XML resources & map them to java widget

tw=(TextView)findViewById(R.id.tb);

}

// Image Button Codepublic void info(View v)

{

tw.setText("This is Hike Image...");

}

}


76/91


76

3. OUTPUT3.1 SCREENSHOT1


77/91


77

3.2 SCREENSHOT2

ANDROID ALERTDIALOG CREATION

ALERT DIALOG

It is one of the most important and basic UI element in android

applications

“ AlertDialog.Builder ” is a built-in class, which is used to create the

“Alert Dialog”

It is used to display the dialog message with “ok” and “cancel” buttons

It is the sub class of Dialog class (Derived from Dialog class)


78/91


78

DERIVATIONObject

Dialog class

Alert Dialog

THREE REGIONS OR PARTS OF ALERT DIALOG

There are three parts in the alert dialog

1. Title

2. Content

3. Action Buttons

1. Title

It is an optional

It is used to add or set the heading message or title message to

the alert dialog

2. Content

It is used to show the message to the user (message to display)

This content can be a string message or a listview or any custom

view

3. Action Buttons

This is one of the important parts in the alert dialog

This is mainly used to interact with the user


79/91


79

It can be three types: positive button, negative button, neutral

button

We can add all these three buttons to the alert dialog. It depends

on the need

It is very important to note that, we can’t add more than actionbuttons in the alert dialog.

So an alert dialog can have maximum of one positive, one

negative & one neutral action button

Normally, positive action button is used to accept the action

(ok/yes)

Negative action button is used to cancel the action (no)

Neutral action button is used in neutral situations

It is important note that, each action buttons can make an event

IMPORTANT METHODS OF ALERTDIALOG INTERFACE

1. setTitle(CharSequence msg)

Sets the title message of dialog class


Return type: AlertDialog.Builder

2. setMessage(CharSequence msg)

Sets the message to display



3. setPostiveButton(CharSequence text,

DialogInterface.OnClickListener )


80/91


80

Sets the content message to positive button with event handler


1st argument is the content of button (the text to display in the

positive button)

2nd argument is the event handler of positive button (It is the

listener to be invoked when the +ive button is pressed)


4. setNegativeButton(CharSequence text,

DialogInterface.OnClickListener)

Sets the content message to negative button with eventhandler



negative button)

2nd

argument is the event handler of negative button


5. setNeutralButton(CharSequence text,

DialogInterface.OnClickListener)

Sets the content message to neutral button with event handler



neutral button)

2nd

argument is the event handler of neutral button



81/91


81

6. setIcon(Drawable icon)

It is used set the icon of the alert dialog box



7. show()

It is used to show the alert dialog box



VI. ALERTDIALOG DEMO


(alert.xml) [res/layout/alert.xml]


82/91


82

android:onClick="disp"

android:textSize="20sp"

android:background="#463014"

android:textColor ="#f7f7f7"

android:text="@string/lb"

/>

(string.xml) [/res/values/string.xml]

AlertDemo

Click


(JAlert.java) [/src/ram.pugazh.alertdemo/JAlert.java]

package ram.pugazh.alertdemo;

import android.os.Bundle;import android.view.*;

import android.app.*;

import android.content.DialogInterface;

// Sub class must extends the super class “Activity”

public class JAlert extends Activity {

// this method is called when an app is loaded

@Override



// set the specific layout to current screen

setContentView(R.layout.alert );

}


83/91


83

// Button Code (Event Handler)

public void disp(View v)

{

AlertDialog.Builder ab=new AlertDialog.Builder(this);

ab.setTitle("Message");

ab.setMessage("Good Morning");// Positive Button Event Handler

ab.setPositiveButton("OK", new DialogInterface.OnClickListener()

{

@Override

public void onClick(DialogInterface dialog, int id) {

// User Code }

});

NOTE

DialogInterface.OnClickListener

Interface used to allow the creator of a dialog to run some code when

an item on the dialog is clicked..

// This method will be called when a button in the dialog is clicked

// Parameters

dialog The dialog that received the click

id The button that was clicked (e.g. bt) or the position of the

item clicked

// Negative Button Event Handler

ab.setNegativeButton("Cancel", new

DialogInterface.OnClickListener()

{


84/91


84

@Override

public void onClick(DialogInterface dg, int id) {

dg.cancel();

}

});

ab.show(); // show the dialog }

}

3. OUTPUT3.1 SCREENSHOTS


85/91


85

3.2 SCREENSHOTS


86/91


86

CIRCLE BUTTON CREATION

ELEMENTS

1. Shape

The shape drawable. This must be the root element

Generally it is used to create beautiful layouts

Here, it is used to create circle button, ring button, square button,

line ,etc, …

It is the root element of drawable xml file

It must be placed in “/res/drawable/name.xml” folder

Important attributes

android:shape=”oval” create circle button

android:shape=”rectangle” create square button

android:shape=”ring” create ring button

android:shape=”line”

create straight line

2. Stroke

It is the sub element of “shape” element

It is used to set the border width & border color of button


android:width=”2dp” set the border width of button

android:color =”#000” set the border color of button

3. Corners



87/91


87

It creates rounded corners for the shape

It applies only when the shape is a rectangle.


android:topLeftRadius=”2dp” set the radius for the top-left

corner

android:topRightRadius=”2dp” set the radius for the top-right

corner

android:bottomLeftRadius=”2dp” set the radius for the bottom-left

corner

android:bottomRightRadius=”2dp” set the radius for the bottom-

right corner

4. Solid


A solid color to fill the shape (background color of the shape)


android:color =”#000” set a solid color to fill the shape


88/91


88

VI. CIRCLE BUTTON DEMO


Event : Click

Event Handler : info() onClick()


(circle.xml) [res/layout/circle.xml]


89/91


89

(circledesign.xml) [/res/drawable/circledesign.xml]

(string.xml) [/res/values/string.xml]

Cutebutton

Click


(JCircle.java) [/src/ram.pugazh.cutebutton/JCircle.java]


import android.app.*;


public class JCircle extends Activity {

@Override



setContentView(R.layout.circle);

}


90/91


90

// Circle Button Code

public void test(View v)

{

AlertDialog.Builder ab=new AlertDialog.Builder(this);

ab.setTitle("Circle Button");

ab.setMessage("Good Morning...");ab.setPositiveButton("OK", null);

ab.show();

}

}

3. OUTPUT3.1 SCREENSHOTS


91/91


3.2 SCREENSHOTS

Title

Message

Android NativeApp 10th Sep15 P91 Edited

Documents

Transcript of Android NativeApp 10th Sep15 P91 Edited