sandbox.js 1 KB
Newer Older
YoonDongMin's avatar
YoonDongMin committed
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
import React from 'react';
import {StyleSheet, Text, View} from 'react-native';

export default function Sandbox(){
    return (
        <View style = {styles.container}>
            <Text style = {styles.boxOne}>one</Text>
            <Text style = {styles.boxTwo}>two</Text>
            <Text style = {styles.boxThree}>three</Text>
            <Text style = {styles.boxFour}>four</Text>
        </View>
    )
}

const styles= StyleSheet.create({
    container: {
        //flex: 1,
        flexDirection: 'row',
        justifyContent: 'space-around' , 
        alignItems: 'flex-end',
        paddingTop: 40,
        backgroundColor: '#ddd',
    },
    boxOne: {
        flex:5,
        backgroundColor: 'violet',
        padding:10,

    },
    boxTwo: {
        flex:1,
        backgroundColor: 'gold',
        padding:20,
    },
    boxThree: {
        flex:1,
        backgroundColor: 'coral',
        padding:30,
    },
    boxFour: {
        flex:1,
        backgroundColor: 'skyblue',
        padding:40,
    }
});