键盘打开时滚动浏览视图(React Native/Expo)

Arn*_*aud 16 keyboard react-native expo

我在Expo应用程序上使用KeyboardAvoidingView很难.我想满足以下要求:

  • 键盘打开时,视图应向上滚动,以便用户始终可以看到输入.这就是KeyboardAvoidingView的目的.
  • 当键盘打开时,用户应该能够滚动整个视图.
  • 不应该有任何奇怪的图形故障.
  • 它应该适用于iOS和Android.

我尝试了100种不同的解决方案,但是我得不到令人满意的结果.当我使用Expo时,我无法使用https://github.com/APSL/react-native-keyboard-aware-scroll-view来更改AndroidManifest.

使用KeyboardAvoidingView,我发现最好的解决方案是在iOS上放置behavior ="padding",在Android上根本没有行为.但是,仍然存在一个问题:当键盘打开时,用户可以滚动的空间有限.因此,当视图是具有大量输入的长形式时,用户无法在不关闭键盘,滚动,然后再次打开键盘的情况下转到窗体的底部.

我还有一个问题,键盘在聚焦输入后立即打开,但我想留下一些额外的空间,因为我的输入有一些填充.使用该keyboardVerticalOffset属性对此没有影响.

在阅读了几十篇关于这个主题的帖子之后,似乎没有人真正了解KeyboardAvoidingViews如何工作以及如何有效地使用它们.即使在官方的React Native文档中,也提到"Android和iOS都与这个prop [(行为)]的交互方式不同.在没有任何行为道具时Android可能表现得更好,而iOS则相反",就像他们不喜欢我真的明白这个属性是什么.

是否有人了解如何使用KeyboardAvoidingView以及如何使用它以满足4个要求?

预先感谢您的帮助!

小智 14

我们正在使用这个

<KeyboardAwareScrollView  keyboardShouldPersistTaps={'always'}
        style={{flex:1}}
        showsVerticalScrollIndicator={false}>
    {/* Your code goes here*/}
</KeyboardAwareScrollView>
Run Code Online (Sandbox Code Playgroud)

并且我们没有面对这四个问题中的任何一个

  • Arnaud 表示由于 Expo 限制他不能使用 KeyboardAwareScrollView (4认同)

小智 7

在IOS中我不需要KeyboardAvoidingView,我只是使用automaticallyAdjustKeyboardInsets

<ScrollView
      automaticallyAdjustKeyboardInsets={true}
      contentContainerStyle={{
        flex: 1
      }}
    >
...
</ScrollView>
Run Code Online (Sandbox Code Playgroud)