user interface clasfses
DESCRIPTION
fTRANSCRIPT
![Page 1: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/1.jpg)
Romain Chiappinelli
![Page 2: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/2.jpg)
![Page 3: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/3.jpg)
![Page 4: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/4.jpg)
Views & View Events View Groups, AdapterViews & Layouts Menus & ActionBar Dialogs
![Page 5: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/5.jpg)
Activities usually display a user interface Android provides many classes for constructing user interfaces
![Page 6: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/6.jpg)
Key building block for UI components Occupy a rectangular space on screen Responsible for drawing themselves and for handling events
![Page 7: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/7.jpg)
Button ToggleButton Checkbox RatingBar AutoCompleteTextView
![Page 8: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/8.jpg)
View that can be clicked on to perform an action
![Page 9: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/9.jpg)
UIButton
![Page 10: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/10.jpg)
UIButton
![Page 11: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/11.jpg)
A 2-state Button checked/not checked state Light indicator showing state
![Page 12: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/12.jpg)
UIToggleButton
![Page 13: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/13.jpg)
UIToggleButton
![Page 14: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/14.jpg)
Another kind of 2-state button Checked/not checked
![Page 15: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/15.jpg)
UICheckbox
![Page 16: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/16.jpg)
UICheckbox
![Page 17: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/17.jpg)
A view comprising a row of stars the user can click or drag the stars to highlight some number of them
![Page 18: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/18.jpg)
UIRatingBar
![Page 19: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/19.jpg)
UIRatingBar
![Page 20: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/20.jpg)
An editable text field that provides completion suggestions as the user types in text
![Page 21: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/21.jpg)
UIAutoComplete TextView
![Page 22: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/22.jpg)
UIAutoComplete
![Page 23: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/23.jpg)
Set visibility: show or hide view Set Checked state Set Listeners: Code that should be executed when specific events occur Set properties: opacity, background, rotation Manage input focus: allow view to take focus, request focus
![Page 24: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/24.jpg)
User interaction Touch Keyboard/trackball/D-pad
System control Lifecycle changes
![Page 25: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/25.jpg)
Often handle events with listeners Numerous Listener interfaces defined by the View class
![Page 26: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/26.jpg)
OnClickListener.onClick() View has been clicked
OnLongClickListener.onLongClick() View has been pressed & held
![Page 27: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/27.jpg)
OnFocusChangeListener.� onFocusChange()
View has received or lost focus
OnKeyListener.onKey() View about to receive a hardware key press
![Page 28: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/28.jpg)
Views are organized in a Tree Displaying has multiple steps Measure – get dimensions of each View Layout – Position each View Draw – Draw each view
![Page 29: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/29.jpg)
Custom View subclasses can override various View methods
![Page 30: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/30.jpg)
onMeasure() Determine the size of this View and its children
onLayout() View must assign a size and position to all its children
onDraw() View should render its content
![Page 31: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/31.jpg)
onFocusChanged() View’s focus state has changed
onKeyUp(), onKeyDown() A hardware key event has occurred
onWindowVisibilityChanged() Window containing view has changed its visibility status
![Page 32: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/32.jpg)
An invisible View that contains other views Used for grouping & organizing a set of views Base class for view containers & layouts
![Page 33: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/33.jpg)
RadioGroup TimePicker DatePicker WebView MapView Gallery Spinner
![Page 34: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/34.jpg)
A ViewGroup containing a set of Radio Buttons (CheckBoxes) Only one button can be selected at any one instant
![Page 35: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/35.jpg)
UIRadioGroup
![Page 36: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/36.jpg)
UIRadioGroup
![Page 37: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/37.jpg)
UIRadioGroup
![Page 38: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/38.jpg)
A ViewGroup that allows the user to select a time
![Page 39: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/39.jpg)
UITimePicker
![Page 40: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/40.jpg)
UITimePicker
![Page 41: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/41.jpg)
UITimePicker
![Page 42: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/42.jpg)
A ViewGroup that allows the user to select a date
![Page 43: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/43.jpg)
UIDatePicker
![Page 44: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/44.jpg)
UIDatePicker
![Page 45: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/45.jpg)
UIDatePicker
![Page 46: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/46.jpg)
A ViewGroup that displays a web page
![Page 47: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/47.jpg)
UIWebView
![Page 48: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/48.jpg)
UIWebView
![Page 49: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/49.jpg)
UIWebView
![Page 50: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/50.jpg)
A ViewGroup that displays a Map
![Page 51: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/51.jpg)
UIGoogleMaps
![Page 52: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/52.jpg)
UIGoogleMaps
![Page 53: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/53.jpg)
AdapterViews are views whose children and data are managed by an Adapter Adapter manages the data and provides data views to AdapterView AdapterView displays the data Views
![Page 54: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/54.jpg)
AdapterView displaying a scrollable list of selectable items Items managed by a ListAdapter ListView can filter the list of items based on text input
![Page 55: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/55.jpg)
UIListView
![Page 56: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/56.jpg)
UIListView
![Page 57: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/57.jpg)
An AdapterView that provides a scrollable list of items User can select one item from the list Items managed by a SpinnerAdapter
![Page 58: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/58.jpg)
UISpinner
![Page 59: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/59.jpg)
UISpinner
![Page 60: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/60.jpg)
A ViewGroup showing a horizontally scrolling list Items managed by a SpinnerAdapter
![Page 61: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/61.jpg)
UIGallery
![Page 62: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/62.jpg)
UIGallery
![Page 63: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/63.jpg)
UIGallery
![Page 64: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/64.jpg)
UIGallery
![Page 65: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/65.jpg)
A generic Viewgroup that defines a structure for the Views it contains
![Page 66: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/66.jpg)
Child views arranged in a single horizontal or vertical row
![Page 67: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/67.jpg)
UILinearLayout
![Page 68: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/68.jpg)
UILinearLayout
![Page 69: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/69.jpg)
Child views are positioned relative to each other and to parent view
![Page 70: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/70.jpg)
UIRelativeLayout
![Page 71: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/71.jpg)
UIRelativeLayout
![Page 72: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/72.jpg)
Child views arranged into rows & columns
![Page 73: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/73.jpg)
UITableLayout
![Page 74: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/74.jpg)
UITableLayout
![Page 75: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/75.jpg)
Child views arranged in a two-dimensional, scrollable grid
![Page 76: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/76.jpg)
UIGridView
![Page 77: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/77.jpg)
UIGridView
![Page 78: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/78.jpg)
Activities support menus Activities can
Add items to a menu handle clicks on the menu items
![Page 79: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/79.jpg)
Options menu shown when user presses the menu button
Context View-specific menu shown when user touches and holds the view
Submenu A menu activated when user touches a visible menu item
![Page 80: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/80.jpg)
Options Menus
![Page 81: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/81.jpg)
Context Menus
![Page 82: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/82.jpg)
SubMenus
![Page 83: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/83.jpg)
Define menu resource in XML file Store in res/menu/filename.xml
![Page 84: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/84.jpg)
Inflate menu resource using Menu Inflater in onCreate…Menu() methods Handling item selection in appropriate on…ItemsSelected() methods
![Page 85: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/85.jpg)
HelloAndroid WithMenus
![Page 86: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/86.jpg)
HelloAndroidWithMenus
![Page 87: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/87.jpg)
HelloAndroidWithMenus
![Page 88: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/88.jpg)
Many other features supported Grouping menu items Binding shortcut keys to menu items Binding Intents to menu items
![Page 89: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/89.jpg)
Similar to Application Bar in many desktop applications Enables quick Access to common operations
![Page 90: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/90.jpg)
Shows play titles and one quote from the selected play Provides actions for the ActionBar Three main objects
QuoteViewerActivity TitleFragment QuoteFragment
![Page 91: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/91.jpg)
Screen is divided into tab & content areas Allows multiple Fragments to share single content area
![Page 92: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/92.jpg)
Each tab is associated with one Fragment Exactly one tab is selected at any given time Fragment corresponding to the selected tab is visible in the content area
![Page 93: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/93.jpg)
UITabLayout
![Page 94: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/94.jpg)
UITabLayout
![Page 95: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/95.jpg)
UITabLayout
![Page 96: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/96.jpg)
Independent subwindows used by Activities to communicate with user
![Page 97: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/97.jpg)
AlertDialog ProgressDialog DatePickerDialog TimePickerDialog
![Page 98: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/98.jpg)
UIAlertDialog ProgressDialog
![Page 99: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/99.jpg)
UIAlertDialog
![Page 100: User Interface Clasfses](https://reader030.vdocuments.site/reader030/viewer/2022032701/563dba90550346aa9aa6b6f1/html5/thumbnails/100.jpg)
User Notifications