curvedText
public fun CurvedScope.curvedText(
text: String,
modifier: CurvedModifier = CurvedModifier,
maxSweepAngle: Float = CurvedTextDefaults.ScrollableContentMaxSweepAngle,
background: Color = Color.Unspecified,
color: Color = Color.Unspecified,
fontSize: TextUnit = TextUnit.Unspecified,
fontFamily: FontFamily? = null,
fontWeight: FontWeight? = null,
fontStyle: FontStyle? = null,
fontSynthesis: FontSynthesis? = null,
letterSpacing: TextUnit = TextUnit.Unspecified,
letterSpacingCounterClockwise: TextUnit = TextUnit.Unspecified,
style: CurvedTextStyle? = null,
angularDirection: CurvedDirection.Angular? = null,
overflow: TextOverflow = TextOverflow.Clip,
): Unit
CurvedText is a component allowing developers to easily write curved text following the curvature a circle (usually at the edge of a circular screen). CurvedText can be only created within the CurvedLayout to ensure the best experience, like being able to specify to positioning.
Note that Wear Material UX guidance recommends that curvedText
should not exceed the sweep
angle CurvedTextDefaults.ScrollableContentMaxSweepAngle
on screens with scrollable content such
as lists. This limit is enforced by default. For screens without scrollable content,
CurvedTextDefaults.StaticContentMaxSweepAngle
may be used instead.
The default style
uses the LocalTextStyle
provided by the MaterialTheme
/ components,
converting it to a CurvedTextStyle
. Note that not all parameters are used by curvedText
.
If you are setting your own style, you may want to consider first retrieving LocalTextStyle
,
and using TextStyle.copy
to keep any theme defined attributes, only modifying the specific
attributes you want to override, then convert to CurvedTextStyle
For ease of use, commonly used parameters from CurvedTextStyle
are also present here. The order
of precedence is as follows:
- If a parameter is explicitly set here (i.e, it is not
null
orTextUnit.Unspecified
), then this parameter will always be used. - If a parameter is not set, (
null
orTextUnit.Unspecified
), then the corresponding value fromstyle
will be used instead.
Additionally, for color
, if color
is not set, and style
does not have a color, then
LocalContentColor
will be used.
For samples using curved text in a CurvedLayout
see:
For more information, see the
Curved Text
(https://developer.android.com/training/wearables/compose/curved-text) guide.
Parameters
text | The text to display |
modifier | The CurvedModifier to apply to this curved text. |
maxSweepAngle | The default maximum sweep angle in degrees. For screens without scrollable content, CurvedTextDefaults.StaticContentMaxSweepAngle may be used instead. |
background | The background color for the text. |
color | Color to apply to the text. If Color.Unspecified , and style has no color set, this will be LocalContentColor . |
fontSize | The size of glyphs to use when painting the text. See TextStyle.fontSize . |
fontFamily | The font family to be used when rendering the text. |
fontWeight | The thickness of the glyphs, in a range of 1, 1000 . see FontWeight |
fontStyle | The typeface variant to use when drawing the letters (e.g. italic). |
fontSynthesis | Whether to synthesize font weight and/or style when the requested weight or style cannot be found in the provided font family. |
letterSpacing | The amount of space (in em or sp) to add between each letter, when text is going clockwise. |
letterSpacingCounterClockwise | The amount of space (in em or sp) to add between each letter, when text is going counterClockwise. Note that this usually needs to be bigger than letterSpacing to account for the fact that going clockwise, text fans out from the baseline while going counter clockwise text fans in. |
style | Specifies the style to use. |
angularDirection | Specify if the text is laid out clockwise or anti-clockwise, and if those needs to be reversed in a Rtl layout. If not specified, it will be inherited from the enclosing curvedRow or CurvedLayout See CurvedDirection.Angular . |
overflow | How visual overflow should be handled. |