Image for post
Image for post

We Recommend Material Design Components

Here’s why

Nick Butcher
Aug 25 · 4 min read

Your app exists alongside other apps installed on a user’s phone. We therefore recommend that applications follow the Material Design guidelines to ensure that apps operate consistently, that patterns learned in one app can be used in another.

Android users expect your app to look and behave in a way that’s consistent with the platform. You should follow material design guidelines for visual and navigation patterns… — d.android.com/design

To implement this, use the Material Design Components (MDC) library. This blog post outlines the many benefits of using MDC, explaining why it’s our recommended solution.

Widgets

MDC provides styled versions of standard widgets making it easy to implement Material styling. For example Material offers styled versions of Buttons, Toolbars, CheckBoxes and more. If you use a MaterialComponents theme, then Material widgets will be instantiated instead of the stock components when you inflate a layout (by MDC’s View Inflater) so it’s easy to achieve Material styling without having to make large updates to your layouts:

All Material widgets extend their relevant AppCompat counterparts so they benefit from the same backported functionality or bug fixes.

Material widgets offer extra styling and functionality over their platform or AppCompat counterparts, for example MaterialButton offers a number of different display styles :

One of my favorite additions is TextViews being replaced with MaterialTextViews which add support for specifying line heights in TextAppearances. Handy.

As well as adding to existing widgets, MDC offers a number of new widgets, not available in the platform or AppCompat. You’ve likely seen Bottom Navigation, Bottom Sheet and Floating Action Buttons but might not have come across Chips, Date Picker or Time Picker.

Image for post
Image for post

For a complete list of components offered by the library, see the components section here.

Material Theming

Image for post
Image for post

Material Theming is a systematic way to customize Material Design to reflect your product’s brand. A Material Theme comprises color, typography and shape attributes. Customizing these will be automatically reflected in the components you use to build your app.

You can think of Material Theming as a design system for creating design systems 🤯. You configure the color, type and shape inputs and get out a complete design system for your brand.

Nick Rout goes in depth into each of the three sub-systems in the following posts:

Dark Theme

Image for post
Image for post

MDC widgets implement Material’s dark theme guidance, with many widgets adapting their colors to dark themes and offering elevation overlays to communicate elevation when shadows don’t read.

Chris Banes goes in depth about MDC’s dark theme support in this article:

Material Motion 🆕

Material Design provides guidance for screen transitions. Better than guidance alone, MDC now implements these patterns as Transitions ready to be dropped into your app.

Hunter Stich introduces you to the material motion library in this post:

Get Composed

Jetpack Compose is Android’s next-generation UI toolkit, currently in alpha. While it is not yet stable, it will offer an implementation of material components and material theming. Adopting MDC now will prepare your codebase for later adopting Jetpack Compose — it uses the same concepts, design vocabulary and components. It even becomes possible to ease your migration with libraries like MDC-Android Compose Theme Adapter which converts an MDC XML theme into a Compose MaterialTheme.

Material Recommendation

Hopefully it’s clear to see why we recommend building Android UI with Material Design Components. We’ve recently updated the File > New Project template in Android Studio to use MDC and set up a material theme for you, making it even easier to get started. If you haven’t already migrated to MDC, then check out our migration guide:

Android Developers

The official Android Developers publication on Medium

Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch

Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore

Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store