Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Incorrect popover origin when size changes during animate in #33

Open
SteffeyDev opened this issue Jan 14, 2019 · 2 comments
Open

Incorrect popover origin when size changes during animate in #33

SteffeyDev opened this issue Jan 14, 2019 · 2 comments
Labels

Comments

@SteffeyDev
Copy link
Owner

Describe the bug
If the popover size gets bigger as the view is animating in (for example, if content is loaded async and then re-rendered just before or during animation), the popover appears to be originating from a location that is below the actual fromRect.

Device/Setup Info:

  • Device: iPad Pro 12.9"
  • OS: iOS 12
  • react-native version: 0.57
  • react-native-popover-view version: 1.0.16

Screenshots
See CC Orlando App - Bible Tab - Top right button

Debug Output

measureContent - Showing Popover - Animating In
getTranslateOrigin - popoverOrigin: {"x":908,"y":30}
getTranslateOrigin - popoverSize: {"width":380,"height":911}
getTranslateOrigin - anchorPoint: {"x":1296,"y":42}
getTranslateOrigin - shift: {"hoizontal":198,"vertical":-443.5}
measureContent - new requestedContentSize: {"y":0,"width":380,"x":0,"height":984} (used to be {"y":0,"width":380,"x":0,"height":911})
handleGeomChange - requestedContentSize: : {"y":0,"width":380,"x":0,"height":984}
computeGeometry - displayArea: {"x":10,"y":30,"width":1346,"height":984}
computeGeometry - fromRect: {"x":1296,"y":22,"width":70,"height":40}
computeGeometry - displayArea: {"x":10,"y":30,"width":1346,"height":984}
computeGeometry - fromRect: {"x":1296,"y":22,"width":70,"height":40}
@SteffeyDev SteffeyDev added the bug label Apr 7, 2019
@arunim2405
Copy link

Also facing this issue, using a flatlist of dynamic length, causes the same behavior

@xpressivecode
Copy link

Having the same issue, also with a flatlist of dynamic length in tooltip mode. It's fine on ios devices, but on android the tooltip originates far below the from ref and jumps up into the correct position.

To get around this for the time being we're making use of the popoverStyle. Essentially we always show the tooltip, isVisible={true} and we control whether or not we show it via the popoverStyle:

popoverStyle={{ opacity: tip.display ? 1 : 0, backgroundColor: tip.display ? "white" : "transparent" }}

As all the internal views have pointer events disabled they don't interfere. This allows all the tooltips to load, measure the content and position themselves correctly.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

3 participants