如何在 React Native 中为密码创建自定义文本输入？

Question

我怎样才能在 React Native 中制作这样的密码类型的 TextInput？我希望输入像默认类型一样变成黑色圆圈，但我希望它根据我在每个输入之间的填充进行自定义。

Answer 1

您可以使用已有的模块而无需制作它们。

您可以使用react-native-pin-view

我的使用方式

import PinView from "react-native-pin-view";
...
          <PinView
            onComplete={this.onFinishCheckingCode.bind(this)}
            pinLength={4}
            inputBgColor="#888888"
            inputActiveBgColor="#ffd90d"
            buttonBgColor="#ffffff"
            buttonTextColor="black"
            keyboardViewStyle={{
              borderColor: "#dfdfdf",
              borderWidth: 1,
              width: windowHeight / 11,
              height: windowHeight / 11
            }}
            inputViewStyle={{ width: 18, height: 18, marginRight: 20 }}
          />

如何在 React Native 中为密码创建自定义文本输入？

How to make a custom text input for password in React Native?

reactjs

react-native

react-native-textinput