Universal Text Attributes

Universal text attributes include text style attributes applicable to text containers.

NOTE

The APIs of this module are supported since API version 7. Updates will be marked with a superscript to indicate their earliest API version.

Attributes

Name Type Description
fontColor ResourceColor Font color.
Since API version 9, this API is supported in ArkTS widgets.
fontSize Length Font size. If the value is of the number type, the unit fp is used. The default font size is 16. This attribute cannot be set in percentage.
Since API version 9, this API is supported in ArkTS widgets.
fontStyle FontStyle Font style.
Default value: FontStyle.Normal
Since API version 9, this API is supported in ArkTS widgets.
fontWeight number | FontWeight | string Font weight. For the number type, the value ranges from 100 to 900, at an interval of 100. The default value is 400. A larger value indicates a larger font weight. The string type supports only the string of the number type, for example, 400, "bold", "bolder", "lighter", "regular", and "medium", which correspond to the enumerated values in FontWeight.
Default value: FontWeight.Normal
Since API version 9, this API is supported in ArkTS widgets.
fontFamily string | Resource Font family.
The HarmonyOS Sans font and register custom fonts are supported.
Since API version 9, this API is supported in ArkTS widgets.
lineHeight string | number | Resource Text line height. If the value is less than or equal to 0, the line height is not limited and the font size is adaptive. If the value is of the number type, the unit fp is used.
Since API version 9, this API is supported in ArkTS widgets.
decoration {
type: TextDecorationType,
color?: ResourceColor
}		 Style and color of the text decorative line.
Default value: {
type: TextDecorationType.None,
color: Color.Black
}
Since API version 9, this API is supported in ArkTS widgets.

Example

// xxx.ets
@Entry
@Component
struct TextStyleExample {
  build() {
    Column({ space: 5 }) {
      Text('default text')
      
      Text('text font color red').fontColor(Color.Red)
      
      Text('text font default')
      Text('text font size 10').fontSize(10)
      Text('text font size 10fp').fontSize('10fp')
      Text('text font size 20').fontSize(20)
      
      Text('text font style Italic').fontStyle(FontStyle.Italic)
      
      Text('text fontWeight bold').fontWeight(700)
      Text('text fontWeight lighter').fontWeight(FontWeight.Lighter)
      
      Text('red 20 Italic bold text')
        .fontColor(Color.Red)
        .fontSize(20)
        .fontStyle(FontStyle.Italic)
        .fontWeight(FontWeight.Bold)
      
      Text('Orange 18 Normal text')
        .fontColor(Color.Orange)
        .fontSize(18)
        .fontStyle(FontStyle.Normal)
    }.width('100%')
  }
}

textstyle