search

pjjanak / react-native-viewport

Utility to get current size of the viewport.
MIT License
46 stars 9 forks source link

General question about use #1

Open chadobado opened 9 years ago

chadobado commented 9 years ago

Thanks for creating this library.

Am curious about how to implement it for (what I would guess) is a common use-case: many components that change based on orientation and/or device size.

Image of game

or

Image of tile-list

There are cases where we would want many components to update autonomously (ex: width,height,placement,etc) relative to screen size/orientation.

Should components that all need viewport information subscribe to viewport events independently? Seems like potentially a lot of subscriptions.

Thanks in advance

pjjanak commented 9 years ago

Hey @chadobado, good question.

If you have many components that would like to know when there is an orientation change there are several ways you could do it. The easiest, I think, would be to organize your components in such a way that only one (or a few) top level components would need to listen to the orientation change event. Then it would know it needs to re-render all of it's children and place them appropriately as a result.

You would also need to have checks in this top level component to somehow dictate specific layouts (like in the first example). So if the device is an iPhone 4s use this layout, if it's an iPhone 6 use this one, etc.

I hope that begins to answer your question. This little library is really just a hook into a tiny piece of information. How you use it and how that knowledge informs your layout would very much be up to the implementation.