TextInput Blibking React Native

Question

I do sign TextInput, when I write email the clipboard start blinking

I tried use keyboardsSafeView, use another textInput, nothing help me, maybe its iOS bug?

my code:

<View style={styles.inputContainer}>
      {icon && <View>{icon}</View>}
      <TextInput
        style={{
          ...styles.input,
          fontSize: fontSize,
          color: textColor,
          fontFamily: fontFamily,
          height: height,
        }}
        onChangeText={handleChangeText}
        value={value}
        placeholder={placeholder}
        placeholderTextColor='rgba(141, 141, 142, 1)'
        secureTextEntry={isPassword && !isPasswordVisible}
        {...props}
      />
      {isPassword && (
        <Pressable
          onPress={() => setIsPasswordVisible(!isPasswordVisible)}
          style={styles.buttonShow}
        >
          {isPasswordVisible ? <EyeOutlineIcon /> : <EyeOffOutlineIcon />}
        </Pressable>
      )}
</View>

Answer 1

It's hard to understand exactly what your issue is that you are trying to solve. I'm not sure what you mean by "the clipboard starts blinking".

It looks like you are just trying to create some sort of TextInput component that can handle multiple types of inputs - passwords, and non-passwords as well.

As a reference, the react-native-paper kit of UI components has a very similar component, which works excellently. You can take a look at their component as a reference and see if it can guide you in the right direction:

https://github.com/callstack/react-native-paper

https://github.com/callstack/react-native-paper/blob/main/src/components/TextInput/TextInput.tsx

They also have an app in the App Store where you can view the catalogue of their components:

iOS App Store: https://apps.apple.com/us/app/react-native-paper/id1548934513

Android Play Store: https://play.google.com/store/apps/details?id=com.callstack.reactnativepaperexample&hl=en&gl=US&pli=1