ts-universal-attributes-text-style.md 3.4 KB
Newer Older
E
ester.zhou 已提交
1
# Universal Text Attributes
Z
zengyawen 已提交
2

E
ester.zhou 已提交
3
Universal text attributes include text style attributes applicable to text containers.
Z
zengyawen 已提交
4

E
ester.zhou 已提交
5
> **NOTE**
E
ester.zhou 已提交
6 7
>
> The APIs of this module are supported since API version 7. Updates will be marked with a superscript to indicate their earliest API version.
Z
zengyawen 已提交
8

Z
zengyawen 已提交
9

E
ester.zhou 已提交
10

Z
zengyawen 已提交
11 12 13
## Attributes


E
ester.zhou 已提交
14 15
| Name        | Type                                     | Description                                   |
| -----------| ---------------------------------------- | ------------------------------------ |
E
ester.zhou 已提交
16 17 18 19 20 21 22
| fontColor  | [ResourceColor](ts-types.md#resourcecolor)  | Font color.<br>Since API version 9, this API is supported in ArkTS widgets.|
| fontSize   | [Length](ts-types.md#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.<br>Since API version 9, this API is supported in ArkTS widgets.|
| fontStyle  | [FontStyle](ts-appendix-enums.md#fontstyle)  | Font style.<br>Default value: **FontStyle.Normal**<br>Since API version 9, this API is supported in ArkTS widgets.|
| fontWeight | number \| [FontWeight](ts-appendix-enums.md#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**.<br>Default value: **FontWeight.Normal**<br>Since API version 9, this API is supported in ArkTS widgets.|
| fontFamily | string \| [Resource](ts-types.md#resource)  | Font family.<br> Default value: **'HarmonyOS Sans'**. Currently, only the default font is supported.<br>Since API version 9, this API is supported in ArkTS widgets.|
| lineHeight | string \| number \| [Resource](ts-types.md#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 of the number type, the unit fp is used.<br>Since API version 9, this API is supported in ArkTS widgets.|
| decoration | {<br>type: [TextDecorationType](ts-appendix-enums.md#textdecorationtype),<br>color?: [ResourceColor](ts-types.md#resourcecolor)<br>} | Style and color of the text decorative line.<br>Default value: {<br>type: TextDecorationType.None,<br>color: Color.Black<br>}<br>Since API version 9, this API is supported in ArkTS widgets.|
Z
zengyawen 已提交
23 24 25 26


## Example

E
ester.zhou 已提交
27 28
```ts
// xxx.ets
Z
zengyawen 已提交
29 30 31 32 33 34
@Entry
@Component
struct TextStyleExample {
  build() {
    Column({ space: 5 }) {
      Text('default text')
E
ester.zhou 已提交
35 36 37 38 39 40 41 42 43 44 45 46 47 48
      
      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')
Z
zengyawen 已提交
49 50 51
        .fontColor(Color.Red)
        .fontSize(20)
        .fontStyle(FontStyle.Italic)
E
ester.zhou 已提交
52 53 54
        .fontWeight(FontWeight.Bold)
      
      Text('Orange 18 Normal text')
Z
zengyawen 已提交
55 56 57 58 59 60 61 62
        .fontColor(Color.Orange)
        .fontSize(18)
        .fontStyle(FontStyle.Normal)
    }.width('100%')
  }
}
```

E
ester.zhou 已提交
63
![textstyle](figures/textstyle.png)