-
Notifications
You must be signed in to change notification settings - Fork 0
/
App.js
43 lines (40 loc) · 978 Bytes
/
App.js
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
import React, {useState} from 'react';
import {StyleSheet, Text, View, FlatList} from 'react-native';
export default function App() {
const [people, setPeople] = useState([
{ name: 'shaun', id: '1' },
{ name: 'yoshi', id: '2' },
{ name: 'mario', id: '3' },
{ name: 'luigi', id: '4' },
{ name: 'peach', id: '5' },
{ name: 'toad', id: '6' },
{ name: 'bowser', id: '7' },
{ name: 'eddie', id: '9' },
]);
return (
<View style={styles.container}>
<FlatList
numColumns={2}
keyExtractor={item => item.id}
data={people}
renderItem={({item}) => <Text style={styles.item}>{item.name}</Text>}
/>
</View>
);
}
const styles = StyleSheet.create({
container: {
flex: 1,
paddingTop: 40,
paddingHorizontal: 20,
backgroundColor: '#fff',
},
item: {
flex: 1,
marginHorizontal: 10,
marginTop: 24,
padding: 30,
backgroundColor: 'pink',
fontSize: 24,
},
});