React Native組件之Text至關於iOS中的UILabel.javascript
其基本屬性以下:java
/** * Sample React Native App * https://github.com/facebook/react-native * 周少停 Text * 2016-10-08 */ import React, { Component } from 'react'; import { AppRegistry, StyleSheet, Text, View } from 'react-native'; class Project extends Component { render() { return ( <View style={styles.container}> <Text style={styles.textViewStyle} numberOfLines={6}> 演示的文字,演示的文字,演示的文字,演示的文字,演示的文字,演示的文字,演示的文字,演示的文字,演示的文字,演示的文字,演示的文字,演示的文字,演示的文字,演示的文字,演示的文字,演示的文字,演示的文字,演示的文字,演示的文字 </Text> </View> ); } } const styles = StyleSheet.create({ container: { flex: 1, justifyContent: 'center', alignItems: 'center', backgroundColor: '#F5FCFF', }, textViewStyle:{ color:'red', //字體顏色 fontSize:23, //字體大小 fontStyle:'normal', //字體風格,枚舉值,normal,bold fontWeight: 'bold', //字體粗細權重,枚舉值,normal,bold,100,200,300,400,500,600,700,800,900 textShadowOffset:{width:3, height:4}, //陰影效果 textShadowRadius: 2, //陰影效果圓角 textShadowColor:'yellow',//陰影效果顏色 letterSpacing:3 , //字符間距 lineHeight:80 , //行高 textAlign:'center', //文字對齊方式,枚舉值:auto left right center justify textDecorationLine:'underline', //橫線位置,枚舉值,none,underline,line-through,underline line-through textDecorationStyle:'solid', //線的風格,solid double dotted dashed textDecorationColor:'red', //線的顏色 writingDirection:'ltr' //文本方向.枚舉值,auto,ltr,rtl } }); AppRegistry.registerComponent('Project', () => Project);
完整源碼下載:https://github.com/pheromone/React-Native-1react