ReactNative flex 弹性布局

ReactNative 中flex弹性布局用法。

import React, {Component} from 'react';import {    AppRegistry,    StyleSheet,    Text,    View,    TouchableOpacity,    TextInput,    Image,} from 'react-native';/*flex 可以给组件制定flex,flex的值为数字。 flex:1 表示 组件可以充满父组件所有的剩余空间 同时存在多个并列的子组件，flex:1,均分空间 如果这些并列的flex的值不一样，谁的值更大谁占据的空间越大 （即占据剩余空间的比等于并列组件件flex值） */let RnDemo = React.createClass({    render: function () {        return (            <View style={styles.container}>                <View style={styles.child1}></View>                <View style={styles.child2}></View>            </View>        );    }});let styles = StyleSheet.create({    container: {        marginTop: 10,        flex: 1,        backgroundColor: "cyan",    },    child1: {        flex: 1,        backgroundColor: "green",    },    child2: {        flex: 2,        backgroundColor: "yellow"    },});