在键盘显示响应本机之前更改视图样式

时间:2020-08-04 08:05:25

标签: react-native

我想在键盘打开时设置flex: 0,在键盘隐藏时设置flex: 1。为了避免键盘打开时出现间距。

但是知道打开键盘时布局会闪烁。

keyboardWillShow仅在ios上可用。

我该如何实现?

发生了什么事

我想在键盘打开时删除登录按钮的底部空间。

这是代码:

useEffect(() => {
  Keyboard.addListener("keyboardDidShow", _keyboardDidShow);
  Keyboard.addListener("keyboardDidHide", _keyboardDidHide);

  return () => {
    Keyboard.removeListener("keyboardDidShow", _keyboardDidShow);
    Keyboard.removeListener("keyboardDidHide", _keyboardDidHide);
  };
}, []);
const _keyboardDidShow = () => {
  setKeyboardIsOpen(true);
};
const _keyboardDidHide = () => {
  setKeyboardIsOpen(false);
};
return
<ScreenContainer bgColor={Colors.whiteFFF} scrollView>
  <View style={{ flex: 1, justifyContent: "space-between" }}>
    <View style={{ flex: 1, justifyContent: "center" }}>
      <TForm
        fields={fields}
        values={values}
        errors={errors}
        onChangeText={(val, name) => setValues({ ...values, [name]: val })}
        onError={errors => setErrors(errors)}
      />
      <ForgetPassword />
    </View>
    <View style={{ flex: keyboardIsOpen ? 0 : 1, justifyContent: "center" }}>
      <AuthButton text={Strings.btns.login} onPress={login} />
    </View>
  </View>
</ScreenContainer>

我尝试使用键盘事件监听器,但是将justifyContent设置为flex-end,但这是闪烁的。

0 个答案:

没有答案