反应原生软键盘问题

问题描述：

我在屏幕底部有TextInput。当TextInput被关注时，键盘出现，并且由于这个，所有的flex视图都缩小到可用的屏幕。我希望实现该页面布局不应该改变和输入应该是用户可见。反应原生软键盘问题

<View style={MainView}> 
     <View style={subMain1}> 
      <View style={{flex:1,backgroundColor:'#add264'}}></View> 
      <View style={{flex:1,backgroundColor:'#b7d778'}}></View> 
      <View style={{flex:1,backgroundColor:'#c2dd8b'}}></View> 
     </View> 
     <View style={subMain2}> 
      <View style={{flex:1,backgroundColor:'#cce39f'}}></View> 
      <View style={{flex:1,backgroundColor:'#d6e9b3'}}></View> 
      <View style={{flex:1,backgroundColor:'#69ee9a'}}> 
       <TextInput placeholder="input field"/> 
      </View> 

     </View> 
    </View>

常量样式= {

MainView:{ 
    flex:1, 
    backgroundColor:'green' 
}, 
subMain1:{ 
    flex:1, 
    backgroundColor:'blue' 
}, 
subMain2:{ 
    flex:1, 
    backgroundColor:'orange' 
}

}

答

我不是很肯定我理解的问题，您正在运行的产品进入，但我最近与键盘挣扎避免在我的应用程序中查看 - 出于某种原因，本地组件无法正常工作。

检查这个包了 - 它的伎俩对我来说，并提供了一些很酷的定制功能： https://github.com/APSL/react-native-keyboard-aware-scroll-view

答

我只是找到了一个答案。

我只需要为我的主容器和内部使用固定高度，我可以使用柔性布局。如果键盘隐藏了内容，那么我们可以使用滚动查看，当用户点击输入时，该滚动查看将允许滚动界面。

这帮助我希望它可以帮助别人。 :)

反应原生软键盘问题

相关推荐