From the AnDevCon III conference

1. Rich Text
Editing... And
Beyond
Copyright © 2012CommonsWare, LLC

2. Whadaya Mean, Rich?
● Things Like Bold, Italics, Underline, Etc.
● Other Terms
– Styled Text
– Formatted Text
– WYSIWYG
Copyright © 2012CommonsWare, LLC

3. Is Android Rich?
● Native Rich Text Rendering in TextView
– Available to all subclasses of TextView (e.g.,
Button)
– Reasonable (but not immense) range of available
styles to apply
● Differing fonts, colors
● Vertical & horizontal alignments
● Bullets
● Etc.
Copyright © 2012CommonsWare, LLC

4. Where Did All the Strings Go?
● CharSequence
– In traditional Java, an inheritance artifact
● Mostly the superclass of StringBuilder
– In Android, used as basis for rich text
● Hence, lots of CharSequence parameters and
return values, in places where Android supports rich
text
Copyright © 2012CommonsWare, LLC

5. Spanning the Globe
● Spanned
– Interface for CharSequences with inline
formatting
● Spannable
– Sub-interface where the spans can be modified
● Editable
– Sub-sub-interface where the text can be
modified
Copyright © 2012CommonsWare, LLC

6. Getting More Concrete
● SpannedString
– String with markup
● SpannableString
– String with mutable markup
● SpannableStringBuilder
– String with mutable text and markup
Copyright © 2012CommonsWare, LLC

7. We Are Stylin'
● CharacterStyle
– Base class for all styles that can be applied to a
portion of a Spanned
– 21 total subclasses, each applying some effect
● BackgroundColorSpan
● StyleSpan
● TypefaceSpan
● StrikethroughSpan
Copyright © 2012CommonsWare, LLC

8. Our Resources Are Low
● String Resources
– Can have inline markup (<b>, <i>, <u>)
– Retrieving the SpannedString
● getText() (as opposed to getString())
● Applying the resource directly to a widget in a layout
via @string/...
Copyright © 2012CommonsWare, LLC

9. Oh, Those Angle Brackets
● HTML
– Use Html.fromHtml() to convert into
SpannedString
● Modest, undocumented set of tags supported
● Optional, largely undocumented TagHandler for
trying to add support for other tags
– Put the resulting SpannedString in a
TextView (or subclass)
Copyright © 2012CommonsWare, LLC

10. Tag! You're It?
● <a href="..."> ● <h4>
● <b> ● <h5>
● <big> ● <h6>
● <blockquote> ● <i>
● <br> ● <img src="...">
● <cite> ● <p>
● <dfn> ● <small>
● <div align="..."> ● <strike>
● <em> ● <strong>
● <font size="..." color="..." face="..."> ● <sub>
● <h1> ● <sup>
● <h2> ● <tt>
● <h3> Copyright © 2012CommonsWare, LLC ● <u>

11. Mark It Down
● Anything You Can Convert to HTML
● Example: Markdown
– Popular wikitext format
– Used by StackOverflow, GitHub, etc.
– Various parsers available
– Example: AndDown
● Wrapper around sundown C parser
Copyright © 2012CommonsWare, LLC

12. Format This, Buddy
● Step #1: Get a SpannableString (or
subclass)
● Step #2: Manipulate the Formatting
– setSpan() applies formatting to a particular
region
– removeSpan() removes a particular span
– getSpans() retrieves applied spans for a given
region
Copyright © 2012CommonsWare, LLC

13. The End of Style
● SPAN_EXCLUSIVE_EXCLUSIVE
– Anything added at either end is considered
outside the span
● SPAN_INCLUSIVE_INCLUSIVE
– Anything added at either end is considered
inside the span
● SPAN_EXCLUSIVE_INCLUSIVE
● SPAN_INCLUSIVE_EXCLUSIVE
Copyright © 2012CommonsWare, LLC

14. CharSequence: Rich Yet Not
● Most Utility Methods On String, Not
CharSequence
– Example: indexOf()
● TextUtils
– Offers a subset of those utility methods as static
methods that can be applied to a
CharSequence
Copyright © 2012CommonsWare, LLC

15. Hello? Didn't You Say “Editing”?
● EditText
– Supports Editable
● Reason why you keep calling toString() to get the
plain text back
– Users Edit Prose in Existing Spans
● You supply something with spans, and user types in
the middle of one, gets formatted
– No UI for Users to Set Own Spans
Copyright © 2012CommonsWare, LLC

16. RichEditText
● Open Source Component
● Easy: Automatic FORMAT Action Mode
– One method to enable
– Works on Android 2.1+ (ActionBarSherlock!)
– Works great on tablets (and not so hot on phones...)
● Harder: Roll Your Own UI
– E.g., toolbar
Copyright © 2012CommonsWare, LLC

17. RichEditText: Innards
● Action Mode Items Set or Toggle “Effects”
– Effect = Wrapper Around CharacterStyle
● Awareness of current selection
● Manages idiosyncrasies of different style classes
– Toggle Logic
● See what's in the selection now of this particular
effect
● Invert current setting
Copyright © 2012CommonsWare, LLC

18. RichEditText: The Future!
● Better Support for Phones
– ...somehow...
● Full Range of CharacterStyle Support
– Colors (foreground/background)
– Line alignment
– Bullets
– Links
● Ragnarök Copyright © 2012CommonsWare, LLC

19. A Little Bit Persistent
● SpannableString Not Serializable
● Best Native Bet: Convert into HTML
– Need to test that the formatting you apply will
survive the round-trip conversion
● Alternative: DIY
– More complete HTML conversion
– Convert into something else (byte array?
Markdown?)
Copyright © 2012CommonsWare, LLC

20. What Would Be Handy...
● More In, More Out
– Better HTML Conversion
– More wikitext support
● Other flavors
● Bi-directional
– Word processing formats (ODT, DOC/DOCX)
– Legacy formats
● RTF
Copyright © 2012CommonsWare, LLC

21. What Would Be Handy...
● More CharacterStyles?
– Theoretically an extensible system, based on
interfaces
● More Reusable Editing Widgets
– EditStyledText?
Copyright © 2012CommonsWare, LLC