Upload
desmart
View
731
Download
1
Embed Size (px)
Citation preview
Material Design - dev's perspective
App layout changes,
a lot of new APIs making view transitions and animations Activity easier... … to apply on Lollipop only,
possibility to set z-index to views so that framework could render real time shadows ... … and for the remaining 99% of the devices we will make them as graphics.
Styles
For Android 5.0+:
Material.Light Material.Dark
For AppCompat:
Theme.AppCompat.Light ThemeAppCompat.Dark
Styles
android:colorPrimary
android:colorPrimaryDark
android:colorAccent
android:statusBarColor (inherited by default from colorPrimaryDark)
when using AppCompat write attributes without android namespace.
Toolbar
ActionBar class generalization,
it can be placed at any level of view hierarchy,
you can have multiple Toolbar instances in your layout,
you can set Toolbar as a replacement for standard ActionBar in your Activity.
Toolbar as ActionBar (in AppCompat)
Set the correct style so that the framework won't draw standard ActionBar (using Theme.AppCompat.NoActionBar for example),
add Toolbar to your layout,
make your Activity extend ActionBarActivity,
and in your Activity: Toolbar toolbar = findViewById(R.id.toolbar); setSupportActionBar(toolbar);
Toolbar
You can add child components to the Toolbar which inherits from ViewGroup,
Toolbar containing a SwitchCompat in Google Inbox app:
RecyclerView
ListView 2.0,
RecyclerView is a flexible view providing a limited window into a large data set,
it uses plugable classes for drawing, animating and positioning child components,
it’s available as a separate library com.android.support:recyclerview-v7
RecyclerView - Adapter, ViewHolder
Provides access to data layer,
creates layout for each element and fills it with data,
RecyclerView uses new interface for Adapter called RecyclerView.Adapter…
…so say bye bye to CursorAdapter, ArrayAdapter etc.
it uses convertView and holder pattern by default.
RecyclerView - LayoutManager
Responsible for measuring and positioning elements in RecyclerView,
responsible for cleaning views from memory which are no longer visible to the users,
application will throw exception if we don’t set LayoutManager for RecyclerView,
Google provides two standard implementations for this class: LinearLayoutManager and GridLayoutManager.
RecyclerView - ItemDecoration
Simple class responsible for additional view decorations,
it’s optional to use it,
you can add a couple of decorations to one RecyclerView,
all decorations are drawn in the same order as they've been added using onDraw() and onDrawOver() methods.
RecyclerView - ItemAnimator
Class which animates collection elements,
animates elements while adding / deleting them from collection and when element movement is required,
if we don’t prepare our custom ItemAnimator the Recycler will use default implementation.
RecyclerView - ItemAnimator
notifyDataSetChanged()
Instead of it we use:
notifyItemInserted(int position); notifyItemRemoved(int position);
notifyDataSetChanged() is bleah!
RecyclerView - Summary
We put RecyclerView to the layout,
we get its references in our Activity or Fragment,
we attach LayoutManager,
we attach adapter with data,
we add as many ItemDecorators as we need,
if we need our own animations we add our custom ItemAnimator.
CardView
ViewGroup with predefined „card” background,
allows to set elevation on each system version,
this class is available as a separate library com.android.support:cardview-v7
Palette
Picks colors from given bitmap,
there are two methods to pick the colors: public static generate(Bitmap) public static generateAsync(Bitmap)
Class tries to assign colors as Vibrant or Muted.
Z-Index/Elevation
ViewCompat.setElevation(View, float),
method above helps us avoid checking at runtime OS versions the app works on,
shadows will be rendered only for Android 5.0.
Activity transitions
API 21 makes it easy to animate elements from one Activity to another,
it’s also possible to set unshared elements enter and exit animations.
Activity transitions
In styles android:windowContentTransitions true
we specify animations in xml,
we set enter and exit animations for shared elements in xml or in code,
we set attribute “transitionName” on the element we want to animate,
we use method ActivityOptions.makeSceneTransitionAnimation(Context, View, String);
CircularReveal
Animator anim = ViewAnimationUtils.createCircularReveal(view, x, y, 0, radius);
myView.setVisibility(View.VISIBLE);
anim.start();
That’s all folks!
mail: [email protected]: www.desmart.comblog: www.desmart.com/blog