How To Use both 'adjustPan' and 'adjustResize' for 'windowSoftInputMode' in React Native Android app

|▌冷眼眸甩不掉的悲伤 提交于 2021-02-18 08:59:08

问题


How can I use both 'adjustPan' and 'adjustResize' in AndroidManifest.xml react native app.

Use Case

My navigation is made upon ReactNavigation with StackNavigator and TabNavigator. I have a text box where the user can type any data. While performing this, the tab bar is displaying on the top of Keyboard. In order to block this i used 'adjustPan' and it worked fine.

On another screen, I have a registration with multiple text boxes. Here I cant scroll the entire screen unless and clicking 'tick' on the keyboard or manually click system back button. To solve this issue I found 'KeyboardAvoidingView' which is working fine. but to activate this need to change 'windowSoftInputMode' to 'adjustResize'.

In documentation, found that these two have entirely different property and I can't both together. could someone help me on this?

References:https://medium.freecodecamp.org/how-to-make-your-react-native-app-respond-gracefully-when-the-keyboard-pops-up-7442c1535580


回答1:


I found an npm package called react-native-android-keyboard-adjust, which allows us to switch the windowSoftInputMode on demand, this should be able to cater for your use case. However, the library seems to be not actively maintained and the installation documentation is a little bit out of date but for the most part, you can follow the instructions given by the README.md.

For the Update MainActivity.java in your project part, the recent versions of React Native should be able to auto-link the dependencies and there is no need to do this modification manually.

After the above steps, you can try to start your app. If you encountered an error related to something like The number of method references in a .dex file cannot exceed 64k, you can add the followings to your android/app/build.gradle file

android {
    ...

    defaultConfig {
        ...
        multiDexEnabled true
    }

    ...
}

After installing the package, you can call the methods provided by the library to change the windowSoftInputMode as you need.

For example, assuming you have a default windowSoftInputMode of adjustResize, and you want to use adjustPan within ScreenA, you can call AndroidKeyboardAdjust.setAdjustPan() when ScreenA mount, and reset the windowSoftInputMode to adjustResize on unmount by calling AndroidKeyboardAdjust.setAdjustResize()



来源:https://stackoverflow.com/questions/49802453/how-to-use-both-adjustpan-and-adjustresize-for-windowsoftinputmode-in-reac

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!