一、什么是Text組件?
一個用于顯示文本的React組件,和Android中的TextView組件或者OC中的Label組件相類似,專門用來顯示基本的文本信息;除了基本的顯示布局之外,可以進行嵌套顯示,設(shè)置樣式,以及可以做事件(例如:點擊)處理;
二、Text組件常用的屬性方法
Attributes.style = {
color string
containerBackgroundColor string
fontFamily string
fontSize number
fontStyle enum('normal', 'italic')
fontWeight enum("normal", 'bold', '100', '200', '300', '400', '500', '600', '700', '800', '900')
lineHeight number
textAlign enum("auto", 'left', 'right', 'center')
writingDirection enum("auto", 'ltr', 'rtl')
numberOfLines number
textAlign ("auto", 'left', 'right', 'center', 'justify')
fontWeight ("normal", 'bold', '100', '200', '300', '400', '500', '600', '700', '800', '900')
onPress fcuntion
}
注釋如下:
`color` 字體顏色
`numberOfLines` (number) 進行設(shè)置Text顯示文本的行數(shù),如果顯示的內(nèi)容超過了行數(shù),默認其他多余的信息就不會顯示了
`onPress` (fcuntion) 該方法當(dāng)文本發(fā)生點擊的時候調(diào)用該方法
`color` 字體顏色
`fontFamily` 字體名稱
`fontSize` 字體大小
`fontStyle` 字體風(fēng)格(normal,italic)
`fontWeight ` 字體粗細權(quán)重("normal", 'bold', '100', '200', '300', '400', '500', '600', '700', '800', '900')
`textShadowOffset` 設(shè)置陰影效果{width: number, height: number}
`textShadowRadius` 陰影效果圓角
`textShadowColor` 陰影效果的顏色
`letterSpacing` 字符間距
`lineHeight` 行高
`textAlign` 文本對其方式("auto", 'left', 'right', 'center', 'justify')
`textDecorationLine` 橫線位置 ("none", 'underline', 'line-through', 'underline line-through')
`textDecorationStyle` 線的風(fēng)格("solid", 'double', 'dotted', 'dashed')
`textDecorationColor` 線的顏色
`writingDirection` 文本方向("auto", 'ltr', 'rtl')
三、Text組件中常用屬性的應(yīng)用

圖片 1.png
運行結(jié)果如下:

圖片 2.png
三、Text組件中樣式的繼承
在React-native中是沒有樣式繼承這種說法的, 但是對于Text元素里邊的Text元素,其實是能夠繼承的,那么是單層繼承還是多層繼承?
代碼演示:

圖片 3.png
運行結(jié)果:

圖片 4.png
結(jié)論:文字控制類的屬性也是多重繼承的,和css中是一樣的