70 lines
1.6 KiB
TypeScript
70 lines
1.6 KiB
TypeScript
import { useState } from 'react';
|
|
import { Button, GestureResponderEvent, ScrollView, StyleSheet, TextInput, View } from 'react-native';
|
|
|
|
export default function SelectChantier() {
|
|
|
|
const [search, setSearch] = useState('');
|
|
const [isOpen,setIsOpen] = useState(false);
|
|
|
|
function onPressOpen(event: GestureResponderEvent): void {
|
|
setIsOpen(!isOpen);
|
|
}
|
|
|
|
return (
|
|
<View style={styles.selectZone}>
|
|
{!isOpen && (
|
|
<Button onPress={onPressOpen} title={"Open"}/>
|
|
)}
|
|
{isOpen && (
|
|
<ScrollView>
|
|
<Button onPress={onPressOpen} title={"Close"}/>
|
|
<View style={styles.searchZone}>
|
|
<View style={styles.searchMenu}>
|
|
<TextInput
|
|
placeholder='Rechercher un chantier'
|
|
value={search}
|
|
onChangeText={setSearch}
|
|
/>
|
|
</View>
|
|
</View>
|
|
|
|
<View>
|
|
|
|
</View>
|
|
</ScrollView>
|
|
)}
|
|
</View>
|
|
|
|
);
|
|
}
|
|
|
|
const styles = StyleSheet.create({
|
|
titleContainer: {
|
|
flexDirection: 'row',
|
|
alignItems: 'center',
|
|
gap: 8,
|
|
},
|
|
searchMenu:{
|
|
backgroundColor: "#BB0000",
|
|
width: "100%",
|
|
margin: 0,
|
|
|
|
|
|
},
|
|
searchZone:{
|
|
width: "100%",
|
|
padding:20,
|
|
marginTop:50,
|
|
alignItems: 'center',
|
|
},
|
|
selectZone:{
|
|
position: 'absolute',
|
|
backgroundColor: "#FF0000",
|
|
width: "100%",
|
|
margin: 10,
|
|
borderRadius: 5,
|
|
zIndex: 9999,
|
|
elevation: 9999,
|
|
}
|
|
});
|