question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Panresponder not behaving correctly when using onLayout from parent view

See original GitHub issue

Description:

Running this code https://snack.expo.io/@yoobidev/draggable-component on iOS and Android it works as expected.

But if you change line 65 from

<View style={{ position: "absolute" }}>

To

<View onLayout={(e) => console.log(e)} style={{ position: "absolute" }}>

On android, once you drag an item and drop it, you cannot drag it again. Although it still works fine on iOS.

This is reproducible via the snack expo link, change the device to android and change the line as suggested and try to drag and drop the same item multiple times.

My dependencies for the project are { “react”: “16.9.0”, “react-native”: “0.61.5”, “react-native-gesture-handler”: “^1.5.3”, “react-native-reanimated”: “^1.7.0”, “react-native-safe-area-context”: “^0.6.2”, “react-native-screens”: “^2.0.0-alpha.29”, “react-navigation”: “^4.0.10”, “react-navigation-drawer”: “^2.3.3” },

React Native version:

System:
OS: macOS Mojave 10.14.4
CPU: (4) x64 Intel(R) Core(TM) i5-7360U CPU @ 2.30GHz
Memory: 41.82 MB / 8.00 GB
Shell: 3.2.57 - /bin/bash

Binaries: Node: 11.12.0 - /usr/local/bin/node Yarn: 1.13.0 - /usr/local/bin/yarn npm: 6.7.0 - /usr/local/bin/npm Watchman: 4.9.0 - /usr/local/bin/watchman SDKs: iOS SDK: Platforms: iOS 12.2, macOS 10.14, tvOS 12.2, watchOS 5.2 Android SDK: API Levels: 23, 25, 26, 27, 28 Build Tools: 23.0.1, 25.0.0, 26.0.2, 26.0.3, 27.0.3, 28.0.2, 28.0.3 System Images: android-28 | Google APIs Intel x86 Atom IDEs: Android Studio: 3.5 AI-191.8026.42.35.6010548 Xcode: 10.2.1/10E1001 - /usr/bin/xcodebuild npmPackages: react: 16.9.0 => 16.9.0 react-native: 0.61.5 => 0.61.5 npmGlobalPackages: react-native-cli: 2.0.1 react-native: 0.59.9

Steps To Reproduce

Please read description

Expected Results

You should be able to move the item after dropping it

Issue Analytics

  • State:closed
  • Created 4 years ago
  • Reactions:2
  • Comments:9 (1 by maintainers)

github_iconTop GitHub Comments

1reaction
KingAmocommented, May 15, 2020

same here, any solution ?

0reactions
stale[bot]commented, Aug 23, 2020

Closing this issue after a prolonged period of inactivity. If this issue is still present in the latest release, please feel free to create a new issue with up-to-date information.

Read more comments on GitHub >

github_iconTop Results From Across the Web

React Native Panresponder not behaving correctly when ...
Description: Running this code https://snack.expo.io/@yoobidev/draggable-component on iOS and Android it works as expected.
Read more >
React Native on layout x and y are not correct : r/reactnative - Reddit
I have discovered that the onLayout is not returning the x absolute positions; it's being affected by its parent views and is returning...
Read more >
[Solved]-Forcing onLayout on React Native view-Reactjs
Let me show you an example with React Hooks. I'm setting for component onLayout , which using callback onComponentLayout.
Read more >
Create an Instagram Press-and-Hold Image Preview Modal ...
We'll use a `PanResponder` to register presses on an image. ... height so that the dimensions will be properly set when being centered...
Read more >
How to handle user gestures in React Native with ... - Bam Tech
In this article I will explain how I developed a calendar handling pan gestures using React Native's PanResponder, and what I learnt through...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found