React-native-keyboard-aware-scroll-view: RCTTextField is not a descendant of RCTShadowView

[nazywamsiepawel]

Hey!

Thanks for react-native-keyboard-aware-scroll-view! All works great apart from the issue in which all of the TextFields which are not contained within stop working. The error appears after the keyboard is presented :

[alvaromb]

Hello @nazywamsiepawel!

Yes, this is a known issue https://github.com/APSL/react-native-keyboard-aware-scroll-view/issues/25

I've opened a PR in react-native to solve this: https://github.com/facebook/react-native/pull/7876

In the meantime, if you take the code of the PR and the code of the ancestor_check branch you can solve the issue.

I hope this gets merged and solved soon.

Thanks!

[nazywamsiepawel]

Gracias!

[alvaromb]

Glad to have helped @nazywamsiepawel 😉

Let's close this and track the issue in #25

[JosephkimOS]

@nazywamsiepawel did you solve this problem? I followed all steps which suggested by @alvaromb

I face the warning message blow

'keyboardWillShow' event should be registered via the Keyboard module.
'keyboardWillHide' event should be registered via the Keyboard module.

And get the following error message get TextInput get focused.

"_reactNative.UIManager.viewIsAncestorOf is not a found"

Please share your experience. thank you.

[alvaromb]

The warning messages are not related to the ancestor/descendant check. With v0.1.2 there shouldn't be any warnings.

For the viewIsAncestorOf, please refer to the PR and apply that to your source code: https://github.com/facebook/react-native/pull/7876

[JosephDev]

I patched it and cherry picked commit "A version with the RN ancestor stuff" and "Check if there is a focused field before trying to scroll to it"

However, still face TypeError: _reactNative.UIManager.viewIsAncestorOf is not a function error

here is my code where it throw an exception

if (this.props.enableAutoAutomaticScroll) {
      const currentlyFocusedField = TextInput.State.currentlyFocusedField()
      if (!currentlyFocusedField) {
        return
      }
      try {
        console.log(UIManager)
        UIManager.viewIsAncestorOf(
          currentlyFocusedField,
          this.getScrollHandle().getScrollResponder().getInnerViewNode(),
          (isAncestor) => {
            if (isAncestor) {
              this.scrollToFocusedInputWithNodeHandle(currentlyFocusedField)
            }
          }
        )
      } catch (e) {
        console.log(e)
      }
    }

[JosephDev]

I create a PR with this issue. PR #41
UIManager.viewIsAncestorOf => UIManager.viewIsDescendantOf

[ghost]

I'm getting the same error message as referenced by nazywamsiepawel above. Are you close to a solution? Is there a current workaround? I'm a bit frantic.

[JosephDev]

@idavidson12 it's a solved problem. Even some involved manual work, you can use this project with sub pages. Please check previous comments, written by @alvaromb and @JosephDev

[ghost]

I don't think I'm up to this level of coding yet. Will there be an update to the module itself soon?

[JosephDev]

@idavidson12 um... you can clone my repo. instead using npm to install git clone https://github.com/JosephDev/react-native-keyboard-aware-scroll-view.git#ancestor_check

However, you have to modify iOS project files by yourself unless RN project merge @alvaromb 's PR facebook/react-native#7876.

[ghost]

Great. Thank you.

[ghost]

After implementing @alvaromb's changes I get a error that
'CSSLayout/CSSLayout.h' not found.' Do you have any idea how I might
resolve that?

Thanks for your module.

Iver

On Thu, Jul 28, 2016 at 3:48 PM, JOSEPH KIM [email protected]
wrote:

@idavidson12 https://github.com/idavidson12 um... you can clone my code
instead using npm to install git clone https://github.com/JosephDev/
react-native-keyboard-aware-scroll-view.git#ancestor_check

However, you have to modify iOS project files by yourself unless RN
project merge @alvaromb https://github.com/alvaromb 's PR
facebook/react-native#7876
https://github.com/facebook/react-native/pull/7876.

—
You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub
https://github.com/APSL/react-native-keyboard-aware-scroll-view/issues/33#issuecomment-236035634,
or mute the thread
https://github.com/notifications/unsubscribe-auth/ANg7Qv96QpoHQ1FL1MmvYMD0H3N0sr9Sks5qaSO3gaJpZM4I0TnG
.

[alvaromb]

Please use the official branch for the ancestor check @idavidson12 https://github.com/APSL/react-native-keyboard-aware-scroll-view/tree/ancestor_check

My PR was accepted a few days ago and it should land into RN 0.32.0 https://github.com/facebook/react-native/pull/7876

Regarding the CSSLayout error you're getting, is it possible that you have removed some code accidentally? I'm using the component in all of my projects and I don't get that error.

[empitechathu]

did every thing you mentioned and not working :( :(

[cbcye]

Resolve this problem.

1. npm install https://github.com/APSL/react-native-keyboard-aware-scroll-view.git#ancestor_check
2. modify the RN core file follow: https://github.com/facebook/react-native/commit/e52cab5a7f44aee5c145e9995850ab8051829b5c

I don't know how to modify after read facebook/react-native#7876, so direct read the source code that @alvaromb submit to RN official. then resolved it, spend near 5 hours :-< , Anyway, thank you @alvaromb 's hard work and contribute.

[onepiece-dz]

@alvaromb how android resolve it?

[cbcye]

after upgrade to RN0.34 still have this problem

[Bundas]

Hey, i am using latest react native and still facing this error...

"react-native-keyboard-aware-scroll-view": "^0.3.0",

[alvaromb]

Try to remove the node_modules/ folder and re-install dependencies.