Chrome for Android UI

Ramping-up

Android has a number of developer guides that are helpful for getting ramped up on general Android development. We recommend reading the following as primers for developing UI:

Colors and text styles

Chrome for Android has a color palette defined in //ui/android/java/res/values/color_palette.xml and a set of reusable semantic colors defined in //ui/android/java/res/values/semantc_colors_adaptive.xml. The semantic colors from semantc_colors_adaptive.xml should be used to ensure colors adapt properly for dark mode and can be consistently and easily updated during product-wide visual refreshes.

For more information on selecting the right color, see Night Mode on Chrome Android.

Text should be styled with a pre-defined text appearance from //ui/android/java/res/values-v17/styles.xml. If leading (aka line height) is needed, use org.chromium.ui.widget.TextViewWithLeading with app:leading set to one of the pre-defined *_leading dimensions in //ui/android/java/res/values/dimens.xml.

Widgets

The Chromium code base contains a number of wrappers around Android classes (to smooth over bugs or save on binary size) and many UI widgets that provide Chrome-specific behavior and/or styling.

These can be found in //components/browser_ui/widget/android/, //ui/android/, and //chrome/android/java/src/org/chromium/chrome/browser/widget/. There is an ongoing effort to consolidate all widgets in //components/browser_ui/widget/android.

MVC

UI development should follow a modified Model-View-Controller pattern. MVC base classes live in //ui/android/java/src/org/chromium/ui/modelutil.

The following guides introduce MVC in Chrome for Android: