diff options
Diffstat (limited to 'ui/text/RoundedBackground-Kotlin/README.md')
-rw-r--r-- | ui/text/RoundedBackground-Kotlin/README.md | 93 |
1 files changed, 93 insertions, 0 deletions
diff --git a/ui/text/RoundedBackground-Kotlin/README.md b/ui/text/RoundedBackground-Kotlin/README.md new file mode 100644 index 00000000..8bd96e79 --- /dev/null +++ b/ui/text/RoundedBackground-Kotlin/README.md @@ -0,0 +1,93 @@ +Drawing a rounded corner background on text +============ + +This sample shows how to draw a **rounded** corner background on text. It supports the following cases: + +* Set the background on **one line** text + +<img src="../screenshots/single.png" width="30%" /> + +* Set the background on text over **two or multiple lines** + +<img src="../screenshots/multi.png" width="30%" /> + +* Set the background on **right-to-left** text + +<img src="../screenshots/rtl.png" width="30%" /> + + +Implementation +--------------- +Depending on the position of the text, we need to draw four different drawables as text backgrounds: + +* Text fits on one line: we only need one drawable +* Text fits on 2 lines: we need drawables for the start and end of the text +* Text spans multiple lines: we need drawables for the start, middle and end of the text + +<img src="../screenshots/lines.png" width="30%" /> + +The four drawables that need to be drawn depending on the position of the text: + +To position the background, we need to: +* Determine whether the text spans multiple lines +* Find the start and end lines +* Find the start and end offset depending on the paragraph direction + +All of these can be computed based on the text Layout. To render the background behind the text we need access to the Canvas. A custom TextView has access to all of the information necessary to position the drawables and render them. + +Our solution involves splitting our problem into 4 parts and creating classes dealing with them individually: +* **Marking the position of the background** is done in the XML resources via Annotation spans and then, in the code, we read them in the `TextRoundedBgHelper` +* Providing the background **drawables as attributes** of the TextView - implemented in `TextRoundedBgAttributeReader` +* **Rendering the drawables** depending on whether the text runs across **one or multiple lines** - `TextRoundedBgHelper` interface and its implementations: `SingleLineRenderer` and `MultiLineRenderer` +* Supporting **custom drawing** on a TextView - `RoundedBgTextView`, a class that extends `AppCompatTextView`, reads the attributes with the help of `TextRoundedBgAttributeReader`, overrides `onDraw` where it uses `TextRoundedBgHelper` to draw the background. + +Getting Started +--------------- + +Clone this repository, enter the top level directory and run `./gradlew tasks` +to get an overview of all the tasks available for this project. + +Some important tasks are: + +``` +assembleDebug - Assembles all Debug builds. +installDebug - Installs the Debug build. +connectedAndroidTest - Installs and runs the tests for Debug build on connected +devices. +test - Run all unit tests. +``` + +Screenshots +----------- +<img src="../screenshots/rounded_bg.png" width="30%" /> + +Support +------- +- Stack Overflow: http://stackoverflow.com/questions/tagged/android-text + +If you've found an error in this sample, please file an issue: +https://github.com/googlesamples/android-text/issues + +Patches are encouraged, and may be submitted by forking this project and +submitting a pull request through GitHub. + +License +-------- +``` +Copyright 2018 The Android Open Source Project + +Licensed to the Apache Software Foundation (ASF) under one or more contributor +license agreements. See the NOTICE file distributed with this work for +additional information regarding copyright ownership. The ASF licenses this +file to you under the Apache License, Version 2.0 (the "License"); you may not +use this file except in compliance with the License. You may obtain a copy of +the License at + + http://www.apache.org/licenses/LICENSE-2.0 + +Unless required by applicable law or agreed to in writing, software +distributed under the License is distributed on an "AS IS" BASIS, WITHOUT +WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the +License for the specific language governing permissions and limitations under +the License. +``` |