lotosbin / react-native-pin-input

react native pin input
MIT License
5 stars 9 forks source link

Option for pristine fields not to have the "dot" if the fields are secure text #8

Closed appjitsu closed 6 years ago

appjitsu commented 6 years ago

screen shot 2017-10-10 at 9 00 19 am

appjitsu commented 6 years ago

Thanks for the update. Is there any way to remove the dash? My client wants nothing in the fields if they are pristine.

screen shot 2017-10-17 at 4 06 30 am

lotosbin commented 6 years ago

@appjitsu you can set placeHolder to space.but there is still a space character.

 <PinInput
              placeHolder={' '}
              ...

pristine pin value is placeHolder. if the first pin is 1, and fourth pin is 4, if placeHolder is ' ', the result is '1 4', if placeHolder is '-',result is '1--4'. and must have a placeHolder,default is '-'

appjitsu commented 6 years ago

It's not working for me.

"react-native-pin-input": "^1.2.5"

<PinInput
  ref={(input) => { this.pin = input; }}
  text=""
  pinLength={4}
  pinItemStyle={{ width: 50, height: 50, borderWidth: 0, borderBottomWidth: 1 }}
  pinItemProps={{ keyboardType: 'number-pad', returnKeyType: 'done', secureTextEntry: true }}
  placeholder={' '}
  onPinCompleted={(pin) => {
    this.setState({ password: pin });
    Keyboard.dismiss();
  }}
  containerStyle={{ backgroundColor: 'transparent' }}
  containerPinStyle={{
    flexDirection: 'row',
    justifyContent: 'space-around',
    alignItems: 'center',
    marginTop: 20,
  }}
/>
lotosbin commented 6 years ago

@appjitsu my mistake, should be placeholder , not placeHolder

appjitsu commented 6 years ago

I can confirm that this works. Thanks!