Android User Interface Design: Implementing Material Design for Developers

About This E-Book......Page 3
Title Page......Page 4
Copyright Page......Page 5
Dedication Page......Page 8
Contents at a Glance......Page 9
Contents......Page 10
Preface......Page 15
Acknowledgments......Page 16
About the Author......Page 17
Organization of This Book......Page 18
Conventions Used in This Book......Page 19
Part I: The Basics of Android User Interfaces......Page 21
A Brief History of Android Design......Page 22
General Concepts......Page 25
Interaction and Animation......Page 29
Typography......Page 30
The Android Design Website......Page 31
Do One Thing and Do It Well......Page 32
Play Nicely with Others......Page 35
Visuals, Visuals, Visuals......Page 38
Easy but Powerful......Page 39
Platform Consistency......Page 40
System Bars......Page 41
Notifications......Page 42
App Bar......Page 45
The FAB......Page 47
Supporting Multiple Devices......Page 48
Long Press......Page 49
Summary......Page 50
What Is a View?......Page 52
View IDs......Page 55
Understanding View Dimensions......Page 56
Displaying Text......Page 61
TextView......Page 62
EditText......Page 67
Button......Page 68
ImageView......Page 70
Views for Gathering User Input......Page 72
Other Notable Views......Page 77
Listening to Events......Page 81
Other Listeners......Page 82
Summary......Page 83
Understanding ViewGroup and the Common Implementations......Page 84
LinearLayout......Page 85
RelativeLayout......Page 88
AdapterView......Page 92
Toolbar......Page 98
Other Notable ViewGroups......Page 99
Encapsulating View Logic with Fragments......Page 101
The Fragment Lifecycle......Page 102
Giving Fragments Data......Page 103
Talking to the Activity......Page 104
Fragment Transactions......Page 107
The Support Library......Page 108
The CardView Library......Page 110
Design Library......Page 111
RecyclerView Library......Page 112
Summary......Page 113
Resource Qualifiers......Page 115
Understanding Density......Page 123
Raster Images......Page 125
Nine-Patch Images......Page 126
Layer List......Page 129
State List......Page 131
Level List......Page 134
TransitionDrawable......Page 135
ClipDrawable......Page 136
ShapeDrawable......Page 137
VectorDrawable......Page 141
AnimatedVectorDrawable......Page 144
RippleDrawable......Page 146
Strings......Page 147
Arrays......Page 149
Colors......Page 150
IDs......Page 151
Menus......Page 152
Summary......Page 153
Part II: The Full Design and Development Process......Page 154
User-Centered Design......Page 155
Defining Goals......Page 158
User Goals......Page 159
User Personas......Page 160
Device and Configuration Support......Page 161
High-Level Flow......Page 163
Wireframes......Page 166
Starting with Navigation......Page 169
Continuing with Content Pieces......Page 174
Wireframing a Detail Page......Page 176
Supporting Multiple Devices......Page 179
Naming Conventions......Page 180
Summary......Page 182
Organizing into Activities and Fragments......Page 184
Creating the First Prototype......Page 185
Tabs......Page 188
Navigation Drawer......Page 190
Tool Representation......Page 192
Tab Fragments......Page 199
Tool Details......Page 215
Working with Users......Page 221
Dynamic Goal......Page 222
Real User Feedback......Page 223
Summary......Page 226
Wireframes and Graphical Design......Page 228
Styles......Page 229
Flat Design......Page 230
Lighting......Page 231
Colors......Page 232
The Science......Page 233
Choosing Colors......Page 236
The Woodworking App......Page 240
Text Contrast......Page 241
Text Sizes, Styles, and Capitalization......Page 242
Text Shadows......Page 243
Custom Fonts......Page 244
Other Considerations......Page 246
Transparency and the 3× Rule......Page 247
Navigation and Transitions......Page 248
Designing Step-by-Step......Page 249
Summary......Page 257
Working with the Designer......Page 258
Slicing the Graphics Assets......Page 259
The Easy Slices......Page 260
Nine-Patch Images......Page 264
Generating Alternate Sizes......Page 269
Themes and Styles......Page 270
Breaking Comps into Views......Page 271
The Main Screen......Page 274
The Tool List......Page 285
The Tool Details......Page 299
Basic Testing Across Device Types......Page 305
Summary......Page 306
View Animations......Page 307
Property Animations......Page 309
Property Animation Control......Page 310
Type Evaluators......Page 311
Time Interpolators......Page 314
Key Frames......Page 317
ViewPropertyAnimator......Page 318
Animating Form Errors......Page 319
Animating Vector Icons......Page 323
Animating Raster Icons......Page 328
Simple Transitions......Page 330
Scene Transitions......Page 331
Activity Transitions......Page 334
Circular Reveal Transitions......Page 339
Summary......Page 342
Part III: Advanced Topics for Android User Interfaces......Page 343
Identifying Jank......Page 344
Using Systrace to Understand Jank......Page 346
Shrinking Images......Page 354
Using the Right Sizes......Page 356
Using an Image Cache......Page 360
Additional Performance Improvements......Page 366
View Holder Pattern......Page 367
Eliminating Overdraw......Page 370
Hierarchy Viewer......Page 379
Eliminating Unnecessary Views......Page 381
Custom Fonts......Page 382
Existing Spans......Page 387
Using Spans for Complex Text......Page 389
RecyclerView......Page 392
Adapter......Page 393
Summary......Page 394
General Concept......Page 396
Paint......Page 397
Working with Text......Page 398
A Simple Text Drawable......Page 399
A Better Text Drawable......Page 403
Working with Images......Page 406
Lighting Color Filter......Page 410
Color Matrix......Page 412
PorterDuff Image Compositing......Page 414
Round Images......Page 436
Gradient Fades......Page 439
Summary......Page 443
Measurement......Page 444
Layout......Page 445
Drawing......Page 446
Creating a Custom View......Page 447
Measuring......Page 449
Handling Layout......Page 450
Building the Bitmap......Page 451
Saving and Restoring State......Page 453
Summary......Page 461
Touch Input......Page 463
Creating a Custom View......Page 465
Creating the Initial Custom View Files......Page 466
Measuring......Page 472
Drawing......Page 475
Preparing for Touch Input......Page 481
Handling Touch Input......Page 486
Summary......Page 507
Application Description......Page 509
The Change Log......Page 510
Application Icon......Page 511
Creating an Icon the Easy Way......Page 512
Creating an Icon Manually......Page 513
Screenshots......Page 520
Feature Graphic......Page 522
Promotional Graphic......Page 525
Promoting Your App......Page 526
Amazon Appstore......Page 527
Using Full Screen Mode......Page 528
Determining the Device’s Physical Screen Size......Page 530
Determining the Device’s Screen Size in Pixels......Page 531
Checking for a Network Connection......Page 532
Checking if the Current Thread Is the UI Thread......Page 533
Custom View Attributes......Page 534
Index......Page 542
Code Snippets......Page 571