You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
80 lines
1.7 KiB
80 lines
1.7 KiB
import React from 'react';
|
|
import {StyleSheet, Text, TextInput, View, Image, FlatList} from 'react-native';
|
|
import ValidateButton from './ValidateButton';
|
|
import HeaderFlatList from './HeaderFlatList';
|
|
|
|
type ListProps = {
|
|
title: string
|
|
content : list<string>
|
|
}
|
|
|
|
type ItemProps = {value: string}
|
|
|
|
const Item = ({value}: ItemProps) => (
|
|
<View style={styles.itemList}>
|
|
<Text style={styles.itemText}>{value}</Text>
|
|
</View>
|
|
)
|
|
|
|
export default function ListTab(props: ListProps) {
|
|
return (
|
|
<View style={styles.background}>
|
|
<View>
|
|
<FlatList data={props.content} renderItem={({item}) => <Item value={item.value}/>} ListHeaderComponent={<HeaderFlatList title={props.title}/>}/>
|
|
</View>
|
|
</View>
|
|
);
|
|
}
|
|
|
|
const styles = StyleSheet.create({
|
|
background: {
|
|
flexDirection: 'column',
|
|
alignItems: 'center',
|
|
justifyContent: 'center',
|
|
borderRadius: 15,
|
|
backgroundColor: '#E3DEC9',
|
|
marginBottom: 20,
|
|
},
|
|
titleBar: {
|
|
flexDirection: "row",
|
|
alignItems: "center",
|
|
justifyContent: "stretch",
|
|
backgroundColor: "#F2F0E4",
|
|
borderTopRightRadius: 15,
|
|
borderTopLeftRadius: 15,
|
|
borderWidth: 2,
|
|
borderColor: "#ACA279",
|
|
width: 250,
|
|
},
|
|
arrow: {
|
|
height: 20,
|
|
width: 20,
|
|
resizeMode: 'contain',
|
|
tintColor: "#3F3C42",
|
|
flex: 0.5,
|
|
},
|
|
title: {
|
|
fontSize: 15,
|
|
color: '#3F3C42',
|
|
alignItems: 'center',
|
|
justifyContent: 'left',
|
|
textAlign: "left",
|
|
flex: 0.5,
|
|
padding: 5,
|
|
},
|
|
|
|
itemList: {
|
|
flexDirection: "row",
|
|
alignItems: "flex-start",
|
|
justifyContent: "stretch",
|
|
width: 330,
|
|
},
|
|
itemText: {
|
|
fontSize: 13,
|
|
textAlign: "left",
|
|
flex: 1,
|
|
padding: 5,
|
|
paddingLeft: 10,
|
|
color: "#3F3C42",
|
|
},
|
|
}); |