【问题标题】:Keyboard pushing everything up in React Native app键盘在 React Native 应用程序中推动一切
【发布时间】:2022-01-10 22:16:18
【问题描述】:

我的 react-native 应用程序中有一个简单的身份验证表单,但每次出现软件键盘时,整个屏幕都会向上移动并将所有内容压缩在一起。我很绝望,对此无能为力,我尝试使用百分比、flex、自定义库来设置样式,但效果总是一样的。在其他问题中,我找到了一个需要编辑 Android 清单的解决方案,但我想避免这种情况。我只需要键盘覆盖屏幕底部的所有内容,而不是移动上面的所有内容。

有人可以帮我吗?

【问题讨论】:

  • 您可以将您的内容包装在 ScollView 中,并像这样设置它的道具:style={{flex: 1}} contentContainerStyle={{minHeight: '100%'}}
  • 这部分工作,但还有另一个问题,当我在输入中写入一些内容(这意味着我的本地状态发生变化)时,看起来初始渲染的样式被覆盖了。看起来高度现在是从没有键盘的空间计算出来的,一切都再次挤压。

标签: android react-native ecmascript-2016


【解决方案1】:

您是否尝试过 KeyBoardAvoidingView 组件? link

【讨论】:

  • 实际上我做到了,但据我了解,它与我想要的相反。我不想移动任何东西,我只想让键盘渲染内容。还是我从文档中弄错了?
  • 试试这个:keyboardVerticalOffset={-500} behavior="padding",如果它不起作用,那么一定要坚持使用adjustNothing的清单更改。
【解决方案2】:

您应该使用 style={{flex: 1}}

将布局包装在 Scrollview 中

【讨论】:

    猜你喜欢
    • 2019-06-04
    • 2017-03-02
    • 1970-01-01
    • 2020-08-10
    • 1970-01-01
    • 2017-01-13
    • 2020-11-25
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多