第5.60章:自定义Text组件
2019-03-31 本文已影响0人
赵羽珩
设定自定义的组件。然后你想让这些文字显示样式的时候,在单独的文件里,去定义这些文字组件,然后倒入你要使用的文件里
image.pngimport React, {Component} from 'react';
import {Platform, StyleSheet, Text, View} from 'react-native';
export default class App extends Component {
render() {
return (
<View style={styles.container}>
<Ft26_333>
ninghao.net
</Ft26_333>
</View>
);
}
}
class Ft26_333 extends Component {
render() {
return (
<Text style={styles.title}>
{this.props.children}
</Text>
)
}
}
const styles = StyleSheet.create({
title: {
fontSize: 26,
color: '#6435c9',
textAlign: 'center',// 文字居中
letterSpacing: 2,// 字与字间的距离
fontWeight: '900',// 900最粗的文字、100最细的文字
},
container: {
backgroundColor: '#eae7ff',
flex: 1,
margin: 50,
borderWidth: 1,
borderColor: '#6435c9',
borderRadius: 16,
},
});