Más contenido relacionado Similar a Android Cheatsheet by RapidValue Solutions (20) Android Cheatsheet by RapidValue Solutions4. Layouts
A UI of an android application can be drilled down into a variation of either of two standard layouts;
the list view or the grid view.
List View Grid View
4© RapidValue Solutions
6. Components Basic
An Android UI has the following basic elements;
Side Nav Right Nav
App Bar / Primary Toolbar
Bottom Bar
On-Screen Nav Bar
Floating Action Button
Content Area
6© RapidValue Solutions
7. Components App Bar
App
Title Menu Icon
Action IconNav Icon Filter Icon
7
The app bar, formerly known as the action bar in Android, is a special kind of toolbar that’s used for
branding, navigation, search, and actions.
© RapidValue Solutions
8. Components Bottom Sheet
8
A bottom sheet is a sheet of material that slides up from the bottom edge of the screen. Bottom sheets
are displayed only as a result of a user-initiated action, and can be swiped up to reveal additional content.
Bottom Sheet
© RapidValue Solutions
9. Components Chips
9
Chips represent complex entities in small blocks, such as a contact. They can contain a photo, short title
string, and brief information.
Compose
John Doe Jane SmithTo
Contact Chips
© RapidValue Solutions
10. Components Dialogs
10
Dialogs inform users about critical information, require users to make decisions, or encapsulate multiple
tasks within a discrete process.
Dialog
© RapidValue Solutions
11. Components Snackbars
11
Snackbars provide lightweight feedback about an operation by showing a brief message at the bottom of
the screen. Snackbars can contain an action.
SnackbarItem Deleted UNDO
© RapidValue Solutions
13. Gestures Common Touch Mechanics
13
A touch mechanic is what your fingers do on the screen, it may have multiple results, depending on the
context.
Touch Drag, Swipe, Fling Double Touch Long Press
1 Finger Mechanics
© RapidValue Solutions
14. Gestures Common Touch Mechanics
14
A touch mechanic is what your fingers do on the screen, it may have multiple results, depending on the
context.
Two-Finger Touch Pinch Open Pinch Closed Rotate
2 Finger Mechanics
© RapidValue Solutions
15. Gestures Drag, swipe, or fling
15
Swipe gesture activities vary based on context. The speed at which a gesture is performed is the primary
distinction between Drag, Swipe, and Fling.
Drag: Fine gesture, slower, more controlled, typically has an on-screen target
Swipe: Gross gesture, faster, typically has no on-screen target
Fling: Gross gesture, with no on-screen target
Gesture velocity impacts whether the action is immediately reversible.
A swipe becomes a fling based on ending velocity and whether the affected element has crossed a
threshold (or point past which an action can be undone).
A drag maintains contact with an element, so reversing the direction of the gesture will drag the
element back across the threshold.
A fling moves at a faster speed and removes contact with the element while it crosses the threshold,
preventing the action from being undone.
© RapidValue Solutions
16. Gestures Scroll
16
A scroll is a vertical or horizontal swipe in a single direction within the content body.
Vertical Scroll Horizontal Scroll
© RapidValue Solutions
17. Gestures Pan
17
A pan is an multi-directional one-finger or two-finger gesture that expands the field of view. Drag is
typically used with pan. Fling will maintain gesture velocity, resulting in a significant pan of the content
along the direction of the fling gesture.
Pan Two Finger Pan
© RapidValue Solutions
18. Gestures Dismiss
18
A dismiss gesture originates on a swipeable element, such as a list item or card, orthogonal to the
direction of scrolling.
Dismiss
© RapidValue Solutions
19. Gestures Edge Swipe
19
An edge swipe gesture originates outside of the screen to reveal off-screen content. It invokes content
separate from the current view.
Edge Swipe
© RapidValue Solutions
21. Animation Surface Reaction
21
Upon touch, the Android UI provides an instant visual confirmation at the point of contact. The visual
mechanism used to express this contact is called Touch Ripple.
Touch Ripple
Watch an online demo of a
Touch Ripple surface reaction
© RapidValue Solutions
22. Animation Material Responses
22
When a user triggers the creation of new element on screen, it should grow in size, starting from the point
of origin of the input.
Point of Origin
Watch an online demo of a
point of origin material response
When a card or separable element is activated, the card should lift to indicate an active state.
Lift on Touch
Watch an online demo of a
lift on touch material response
© RapidValue Solutions
24. www.rapidvaluesolutions.com www.rapidvaluesolutions.com/blog
+1 877-643-1850 contactus@rapidvaluesolutions.com
RapidValue is a leading provider of end-to-end mobility, omnichannel and cloud solutions to enterprises worldwide. Armed
with a large team of experts in consulting, UX design and application engineering, along with experience delivering global
projects, we offer a range of services across various industry verticals. RapidValue delivers its services to the world’s top
brands and Fortune 1000 companies, and has offices in the United States and India.
About RapidValue
A Cheetsheat by RapidValue Solutions - December 2015