No content

+AndroidDevelopers ANDROID TEXTUAL LAYOUT Raph Levien +RaphLevien @raphlinus Android UI Toolkit @AndroidDev 

SECTION TITLE OUTLINE 

OUTLINE +AndroidDevelopers @AndroidDev Challenges and Opportunities Material Design Roboto 2 Noto fonts OpenType typography features High quality paragraph layout 

SECTION TITLE CHALLENGES AND OPPORTUNITIES 

CHALLENGES AND OPPORTUNITIES +AndroidDevelopers @AndroidDev Challenge Opportunity Battery and RAM constraints 60 fps Small screen Support ~all the scripts of the world Small text regions Powerful compute resources Animations and transitions Very high resolution (500+ dpi) Roboto and Noto fonts Line breaking improvements 

SECTION TITLE DISPLAY TECHNOLOGY 

DISPLAY TECHNOLOGY +AndroidDevelopers @AndroidDev Photo credit: Peter Dassow Sharp PC-1211 pocket computer, ca 1980 

DISPLAY TECHNOLOGY +AndroidDevelopers @AndroidDev Laptop ~100ppi HTC One m7 468ppi 4k monitor 200ppi inkjet printer 360ppi 

DISPLAY TECHNOLOGY +AndroidDevelopers @AndroidDev Nexus 6P 1440 x 2560 pixels 515 ppi 

SECTION TITLE MATERIAL DESIGN 

MATERIAL DESIGN (L+) +AndroidDevelopers @AndroidDev ● An entire design language ● Widely adopted ○ Web and Android apps ● Typography is integral ○ Multiple weights and sizes ○ Layout, alignment, space https://www.google. com/design/spec/style/typograph y.html 

ROBOTO 2 (L+) +AndroidDevelopers @AndroidDev ● Updated design ● Expanded Unicode coverage ○ 1051 → 3296 glyphs ○ Unicode 8 for Latin, Greek Cyrillic ● 18 weights/styles shipping on device ○ Thin, Light, Regular, Medium, Bold, Black ○ True italics ○ Condensed ● Fully open source (including build chain) ○ https://github.com/google/roboto 

ROBOTO 2: DESIGN UPDATE +AndroidDevelopers @AndroidDev 

ANDROID’S GLOBAL REACH 

THE NEXT BILLION USERS 

ROBOTO 2: UNICODE COVERAGE 

SECTION TITLE NOTO FONTS 

NOTO SCRIPT SUPPORT IN MARSHMALLOW Arabic, Armenian, Balinese, Bamum, Batak, Bengali, Buginese, Buhid, Canadian Aboriginal, Cham, Cherokee, Coptic, Devanagari, Ethiopic, Georgian, Glagolitic, Gujarati, Gurmukhi, Hanunoo, Hebrew, Javanese, Kannada, Kayah Li, Khmer, Lao, Lepcha, Limbu, Lisu, Malayalam, Mandaic, Meetei Mayek, Mongolian, Myanmar, N'Ko, New Tai Lue, Ol Chiki, Oriya, Rejang, Saurashtra, Sinhala, Sundanese, Syloti Nagri, Syriac Estrangela, Tagbanwa, Tai Le, Tai Tham, Tai Viet, Tamil, Telugu, Thaana, Thai, Tibetan, Tifinagh, Vai, Yi +AndroidDevelopers @AndroidDev 

NOTO SCRIPT SUPPORT IN MARSHMALLOW +AndroidDevelopers @AndroidDev Tibetan Vai Mongolian 

NOTO CJK (L+) +AndroidDevelopers @AndroidDev ● Joint project with Adobe ○ Also released as Source Han Sans ○ https://github.com/adobe-fonts/source-han-sans ● Rendered on Android with high-quality (Adobe) CFF renderer ○ http://www.freetype.org/ ● Support for Simplified and Traditional Chinese, Japanese, Korean ○ Comprehensive coverage ● Unified design but correct handling of variants 

NOTO COLOR EMOJI +AndroidDevelopers @AndroidDev ● Bitmap color font technology ○ Standardized in OpenType 1.7 ● No special app support needed, it’s “just text” ● Flags and keycaps ○ Implemented with GSUB ligatures ● Use Paint.hasGlyph() to detect whether emoji exists 

SECTION TITLE TYPOGRAPHY FEATURES 

OPENTYPE SUPPORT (L+) +AndroidDevelopers @AndroidDev ● Kerning and ligatures ○ on by default, but can disable ● font-feature-settings ○ CSS-compatible syntax ○ old-style, tabular, lining figures ○ fraction forms ○ discretionary ligatures ● ‘locl’ feature: localized forms ○ automatically selected based on locale 

KERNING AND LIGATURES +AndroidDevelopers @AndroidDev default android:fontFeatureSettings="'kern' off, 'liga' off" 

OPENTYPE FEATURE: NUMBER FORMS (L+) +AndroidDevelopers @AndroidDev default android:fontFeatureSettings="'pnum'" android:fontFeatureSettings="'onum'" 

LETTERSPACING (L+) +AndroidDevelopers @AndroidDev android:letterSpacing="-0.08" android:letterSpacing="-0.04" android:letterSpacing="0" android:letterSpacing="0.04" android:letterSpacing="0.08" 

HIGH QUALITY PARAGRAPH LAYOUT (M+) +AndroidDevelopers @AndroidDev ● Shipping in Marshmallow ● Automatic hyphenation ○ Algorithms and patterns based on TeX ● Whole-paragraph optimization ○ Also based on TeX ○ Parameters tuned: ■ Don’t hyphenate next-to-last line ■ Do hyphenate to prevent one word on last line ● High quality mode on by default ○ But can disable under program control (breakStrategy="normal") ○ Performance comparable to Lollipop 

HIGH QUALITY PARAGRAPH LAYOUT (M+) android:breakStrategy="simple" android:breakStrategy="high_quality" android:hyphenationFrequency="full" 

BREAKSTRATEGY: BALANCED (M+) +AndroidDevelopers @AndroidDev normal balanced It’s not great when a word is by itself on the last line. It’s not great when a word is by itself on the last line. Based on Adobe’s text-wrap: balanced proposal android:breakStrategy="balanced" 

THE IMPORTANCE OF LOCALE +AndroidDevelopers @AndroidDev Font selection (especially 簡化字 / 正體字) locl OpenType feature lookup ICU line breaking (dictionary-based) Automatic hyphenation (rule-based and exception dict) App TextView Settings (system-wide) setTextLocale() TextView with styled spans LocaleSpan Tip: use Compact Language Detector 2 library 

THANK YOU Questions? +AndroidDevelopers @AndroidDev