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

onLayout은 어떤 상황에는 동작하지 않을 수도 있다. #52

Open
gincheong opened this issue Nov 28, 2022 · 0 comments
Open

Comments

@gincheong
Copy link
Owner

So here's all of the undocumented or buggy behavior I've encountered with onLayout and .measure so far:

  1. onLayout doesn't get called in some conditions (seemingly when an element is moved by a parent resizing)
  2. measure returns undefined on android unless there's an onLayout or collapsible: false on the view
  3. onLayout doesn't take transforms into account, it returns the "internal" size of the view not the size displayed on the screen
  4. onLayout doesn't fire for animations of transforms (which is pretty much all animations since only transforms and opacity can use native driver) -- that's this issue
  5. measure returns different values for width and height than onLayout. It returns scaled values if any parent is scaled as opposed to the raw values. Docs suggest the opposite.
  6. onLayout Will return wrong/random values during component mount in some (maybe all?) cases if the view or any parent is being animated.

These add up to big frustrations. I don't know how many hours I've lost at this point writing stuff that should work per the docs only to eventually figure out the above list and work around it. These things should at least be documented so others don't have to go through the same thing.

I've worked around it mostly by writing a "measurement service" singleton that's injected via context and gets refs to all the stuff I want to measure. I then call a function on the measurement service context to .measure a view when the value is needed instead of trying to get it onLayout. That results in much more reliable and usable behavior.

Here's an issue on the documentation repo collecting some of these things: facebook/react-native-website#2056

원문 링크

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

No branches or pull requests

1 participant