在ReactNative中有很多組件，組件的屬性各有不同，但是也有些基礎(chǔ)通用的樣式。這里的樣式在iOS中驗(yàn)證通過磅叛，Android暫時沒有測試。
首先有一個可運(yùn)行的react-native的程序萨赁。
import React, { Component } from 'react';
import {
AppRegistry,
StyleSheet,
Text,
View
} from 'react-native';
export default class AwsomeProject extends Component {
render() {
return (
<View style={style.container}>
</View>
);
}
}
//這里修改樣式
const style = StyleSheet.create({
container:{
flex : 1,
backgroundColor:'#eae7ff',
margin:30
}
});
AppRegistry.registerComponent('AwsomeProject', () => AwsomeProject);
那么在container中就可以修改相關(guān)樣式了弊琴。其中flex涉及flexbox的布局，不做解釋杖爽。其他的相關(guān)基礎(chǔ)樣式修改列表內(nèi)容如下敲董。
內(nèi)邊距：
padding：10
外邊距：
margin:30
外邊距離頂部的位置
marginTop:20,
外邊距離底部的位置
marginBottom:20,
四周邊框的距離
borderWidth:1
邊框顏色
borderColor:'#ff0000'
周邊邊角：
borderRadius：16
陰影顏色
shadowColor：‘#ff0000’
陰影透明度：
shadowOpacity：0.5
陰影擴(kuò)散度：
shadowRadius：2
陰影偏移 （這個是一個對象）
shadowOffset：{
height： 1紫皇， //垂直方向的偏移
width：0 //水平方向的偏移
}
