React Native组件解析(二)之Text
1. 概述
Text组件对应于iOS的UILabel,Android的TextView，用来显示文本。但是Text组件的内部使用的并不是flexbox布局，而是文本布局，所以如果想要使文字居中，需要在Text组件的外层套一层View，设置View的flexbox
1.1 字体相关 Style属性
| Style属性名 | 取值 | 说明 |
|---|---|---|
| fontFamily | enum('sans-serif', 'serif','monospace','sans-serif-light','sans-serif-thin','sans-serif-condensed','sans-serif-medium') | 英文字符串的样式 |
| fontSize | number | 字体大小 |
| fontStyle | enum('normal', 'italic') | 字体风格是普通还是斜体 |
| fontWeight | enum('normal', 'bold', '100', '200', '300', '400', '500', '600', '700', '800', '900') | 字体粗细程度 |
1.2 阴影相关 Style属性
| Style属性名 | 取值 | 说明 |
|---|---|---|
| textShadowColor | color | 阴影颜色 |
| textShadowOffset | { number, height: number} | 阴影效果 |
| textShadowRadius | number | 阴影圆角 |
1.3 阴影相关 Style属性
| Style属性名 | 取值 | 说明 |
|---|---|---|
| textAlign | enum('auto', 'left', 'right', 'center', 'justify') | 对齐方式 |
| textDecorationLine | enum('none', 'underline', 'line-through', 'underline line-through') | 横线相关设置 |
| lineHeight | number | 行高 |
| numberOfLines | number | 行数，同iOS，0：不限制行数 |
| adjustsFontSizeToFit | bool | 默认值为false，为true时字体会自动缩小，以适应给定的样式约束 |
| minimumFontScale | number | 为true时，设置字体的最小缩放比例，取值范围为0.01~1.0 |
1.3 阴影相关 Style属性
| Style属性名 | 取值 | 说明 |
|---|---|---|
| onPress | function | 点击回调 |
| onLongPress | function | 长按回调 |
具体可查看相关官方APIText