Slide 1
Slide 1 text
Android Material Design
using AppCompat and Design
Support Library
Raka Westu Mogandhi
Onebit Brownbag Session
October 23th
Slide 2
Slide 2 text
App Structure
Slide 3
Slide 3 text
Key Components
●
App bar
●
Side Navigation View
●
CardView
●
Floating Action Button
Slide 4
Slide 4 text
Toolbar/Appbar
●
Formerly known as the action bar.
●
Used for branding, navigation, and most-used
actions.
●
Slide 5
Slide 5 text
Side Navigation View
●
Can be left or right.
●
Mainly used for
– Identity
– Top level navigation
Slide 6
Slide 6 text
Cards
●
Displaying content
composed of different
elements.
Slide 7
Slide 7 text
Floating Action Button
(FAB)
●
Used for
promoted
action.
●
For Example
– Add (on a list)
– Play (on an
music item)
Slide 8
Slide 8 text
Support Library
AppCompat v7+ Design Library
●
Backward support to API Level 7 (2.1)
●
Gradle usage:
– compile 'com.android.support:appcompat-v7:23.1.0'
– compile 'com.android.support:design:23.1.0'
– compile 'com.android.support:cardview-v7:23.1.0'
●
Slide 9
Slide 9 text
Why AppCompat?
●
Backward compatibility.
●
Consistent visual look across OS version.
●
Default template in Android Studio (1.4+).
Slide 10
Slide 10 text
Example
●
https://github.com/rakawestu/android-material-
example
Material Design Guidelines:
●
http://www.google.com/design/spec/material-des
ign/introduction.html