1. Android Application Development User Interface Ahsanul Karim [email_address] Sentinel Solutions Ltd. http://www.sentinelbd.com

6. User Interface Android Widget Toolbox Form Elements Tutorial (Contd.)- Custom Button 3. Open the res/layout/main.xml file and add the Button element: The android:background attribute specifies the drawable resource to use for the button background (which, when saved at res/drawable/android.xml, is referenced as @drawable/android). This replaces the normal background image used for buttons throughout the system. In order for the drawable to change its image based on the button state, the image must be applied to the background

7. User Interface Android Widget Toolbox Form Elements Tutorial (Contd.)- Custom Button 4. o make the button do something when pressed, add the following code at the end of the onCreate() method: Normal Pressed After Pressed

8. User Interface Android Widget Toolbox Form Elements Tutorial (Contd.)- Edit Text In this section, you will create a text field for user input, using the EditText widget. Once text has been entered into the field, the "Enter" key will display the text in a toast message. 1. Open the res/layout/main.xml file and add the EditText element (inside the LinearLayout ): 2.

9. User Interface Android Widget Toolbox Form Elements Tutorial (Contd.)- Edit Text 2. To do something with the text that the user types, add the following code to the end of the onCreate() method:

10. User Interface Android Widget Toolbox Form Elements Tutorial (Contd.)- Edit Text

11. User Interface Android Widget Toolbox Form Elements Tutorial (Contd.)- Check Box In this section, you will create a checkbox for selecting items, using the CheckBox widget. When the checkbox is pressed, a toast message will indicate the current state of the checkbox. 1. Open the res/layout/main.xml file and add the CheckBox element (inside the LinearLayout ):

12. User Interface Android Widget Toolbox Form Elements Tutorial (Contd.)- Check Box 2. To do something when the state is changed, add the following code to the end of the onCreate() method:

13. User Interface Android Widget Toolbox Form Elements Tutorial (Contd.)- Check Box

15. User Interface Android Widget Toolbox Form Elements Tutorial (Contd.)- Radio Button 2. To do something when each RadioButton is selected, you need an View.OnClickListener . In this case, you want the listener to be re-usable, so add the following code to create a new member in the HelloFormStuff Activity 3. Now, at the bottom of the onCreate() method, add the following:

16. User Interface Android Widget Toolbox Form Elements Tutorial (Contd.)- Radio Button

18. User Interface Android Widget Toolbox Form Elements Tutorial (Contd.)- Toggle Button 2. To do something when the state is changed, add the following code to the end of the onCreate() method: This captures the ToggleButton element from the layout, then adds an View.OnClickListener . The View.OnClickListener must implement the onClick(View) callback method, which defines the action to perform when the button is clicked. In this example, the callback method checks the new state of the button, then shows a Toast message that indicates the current state.

19. User Interface Android Widget Toolbox Form Elements Tutorial (Contd.)- Toggle Button

21. User Interface Android Widget Toolbox Form Elements Tutorial (Contd.)- Rating Bar

22. User Interface Android Widget Toolbox Auto Complete Tutorial To create a text entry widget that provides auto-complete suggestions, use the AutoCompleteTextView widget. Suggestions are received from a collection of strings associated with the widget through an ArrayAdapter In this tutorial, you will create a AutoCompleteTextView widget that provides suggestions for a country name.

23. User Interface Android Widget Toolbox Auto Complete Tutorial (Contd.) 1. Start a new project named HelloAutoComplete . 2. Create an XML file named list_item.xml and save it inside the res/layout/ folder. Edit the file to look like this: This file defines a simple TextView that will be used for each item that appears in the list of suggestions

24. User Interface Android Widget Toolbox Auto Complete Tutorial (Contd.) 3. Open the res/layout/main.xml file and insert the following: The TextView is a label that introduces the AutoCompleteTextView widget.

26. User Interface Android Widget Toolbox Auto Complete Tutorial (Contd.) 5. Inside the HelloAutoComplete class, add the string array:

27. User Interface Android Widget Toolbox Auto Complete Tutorial (Contd.) 6. Run the application

28. User Interface Android Widget Toolbox Auto Complete Tutorial (Contd.) 7. Recommended: This can be done with a <string-array< resource in your project res/values/strings.xml file. For example: 8. From source code: