标签:参考 结束 round str pad 字符 dash line 缩放
export default class App extends Component<Props> { render(){ return{ <View> <Text style={{backgroundColor:‘black‘}}> 这是一种设置方式,即直接添加一个js对象 </Text> <Text style={{backgroundColor:‘red‘}}> 在jsx语法中,遇到‘{‘,就会认为开始执行js,直到遇到‘}‘结束; 遇到‘<‘,就会认为需要把它编译为html元素,直到遇到‘>‘结束; </Text> </View> }
} }
export default class App extends Component<Props> { render() { return ( <View style={styles.container}> <Text style={styles.welcome}>I Love React Native!</Text> <Text style={styles.instructions}>来吧?</Text> <Text style={styles.instructions}>{instructions}</Text> <Text style={styles.instructions}>下午练手</Text> </View> ); }, } const styles = StyleSheet.create({ container: { flex: 1, justifyContent: ‘center‘, alignItems: ‘center‘, backgroundColor: ‘#F5FCFF‘, }, welcome: { fontSize: 20, textAlign: ‘center‘, margin: 10, }, instructions: { textAlign: ‘center‘, color: ‘#333333‘, marginBottom: 5, }, });
1.宽高
width //宽 height //高
2.背景颜色(backgroundColor)
backgroundColor opacity //透明度
3.边框(border)
//边框圆角设置 borderTopLeftRadius //左上角圆角 borderTopRightRadius //右上角的圆角 borderBottomLeftRadius //左下角的圆角 borderBottomRightRadius //右下角的圆角 borderRadius //所有角的圆角 //边框宽度 borderLeftWidth //左边边框宽度 borderRightWidth //右边边框宽度 borderTopWidth //顶部边框宽度 borderBottomWidth //底部边框宽度 borderWidth //所有边框宽度 //边框颜色 borderColor //边框颜色
4.外边距(margin)
marginBottom //距下外边距 marginLeft //距左外边距 marginRight //距右外边距 marginTop //距上外边距 marginVertical //垂直外边距(也就是距上,距下边距) marginHorizontal //水平外边距(距左,距右边距) margin //所有边距
5.内边距
paddingBottom //距下内边距 paddingLeft //距左内边距 paddingRight //距右内边距 paddingTop //距上内边距 paddingVertical//垂直内边距 paddingHorizontal //水平内边距 padding //所有内边距
6.文字
color //文字颜色 textAlign //对其方式 (‘left‘,‘right‘,‘auto‘,‘center‘,‘justify‘) fontSize //字体大小 fontStyle //字体风格 正常:‘normal‘, 斜体:‘italic‘ fontWeight //字体粗细 加粗:‘bold‘, ‘100‘, ‘200‘ letterSpacing //字符间距 lineHeight //行间距 textDecorationLine //字体装饰线 下划线:‘underline‘, 删除线:‘line-through‘,下划线删除线:‘underline line-through‘ textDecorationStyle //字体装饰线风格 单线:‘solid‘ 双线:‘double‘ 虚线:‘dotted‘,‘dashed‘ textDecorationColor //字体装饰线颜色
7.图像
//图像变换 scaleX //水平方向缩放 scaleY //垂直方向缩放 rotation //旋转 translateX //水平方向平移 translateY //水平方向平移 resizemode //拉伸图片 ‘cover‘ ,‘strech‘,‘contain‘
参考链接:https://www.jianshu.com/p/ec95efa03312
标签:参考 结束 round str pad 字符 dash line 缩放
原文地址:https://www.cnblogs.com/the-artist/p/9792131.html