Day 4-User Interface

The Android Widget Toolbox

1.TextView

2.EditText

3.Spinner

4.Button

5.CheckBox

6.RadioButton

7.DatePicker

8.TimePicker

Layouts

1.FrameLayout

2.LinearLayout

3.RelativeLayout

4.TableLayout

5.AbsoluteLayout

6.GridLayout

7.Tab Layout

Date Picker Tutorial

To provide a widget for selecting a date, use the DatePicker widget, which allows the user to

select the month, day, and year, in a familiar interface.

1.We’ll create a DatePickerDialog, which presents the date picker in a floating dialog box at the press of a button.

2.When the date is set by the user, a TextView will update with the new  date.

1.Start a new project named HelloDatePicker.

2.Open the res/layout/main.xml file and insert the following:

This creates a basic LinearLayout with a TextView that will display the date and a Button that

will open the DatePickerDialog.

3. Open HelloDatePicker.java

4. add the following members to the class

5. Now we add following code in onCreate() method to capture View elements and add

listener to the Button

6. Now we show the dialog in button action

1.First, the content is set to the main.xml layout.

2.Then the TextView and Button elements are captured from the layout with 

findViewById(int).

3.A new View.OnClickListener is created for the Button, so that when it is clicked,

it will call  showDialog(int), passing the unique integer ID for the date picker

dialog.

4.Using showDialog(int) allows the Activity to manage the life-cycle of the dialog

  and will call the onCreateDialog(int) callback method to request the Dialog that

      should be displayed.

5. Now we need to add a DataSetListener which will invoke when user selects a date

6. Now we see

6. Now we add this method to show the date in display TextView

7. We set the selected date in DatePicker and get it from callback

8. We add the following code to initiate with current date

2. onCreate

3. callback method for creating dialog

4. Initialize a new 

DatePickerDialog.OnDateSetListener 

for when the user has set the date 

(by clicking the "Set" button)

Time Picker Tutorial

To provide a widget for selecting a date, use the TimePicker widget, which allows the user to

select the hour and minute in a familiar interface.

1.We’ll create a TimePickerDialog, which presents the date picker in a floating dialog box at the press of a button.

2.When the time is set by the user, a TextView will update with the new  time.

Do it yourself !!! :D

Hints:

NEXT: Spinners & Form Elements