import React, {Component} from 'react';
import {AppRegistry, View, ScrollView, Text, Dimensions} from 'react-native';

var {width} = Dimensions.get('window');

export default class Test extends Component {
    render() {
        return (
            <ScrollView>
                <View style={styles.container}>
                    {['1','2','3','4','5','6','7','8','9','10','11','12','13','14','15','16'].map((value) => {
                        return (
                                <View style={styles.item} key={value}>
                                    <Text>{value}</Text>
                                </View>
                        );
                    })}
                </View>
            </ScrollView>
        );
    }
}

const styles = {
    container: {
        flex: 1,
        flexDirection: 'row',
        flexWrap: 'wrap'
    },
    item: {
        width: width / 2,
        height: 200,
        backgroundColor: 'green',
        justifyContent: 'center',
        alignItems: 'center'
    },
    text: {
        color: '#ffffff'
    }
};

AppRegistry.registerComponent('Test', () => Test);