form-1
v1.0.25
Published
``` import React, { Component } from 'react'; import { View, Text, FlatList, TouchableOpacity, } from 'react-native';
Downloads
26
Readme
Example
import React, { Component } from 'react';
import {
View,
Text,
FlatList,
TouchableOpacity,
} from 'react-native';
import {Feild,Check} from 'form-1'
class App extends Component {
state={
email:'',
check: false,
list: [{check: false,item: 'apple' },{check: false,item: 'Banana' }]
}
render(){
return (
<View>
<Feild
placeHolder='Email'
onChangeText={(text) => {this.setState({email:text})}}
image={{source: {uri: 'https://images.idgesg.net/images/article/2019/04/gmail-alternative-android-email-apps-100792765-large.jpg'}}}
imageStyling={{width:50,height:50}}
placeHolderTextColor='red'
style={{borderColor:'green'}}
feildStyling={{fontSize:20}}
secureTextEntry={true}
//keyboardtype
/>
<Feild label='Para Input'
labelStyling= {{paddingTop: 25,paddingLeft: 10}}
placeHolder='Para Input'
multiLine={true}/>
<View style={{paddingTop: 20,paddingLeft: 10}}>
<Text style={{fontWeight: 'bold',fontSize: 20}}>Your Choice ?</Text>
<FlatList data={this.state.list}
renderItem= {({item,index}) => (
<View>
<Check style={{paddingTop: 20}}
checkTextStyling={{fontSize: 18}}
status={item.check}
checkText={item.item}
onChange={() => {
if(item.check==true){
const temporaryList = [...this.state.list]
temporaryList[index].check = false
this.setState({
list: temporaryList
})
}
else{
const temporaryList = [...this.state.list]
temporaryList[index].check = true
this.setState({
list: temporaryList
})
}
}}/>
</View>
)}/>
</View>
<TouchableOpacity style={{backgroundColor:'lightblue',marginTop:30,padding:10}}>
<Text style={{fontSize:20,alignSelf:'center'}}>Submit</Text>
</TouchableOpacity>
</View>
);
};}
export default App;