[React-Native]RN组件学习-Text

1、在中使用组件

如：

 
     Hello,World!
     Hello,World2!
 

是两行，如果希望不是两行，那么只需要嵌套就行了：

 Hello,World2!
 
     Hello,world3!
    

2、使用样式

 Hello,World!

通过这样引用style样式，其中，如果：

    Hello,World2!
    
        Hello,world3!
    

则Hello,world3会继承container2的样式。

3、Text常用的css样式

    container: {
        // 颜色
        color: 'red',
        // 字体大小
        fontSize: 20,
        // 字体名称
        fontFamily: "Georgia",
        // 字体风格
        fontStyle: 'italic',
        // 字体粗细
        fontWeight: '300',
        // 文字阴影偏移
        textShadowOffset: {width: 30, height: 30},
        // 文字阴影颜色
        textShadowColor: 'green',
        // 文字阴影圆角的大小
        textShadowRadius: 10,
        // 字间距(好像效果不大)
        letterSpacing: 100,
        // 行高度
        lineHeight: 50,
        // 文字对齐方式
        textAlign: 'center',
        // 文字下划线
        textDecorationLine: 'underline',
        // 下划线的样式,好像没效果
        textDecorationStyle: 'dashed',
        // 好像也没效果
        textDecorationColor: 'blue',
        // 好像真没效果啊
        writingDirection: 'rtl',
    }

4、一个例子：

// 文字阴影偏移
textShadowOffset: {width: 30, height: 30},
// 文字阴影颜色
textShadowColor: 'green',
// 文字阴影圆角的大小
textShadowRadius: 10,

这样，会营造出这样的效果：

阴影