import React, { Component } from 'react';
import {
AppRegistry,
StyleSheet,
Text,
View
} from 'react-native';
export default class TFlex extends Component {
render() {
return (
<View style={styles.container}>
<Text style={styles.sub} >1</Text>
<Text style={styles.sub} >2</Text>
<Text style={styles.sub} >3</Text>
<Text style={styles.sub} >4</Text>
<Text style={styles.sub} >5</Text>
<Text style={styles.sub} >6</Text>
<Text style={styles.sub} >7</Text>
<Text style={styles.sub} >8</Text>
<Text style={styles.sub} >9</Text>
<Text style={styles.sub} >10</Text>
<Text style={styles.sub} >11</Text>
</View>
);
};
}
const styles = StyleSheet.create({
container:{
flex: 1,
flexDirection: "row",
justifyContent: 'space-around',
alignItems: 'center',
flexWrap: "wrap",
backgroundColor: '#F5FCFF',
},
sub: {
margin: 10,
width: 50,
height: 50,
backgroundColor: "red",
},
});
AppRegistry.registerComponent('TFlex', () => TFlex);
效果如下:
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)