React Native

TextInput 비밀번호

Machine_웅 2020. 1. 15. 15:42
728x90
반응형
import React,{Component} from 'react';
import {View,Text,StyleSheet,TextInput} from 'react-native'

class login extends Component{
    
    static navigationOptions = {
        headerShown:false
    }

    constructor(){
    super();
    this.state = { hidePassword: true }
  }

    render() {
        return (
            <View style={styles.loginMainContainer}>

                <View style={styles.imageBox}></View>

                <TextInput style={[styles.input]}
                    placeholder='userName'
                >

                </TextInput>

                <TextInput style={styles.input}
                    placeholder='passWord'
                    secureTextEntry = { this.state.hidePassword }
                >

                </TextInput>

            </View>
        )
    }

}

const styles = StyleSheet.create({

    loginMainContainer: {
        flex: 1,
        justifyContent: 'center',
        alignItems: 'center'
    },
    imageBox:{
        width: 200,
        height:200,
        backgroundColor:'gray'
    },
    input: {
        height: 44,
        backgroundColor: '#ededed',
        borderColor: '#ddd',
        borderWidth: 1,
        borderRadius: 10,
        marginTop:20,
        marginRight:40,
        marginLeft:40,
        alignSelf:'stretch',
        textAlign:'center'
    }
})

export default login

 

 

 

constructor(){

super();

this.state = { hidePassword: true }

}

 

 

<TextInput style={styles.input}

placeholder='passWord'

secureTextEntry = { this.state.hidePassword }

>

 

TextInput>

 

 

 

728x90
반응형