1 of 73

� PCA20D04J � ANDROID APPLICATIONS DEVELOPMENT

Sivasankari.R ,Research Scholar, Department of Computer Applications ,SRM IST, Ramapuram

SRM INSTITUTE OF SCIENCE

AND TECHNOLOGY

RAMAPURAM CAMPUS

DEPARTMENT OF COMPUTER Applications

FACULTY OF SCIENCE AND HUMANITIES

2 of 73

Unit 2�

​

  • Views and viewgroups-Absolute layout, table layout, relative layout, frame and scrollv iew-Adapting to display orientation - Managing changes to screen orientation -Detecting orientation changes, Controlling  the orientation activity, Creating the user interface programmatically -Listening for UI notifications-designing user interface using views-Basic views-Picker views- List views-Displaying pictures and menus with -Using menus with views-Some additional views-Context Menu-Example program for Context menu-Option menu-Example program for -Optional Menu- Lab 6:Implement Date Picker

​

UNIT 2

2

3 of 73

Core Building Blocks

  • Activity
      • In Android, an activity is a window that contains the user interface of your applications which may contain widgets such as buttons, labels, textboxes, and so on.
      • An application can have zero or more activities. the main purpose of an activity is to interact with the user
      • An activity is a class that represents a single screen. It is like a Frame in AWT.
  • View
      • A view is the UI element such as button, label, text field etc. Anything that you see is a view.

​

UNIT 2

3

4 of 73

Core Building Blocks

  • Intent
      •  An intent is basically the “glue” that enables different activities from different applications to work together seamlessly, ensuring that tasks can be performed as though they all belong to one single application.
      • When your application has more than one activity, you often need to navigate from one to another.
      • In Android, you navigate between activities through what is known as an intent.
      • Intent is used to invoke components. It is mainly used to:
        • Start the service
        • Launch an activity
        • Display a web page
        • Display a list of contacts
        • Broadcast a message
        • Dial a phone call etc.

​

UNIT 2

4

5 of 73

Core Building Blocks

  • Service
      • Service is a background process that can run for a long time.
      • There are two types of services local and remote.
      • Local service is accessed from within the application whereas remote service is accessed remotely from other applications running on the same device.
  • Content Provider
      • Content Providers are used to share data between the applications.
  • Fragment
      • Fragments are like parts of activity.
      • An activity can display one or more fragments on the screen at the same time.

​

UNIT 2

5

6 of 73

Core Building Blocks

  • AndroidManifest.xml
      • It contains information about activities, content providers, permissions etc.
      • It is like the web.xml file in Java EE.

​

  • Android Virtual Device (AVD)
      • It is used to test the android application without the need for mobile or tablet etc.
      • It can be created in different configurations to emulate different types of real devices.

​

​

UNIT 2

6

7 of 73

Core Building Blocks

  • Android Emulator

​

      • The Android emulator is an Android Virtual Device (AVD), which represents a specific Android device.
      • We can use the Android emulator as a target device to execute and test our Android application on our PC.
      • The Android emulator provides almost all the functionality of a real device.
      • We can get the incoming phone calls and text messages.
      • It also gives the location of the device and simulates different network speeds.

UNIT 2

7

8 of 73

Views and ViewGroups

  • Views
    • An activity contains views and ViewGroups.
    • A view is a widget that has an appearance on screen.
    • Examples of views are buttons, labels, and textboxes.
    • A view derives from the base class android.view.View.

​

  • View Groups
    • One or more views can be grouped together into a ViewGroup.
    • A ViewGroup provides the layout in which you can order the appearance and sequence of views.
    • Examples of ViewGroups include LinearLayout and FrameLayout.
    • A ViewGroup derives from the base class android.view.ViewGroup.

UNIT 2

8

9 of 73

Views and ViewGroups

  • Android supports the following View Groups:
    • Linear Layout
    • Absolute Layout
    • Table Layout
    • Relative Layout
    • Frame Layout
    • Scroll View

UNIT 2

9

10 of 73

Views and View Groups-Linear Layout�

  • Linear Layout

​

    • Android Linear Layout is a view group that aligns all children in either vertically or horizontally.

​

    • The Linear Layout arranges views in a single column or a single row.

​

    • Child views can be arranged either vertically or horizontally.

UNIT 2

10

11 of 73

Views and View Groups-Linear Layout�

UNIT 2

11

12 of 73

UNIT 2

12

​

​

android:id

This is the ID which uniquely identifies the layout

android:baselineAligned

This must be a boolean value, either "true" or "false" and prevents the layout from aligning its children's baseline

android:divider

This is drawable to use as a vertical divider between buttons. You use a color value, in the form of "#rgb", "#argb", "#rrggbb", or "#aarrggbb".

android:gravity

This specifies how an object should position its content, on both the X and Y axes. Possible values are top, bottom, left, right, center, center_vertical, center_horizontal etc.

android:orientation

This specifies the direction of arrangement and you will use "horizontal" for a row, "vertical" for a column. The default is horizontal.

Views and View Groups-Linear Layout�

13 of 73

Views and View Groups-Linear Layout�

<?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=”100dp”

android:layout_height=”wrap_content”

android:text=”@string/hello” />

<Button

android:layout_width=”160dp”

android:layout_height=”wrap_content”

android:text=”Button”

android:onClick=”onClick” />

</LinearLayout>

UNIT 2

13

14 of 73

Views and View Groups –Absolute Layout�

  • Absolute Layout
    • The Absolute Layout enables you to specify the exact location of its children.

​

    • there is a problem with the Absolute Layout when the activity is viewed on a high resolution views will be improperly placed

​

    • For this reason, the Absolute Layout has been deprecated since Android 1.5

UNIT 2

14

15 of 73

Views and ViewGroups – Absolute Layout�

<AbsoluteLayout

android:layout_width=”fill_parent”

android:layout_height=”fill_parent”

xmlns:android=”http://schemas.android.com/apk/res/android” >

<Button

android:layout_width=”188dp”

android:layout_height=”wrap_content”

android:text=”Button”

android:layout_x=”126px”

android:layout_y=”361px” />

<Button

android:layout_width=”113dp”

android:layout_height=”wrap_content”

android:text=”Button”

android:layout_x=”12px”

android:layout_y=”361px” />

</AbsoluteLayout>

UNIT 2

15

16 of 73

Views and ViewGroups - TableLayout

  • Table Layout
    • The TableLayout groups views into rows and columns.
    • we use the <TableRow> element to designate a row in the table.
    • Each row can contain one or more views.
    • Each view can be placed within a row forms a cell.
    • The width of each column is determined by the largest width of each cell in that column

UNIT 2

16

17 of 73

Views and ViewGroups - TableLayout

<TableLayout

xmlns:android=”http://schemas.android.com/apk/res/android”

android:layout_height=”fill_parent”

android:layout_width=”fill_parent” >

<TableRow>

<TextView

android:text=”User Name:”

android:width =”120dp”

/>

<EditText

android:id=”@+id/txtUserName”

android:width=”200dp” />

</TableRow>

<TableRow>

<TextView

android:text=”Password:”

/>

<EditText

android:id=”@+id/txtPassword”

android:password=”true”

/>

</TableRow>

<TableRow>

<TextView />

<CheckBox android:id=”@+id/chkRememberPassword”

android:layout_width=”fill_parent”

android:layout_height=”wrap_content”

android:text=”Remember Password”

/>

</TableRow>

<TableRow>

<Button

android:id=”@+id/buttonSignIn”

android:text=”Log In” />

</TableRow>

</TableLayout>

UNIT 2

17

18 of 73

Views and View Groups –Relative Layout

  • Relative Layout
    • The Relative Layout enables you to specify how child views are positioned relative to each other.
    • The position of each view can be specified as relative to sibling elements or relative to the parent.
    •  you can align two elements by right border, or make one below another, centered in the screen, centered left, and so on.
    • By default, all child views are drawn at the top-left of the layout

UNIT 2

18

19 of 73

Views and View Groups –Relative Layout

<?xml version=”1.0” encoding=”utf-8”?>

<RelativeLayout

android:id=”@+id/RLayout”

android:layout_width=”fill_parent”

android:layout_height=”fill_parent”

xmlns:android=”http://schemas.android.com/apk/res/android” >

<TextView

android:id=”@+id/lblComments”

android:layout_width=”wrap_content”

android:layout_height=”wrap_content”

android:text=”Comments”

android:layout_alignParentTop=”true”

android:layout_alignParentLeft=”true” />

<EditText

android:id=”@+id/txtComments” android:layout_width=”fill_parent”

android:layout_height=”170px”

android:textSize=”18sp”

android:layout_alignLeft=”@+id/lblComments”

android:layout_below=”@+id/lblComments”

android:layout_centerHorizontal=”true” />

<Button

android:id=”@+id/btnSave”

android:layout_width=”125px”

android:layout_height=”wrap_content”

android:text=”Save”

android:layout_below=”@+id/txtComments”

android:layout_alignRight=”@+id/txtComments” />

<Button

android:id=”@+id/btnCancel”

android:layout_width=”124px”

android:layout_height=”wrap_content”

android:text=”Cancel”

android:layout_below=”@+id/txtComments”

android:layout_

​

UNIT 2

19

20 of 73

Views and View Groups –Relative Layout

  • that each view embedded within the Relative Layout has attributes that enable it to align with another view.
  • These attributes are as follows:

➤ layout_alignParentTop

➤ layout_alignParentLeft

➤ layout_alignLeft

➤ layout_alignRight

➤ layout_below

➤ layout_centerHorizontal

➤ android:layout_toEndOf

➤ android:layout_toRightOf

➤ android:layout_toLeftOf

➤ android:layout_toStartOf

UNIT 2

20

21 of 73

Views and ViewGroups -FrameLayout�

  • Frame Layout

​

    • The Frame Layout is a placeholder on screen that you can use to display a single view.
    • Views that you add to a Frame Layout are always anchored to the top left of the layout.
    • If you add another view (within the Frame Layout), the view will overlap the previous view

UNIT 2

21

22 of 73

Views and View Groups –Frame Layout�

<?xml version=”1.0” encoding=”utf-8”?>

<RelativeLayout

android:id=”@+id/RLayout”

android:layout_width=”fill_parent”

android:layout_height=”fill_parent”

xmlns:android=”http://schemas.android.com/apk/res/android” >

<TextView

android:id=”@+id/lblComments”

android:layout_width=”wrap_content”

android:layout_height=”wrap_content”

android:text=”Hello, Android!”

android:layout_alignParentTop=”true”

android:layout_alignParentLeft=”true” />

<FrameLayout

android:layout_width=”wrap_content”

android:layout_height=”wrap_content”

android:layout_alignLeft=”@+id/lblComments”

android:layout_below=”@+id/lblComments”

android:layout_centerHorizontal=”true” >

<ImageView

android:src = “@drawable/droid”

android:layout_width=”wrap_content”

android:layout_height=”wrap_content” />

</FrameLayout>

</RelativeLayout>

UNIT 2

22

23 of 73

Views and View Groups –Scroll View�

  • Scroll View
    • A Scroll View is a special type of Frame Layout in that it enables users to scroll through a list of views that occupy more space than the physical display.

​

    • The Scroll View can contain only one child view or ViewGroup, which normally is a LinearLayout.

UNIT 2

23

24 of 73

Views and View Groups –Scroll View�

ScrollView

android:layout_width=”fill_parent”

android:layout_height=”fill_parent”

xmlns:android=”http://schemas.android.com/apk/res/android” >

<LinearLayout

android:layout_width=”fill_parent”

android:layout_height=”wrap_content”

android:orientation=”vertical” >

<Button

android:id=”@+id/button1”

android:layout_width=”fill_parent”

android:layout_height=”wrap_content”

android:text=”Button 1” />

<Button

android:id=”@+id/button2”

android:layout_width=”fill_parent”

android:layout_height=”wrap_content”

android:text=”Button 2” />

<Button

android:id=”@+id/button3”

android:layout_width=”fill_parent”

android:layout_height=”wrap_content”

android:text=”Button 3” />

<EditText

android:id=”@+id/txt”

android:layout_width=”fill_parent”

android:layout_height=”600dp” />

<Button

android:id=”@+id/button4”

android:layout_width=”fill_parent”

android:layout_height=”wrap_content”

android:text=”Button 4” />

<Button

android:id=”@+id/button5”

android:layout_width=”fill_parent”

android:layout_height=”wrap_content”

android:text=”Button 5” />

</LinearLayout>

</ScrollView>

UNIT 2

24

25 of 73

Views and ViewGroups –ScrollView�

To prevent it from getting the focus, add the following two attributes to the

<LinearLayout> element:

​

<LinearLayout android:layout_width=”fill_parent” android:layout_height=”wrap_content” android:orientation=”vertical” android:focusable=”true” android:focusableInTouchMode=”true” >

UNIT 2

25

26 of 73

ADAPTING TO DISPLAY ORIENTATION�

  • Android supports two screen orientations: portrait and landscape.
  • By default, when you change the display orientation of your Android device, the current activity that is displayed automatically redraws its content in the new orientation.
  • This is because the onCreate() method of the activity is fired whenever there is a change in display orientation.

UNIT 2

26

27 of 73

ADAPTING TO DISPLAY ORIENTATION�

  • Anchoring — The easiest way is to “anchor” your views to the four edges of the screen. When the screen orientation changes, the views can anchor neatly to the edges
  • Resizing and repositioning — Whereas anchoring and centralizing are simple techniques to ensure that views can handle changes in screen orientation, the ultimate technique is resizing each and every view according to the current screen orientation.

UNIT 2

27

28 of 73

ADAPTING TO DISPLAY ORIENTATION�

<RelativeLayout

android:layout_width=”fill_parent”

android:layout_height=”fill_parent”

xmlns:android=”http://schemas.android.com/apk/res/android”>

<Button

android:id=”@+id/button1”

android:layout_width=”wrap_content”

android:layout_height=”wrap_content”

android:text=”Top Left”

android:layout_alignParentLeft=”true”

android:layout_alignParentTop=”true” />

<Button

android:id=”@+id/button2”

android:layout_width=”wrap_content”

android:layout_height=”wrap_content”

android:text=”Top Right”

android:layout_alignParentTop=”true”

android:layout_alignParentRight=”true” />

<Button

android:id=”@+id/button3”

android:layout_width=”wrap_content”

android:layout_height=”wrap_content”

android:text=”Bottom Left”

android:layout_alignParentLeft=”true”

android:layout_alignParentBottom=”true” />

<Button

android:id=”@+id/button4”

android:layout_width=”wrap_content”

android:layout_height=”wrap_content”

android:text=”Bottom Right”

android:layout_alignParentRight=”true”

android:layout_alignParentBottom=”true” />

<Button

android:id=”@+id/button5”

android:layout_width=”fill_parent”

android:layout_height=”wrap_content”

android:text=”Middle”

android:layout_centerVertical=”true”

android:layout_centerHorizontal=”true” />

</RelativeLayout>

UNIT 2

28

29 of 73

➤ layout_alignParentLeft — Aligns the view to

the left of the parent view

➤ layout_alignParentRight — Aligns the view to

the right of the parent view

➤ layout_alignParentTop — Aligns the view to

the top of the parent view

➤ layout_alignParentBottom — Aligns the view

to the bottom of the parent view

➤ layout_centerVertical — Centers the view

vertically within its parent view

➤ layout_centerHorizontal — Centers the view

horizontally within its parent view

UNIT 2

29

30 of 73

UNIT 2

30

31 of 73

LISTENING FOR UI NOTIFICATIONS

  • Users interact with your UI at two levels:
    • the activity level and
    • the view level.
  • At the activity level, the Activity class exposes methods that you can override.
  • Some common methods that you can override in your activities include the following:
    • onKeyDown
    • onKeyUp
    • onMenuItemSelected
    • onMenuOpened

32 of 73

LISTENING FOR UI NOTIFICATIONS

➤ onKeyDown — Called when a key was pressed and not handled by any of the views contained within the activity

➤ onKeyUp — Called when a key was released and not handled by any of the views contained within the activity

➤ onMenuItemSelected — Called when a panel’s menu item has been selected by the user

➤ onMenuOpened — Called when a panel’s menu is opened by the user

33 of 73

LISTENING FOR UI NOTIFICATIONS

public boolean onKeyDown(int keyCode, KeyEvent event)

{

switch (keyCode)

{

case KeyEvent.KEYCODE_DPAD_CENTER:

Toast.makeText(getBaseContext(),

“Center was clicked”,

Toast.LENGTH_LONG).show();

break;

case KeyEvent.KEYCODE_DPAD_LEFT:

Toast.makeText(getBaseContext(),

“Left arrow was clicked”,

Toast.LENGTH_LONG).show();

break;

case KeyEvent.KEYCODE_DPAD_RIGHT:

Toast.makeText(getBaseContext(),

“Right arrow was clicked”,

Toast.LENGTH_LONG).show();

break;

case KeyEvent.KEYCODE_DPAD_UP:

Toast.makeText(getBaseContext(),

“Up arrow was clicked”,

Toast.LENGTH_LONG).show();

break;

case KeyEvent.KEYCODE_DPAD_DOWN:

Toast.makeText(getBaseContext(),

“Down arrow was clicked”,

Toast.LENGTH_LONG).show();

break;

}

return false;

}

34 of 73

LISTENING FOR UI NOTIFICATIONS

  • View Level
    • When any user interacts with a view, the corresponding view fires event.
    • When a user touches a button or an image button or any such view we have to service the related service so that appropriate action can be performed.

​

35 of 73

Views in Android

  • Basic views — Commonly used views such as the TextView, EditText, and Button views
  • Picker views — Views that enable users to select from a list, such as the TimePicker and DatePicker views
  • List views — Views that display a long list of items, such as the ListView and the SpinnerView views
  • Specialized fragments — Special fragments that perform specific functions

36 of 73

BASIC VIEWS

➤ TextView

➤ EditText

➤ Button

➤ ImageButton

➤ CheckBox

➤ ToggleButton

➤ RadioButton

➤ RadioGroup

37 of 73

BASIC VIEWS

  • The TextView view is used to display text to the user.
  • This is the most basic view and one that you will frequently use when you develop Android applications.

​

  • EditText :If you need to allow users to edit the text displayed, you should use the subclass of TextView, EditText,

​

  • AutoCompleteTextView similar to EditText except that is shows a list of completion suggestion automatically while the user is typing

​

  • Button — Represents a push-button widget

​

38 of 73

BASIC VIEWS

  • ImageButton — Similar to the Button view, except that it also displays an image
  • EditText — A subclass of the TextView view that allows users to edit its text content
  • CheckBox — A special type of button that has two states: checked or unchecked
  • RadioButton has two states: either checked or unchecked.
  • RadioGroup is used to group together one or more RadioButton views, thereby allowing only one RadioButton to be checked within the RadioGroup.
  • ToggleButton — Displays checked/unchecked states using a light indicator

39 of 73

BASIC VIEWS

TextView View

​

<?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/hello” />

</LinearLayout>

40 of 73

BASIC VIEWS

<?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” >

​

<Button android:id=”@+id/btnSave”

android:layout_width=”fill_parent”

android:layout_height=”wrap_content”

android:text=”save” />

​

<ImageButton android:id=”@+id/btnImg1”

android:layout_width=”fill_parent”

android:layout_height=”wrap_content”

android:src=”@drawable/ic_launcher” />

<EditText android:id=”@+id/txtName”

android:layout_width=”fill_parent”

android:layout_height=”wrap_content” />

​

<CheckBox android:id=”@+id/chkAutosave”

android:layout_width=”fill_parent”

android:layout_height=”wrap_content”

android:text=”Autosave” />

​

ToggleButton android:id=”@+id/toggle1”

android:layout_width=”wrap_content”

android:layout_height=”wrap_content” />

​

​

41 of 73

BASIC VIEWS

RadioGroup android:id=”@+id/rdbGp1”

android:layout_width=”fill_parent”

android:layout_height=”wrap_content”

android:orientation=”vertical” >

​

<RadioButton android:id=”@+id/rdb1”

android:layout_width=”fill_parent”

android:layout_height=”wrap_content”

android:text=”Option 1” />

​

<RadioButton android:id=”@+id/rdb2”

android:layout_width=”fill_parent”

android:layout_height=”wrap_content”

android:text=”Option 2” />

</RadioGroup>

</LinearLayout>

42 of 73

ProgressBar View

ProgressBar View

​

  • The ProgressBar view provides visual feedback about some ongoing tasks, such as when you are performing a task in the background.

​

  • example, you might be downloading some data from the web and need to update the user about the status of the download.

43 of 73

ProgressBar View

<?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” >

​

<ProgressBar android:id=”@+id/progressbar”

android:layout_width=”wrap_content”

android:layout_height=”wrap_content” />

​

</LinearLayout>

44 of 73

ProgressBar View

ProgressDialog progressBar = new ProgressDialog(this);

progressBar.setCancelable(true);//you can cancel it by pressing back button  

progressBar.setMessage("File downloading ...");  

progressBar.setProgressStyle(ProgressDialog.STYLE_HORIZONTAL);  

progressBar.setProgress(0);//initially progress is 0  

progressBar.setMax(100);//sets the maximum value 100  

progressBar.show();//displays the progress bar  

​

45 of 73

ProgressBar View

public void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.main);

progress = 0;

progressBar = (ProgressBar) findViewById(R.id.progressbar);

//---do some work in background thread---

new Thread(new Runnable()

{

public void run()

{

//---do some work here---

while (progressStatus < 10)

{

progressStatus = doSomeWork();

}

//---hides the progress bar---

Using Basic Views ❘ 173

handler.post(new Runnable()

{

public void run()

{

//---0 - VISIBLE; 4 - INVISIBLE; 8 - GONE---

progressBar.setVisibility(View.GONE);

}

});

}

//---do some long running work here---

private int doSomeWork()

{

try {

//---simulate doing some work---

Thread.sleep(500);

} catch (InterruptedException e)

{

e.printStackTrace();

}

return ++progress;

}

}).start();

}

46 of 73

PICKER VIEWS�

  • Selecting the date and time is one of the common tasks you need to perform in a mobile application.

​

  • Android supports this functionality through the
    • TimePicker views
    • DatePicker views.

47 of 73

PICKER VIEWS -TimePicker

  • TimePicker View - The TimePicker view enables users to select a time of the day, in either 24-hour mode or AM/PM mode.

​

<?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” >

<TimePicker android:id=”@+id/timePicker” android:layout_width=”wrap_content”

android:layout_height=”wrap_content” />

</LinearLayout>

48 of 73

PICKER VIEWS -TimePicker

public void onCreate(Bundle savedInstanceState)

{

super.onCreate(savedInstanceState);

setContentView(R.layout.main);

timePicker = (TimePicker) findViewById(R.id.timePicker);

timePicker.setIs24HourView(true);

}

public void onClick(View view) {

Toast.makeText(getBaseContext(),“Time selected:” +timePicker.getCurrentHour() +“:” +timePicker.getCurrentMinute(),

Toast.LENGTH_SHORT).show();

}

49 of 73

PICKER VIEWS -DatePicker View

  • DatePicker : using the DatePicker, you can enable users to select a particular date on the activity.

<?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” >

<DatePicker android:id=”@+id/datePicker”

android:layout_width=”wrap_content”

android:layout_height=”wrap_content” />

</LinearLayout>

50 of 73

PICKER VIEWS -DatePicker View

datePicker = (DatePicker) findViewById(R.id.datePicker);

​

public void onClick(View view)

{

Toast.makeText(getBaseContext(), “Date selected:” + (datePicker.getMonth() + 1) + “/” + datePicker.getDayOfMonth() +

“/” + datePicker.getYear() + “\n” + “Time selected:” + timePicker.getCurrentHour() + “:” + timePicker.getCurrentMinute(),

Toast.LENGTH_SHORT).show());

}

51 of 73

LIST VIEWS

  • List views are views that enable you to display a long list of items.

​

  • In Android, there are two types of list views:
    • ListView and
    • SpinnerView.

​

  • Both are useful for displaying long lists of items.

52 of 73

LIST VIEWS - ListView

  • ListView View - The ListView displays a list of items in a vertically scrolling list.
  • The ListView displays a long list of items in an activity

​

​

public void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

//---no need to call this---

//setContentView(R.layout.main);

setListAdapter(new ArrayAdapter<String>(this,

android.R.layout.simple_list_item_1, presidents));

}

public void onListItemClick(

ListView parent, View v, int position, long id)

{

Toast.makeText(this,

“You have selected “ + presidents[position],

Toast.LENGTH_SHORT).show();

}

String[] presidents = {

“Dwight D. Eisenhower”,

“John F. Kennedy”,

“Lyndon B. Johnson”,

“Richard Nixon”,

“Gerald Ford”,

“Jimmy Carter”,

“Ronald Reagan”,

“George H. W. Bush”,

“Bill Clinton”,

“George W. Bush”,

“Barack Obama”

};

​

53 of 73

LIST VIEWS - ListView

Customizing the ListView

  • The ListView is a versatile view that you can further customize.
  • It allow multiple items in the ListView to be selected and how you can enable filtering support.

public void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

​

ListView lstView = getListView();

lstView.setChoiceMode(ListView.CHOICE_MODE_MULTIPLE);

lstView.setTextFilterEnabled(true);

setListAdapter(new ArrayAdapter<String>(this,

android.R.layout.simple_list_item_checked, presidents));

}

54 of 73

LIST VIEWS - Spinner View

  • The SpinnerView displays one item at a time from a list and enables users to choose among Long list of items.

<?xml version=”1.0” encoding=”utf-8”?>

<LinearLayout xmlns:android=”http://schemas.android.com/apk/res/android”

android:layout_width=”fill_parent” ndroid:layout_height=”fill_parent”

android:orientation=”vertical” >

​

<Spinner

android:id=”@+id/spinner1”

android:layout_width=”wrap_content”

android:layout_height=”wrap_content”

android:drawSelectorOnTop=”true” />

​

</LinearLayout>

55 of 73

LIST VIEWS - Spinner View

<?xml version=”1.0” encoding=”utf-8”?>

<resources>

<string name=”hello”>Hello World, BasicViews6Activity!</string>

<string name=”app_name”>BasicViews6</string>

<string-array name=”presidents_array”>

<item>Dwight D. Eisenhower</item>

<item>John F. Kennedy</item>

<item>Lyndon B. Johnson</item>

<item>Richard Nixon</item>

<item>Gerald Ford</item>

<item>Jimmy Carter</item>

<item>Ronald Reagan</item>

<item>George H. W. Bush</item>

<item>Bill Clinton</item>

<item>George W. Bush</item>

<item>Barack Obama</item>

</string-array>

</resources>

56 of 73

LIST VIEWS - Spinner View

​

presidents = getResources().getStringArray(R.array.presidents_array);

Spinner s1 = (Spinner) findViewById(R.id.spinner1);

ArrayAdapter<String> adapter = new ArrayAdapter<String>(this,android.R.layout.simple_spinner_item, presidents);

s1.setAdapter(adapter);

s1.setOnItemSelectedListener(new OnItemSelectedListener()

{

@Override

public void onItemSelected(AdapterView<?> arg0,

View arg1, int arg2, long arg3)

{

int index = arg0.getSelectedItemPosition();

Toast.makeText(getBaseContext(), “You have selected item : “ + presidents[index],Toast.LENGTH_SHORT).show();

}

public void onNothingSelected(AdapterView<?> arg0) { }

​

57 of 73

Gallery Views

  • The Gallery is a view that shows items (such as images) in a center-locked, horizontal scrolling list.

​

<?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”

<Gallery android:id=”@+id/gallery1” android:layout_width=”fill_parent” android:layout_height=”wrap_content” />

​

</LinearLayout>

58 of 73

Gallery Views

Integer[] imageIDs = {

R.drawable.pic1,

R.drawable.pic2,

R.drawable.pic3,

R.drawable.pic4,

R.drawable.pic5,

R.drawable.pic6,

R.drawable.pic7

};

​

Gallery gallery = (Gallery) findViewById(R.id.gallery1);

gallery.setAdapter(new ImageAdapter(this));

gallery.setOnItemClickListener(new OnItemClickListener()

{

public void onItemClick(AdapterView parent, View v, int position, long id)

{

Toast.makeText(getBaseContext(),“pic” + (position + 1) + “ selected”,

Toast.LENGTH_SHORT).show();

}

59 of 73

ImageSwitcher

  • Sometimes you don’t want an image to appear abruptly when the user selects it in the Gallery view
  • for example, you may want to apply some animation to the image when it transitions from one image to another.
  • In this case, you need to use the ImageSwitcher together with the Gallery view.

60 of 73

Image Switcher

61 of 73

GridView�

​

​

​

<GridView

android:id=”@+id/gridview”

android:layout_width=”fill_parent”

android:layout_height=”fill_parent”

android:numColumns=”auto_fit”

android:verticalSpacing=”10dp”

android:horizontalSpacing=”10dp”

android:columnWidth=”90dp”

android:stretchMode=”columnWidth”

android:gravity=”center” />

GridView gridView = (GridView) findViewById(R.id.gridview);

gridView.setAdapter(new ImageAdapter(this));

gridView.setOnItemClickListener(new OnItemClickListener()

{

public void onItemClick(AdapterView parent,

View v, int position, long id)

{

Toast.makeText(getBaseContext(),

“pic” + (position + 1) + “ selected”,

Toast.LENGTH_SHORT).show();

}

  • The GridView shows items in a two-dimensional scrolling grid.
  • the GridView can be used together with an ImageView to display a series of images.

62 of 73

GridView

63 of 73

MENUS

  • Options menu — Displays information related to the current activity.
  • In Android, you activate the options menu by pressing the MENU button.
  • Context menu — Displays information related to a particular view on an activity.
  • In Android, to activate a context menu you tap and hold on to it

64 of 73

MENUS

options menu

context menu

65 of 73

  • Helper Methods
  • Before you go ahead and create your options and context menus, you need to create two helper methods.
  • Creates a list of items to show inside a menu,
  • while the other handles the event that is fired when the user selects an item inside the menu.

MENUS

66 of 73

MENUS�

67 of 73

MENUS�

  • The CreateMenu() method takes a Menu argument and adds a series of menu items to it.
  • To add a menu item to the menu, you create an instance of the MenuItem class and use the add() method of the Menu object:

MenuItem mnu1 = menu.add(0, 0, 0, “Item 1”);

{

mnu1.setAlphabeticShortcut(‘a’);

mnu1.setIcon(R.drawable.ic_launcher);

}

  • The MenuChoice() method takes a MenuItem argument and checks its ID to determine the menu item that is selected.

​

68 of 73

MENUS

Arguments of add() method are as follows:

➤ groupId — The group identifier that the menu item should be part of. Use 0 if an item is not in a group.

➤ itemId — A unique item ID

➤ order — The order in which the item should be displayed

➤ title — The text to display for the menu item

69 of 73

Options Menu�

70 of 73

Context Menu�

71 of 73

72 of 73

73 of 73