Expo 51 and React Native 0.74 issues
dhruv-00 opened this issue · comments
Description
On initial load insets value is fine but when reloading through dev menu insets value is not correct it updates after hot reload.
Device width height is not updated dynamically. When going in setting and changing device size doesn't reflect instantly but after killing and restarting the app
Steps to reproduce
- create new app with expo 51 and react native 0.74
- initiate unistyles and log the value of insets and runtime width and height
- after dev menu reload or device size change it will not be updated
- check videos for the more explanation
Snack or a link to a repository (optional)
No response
Unistyles version
2.7.2
React Native version
0.74.1
Platforms
Android
Engine
Hermes
Architecture
Paper (old)
WhatsApp.Video.June.4.at.10.07.PM.mp4
WhatsApp.Video.June.4.at.10.07.PM.1.mp4
while creating a reproducible repo I found out that initially insets value is not correct if not re rendered
Thanks for report and repro, will try to debug it
Hey just wanted to ask, if there is a chance this could be related to an issue with delay on orientation that i'm trying to troubleshoot?
I'm also on Expo SDK 51, and using unistyles 2.7.2
expoapp-layout-oritentation-issue.mp4
No way that's happening on iOS 😦. Im also building iPad app and didn't encounter such issue. Can you share the code?
Hey. I've not been able to troubleshoot it fully yet.
I have tried a bunch of things, seeing if i could make some render optimisations, but no matter what the issue still occurs. I have a slight feeling it might be related to tabs navigation. Seems when to happen less on small screens that have less to re-render, which makes sense. So maybe my issue have nothing to do with unistyles. Again can say for sure yet.
Id be happy to share access private to our code base, in case it could help determine if unistyles is related to this.
Please do, you can invite me.
I will debug it, and later test it against new beta 🙏
Hey @dhruv-00 !
Here is reproduction and fix to your report:
- Unistyles 2.7.2
Screen.Recording.2024-06-17.at.08.47.35.mov
- Unistyles 2.8.0-beta.3
Screen.Recording.2024-06-17.at.08.48.47.mov
When it comes to When going in setting and changing device size doesn't reflect instantly but after killing and restarting the app - i think it's not the bug. Unistyles Runtime reports correct width and height (your screen size didn't change, just the content inseide). So, please double check your styles as you define content within the screen.
If you think it's still Unistyles issue then please feel free to share the demo 🙏
hey @jpudysz I've checked the beta and it is working fine and about the device resizing I think unistyles should be reactive in terms of layout also because it can colors in realtime so it should also change device's layout also
@dhruv-00 it shoud, but still what's the issue? I simply don't understand it.
You changed screen size, and your content did expand out of the screen.
UnistylesRuntime reports same screen size, because nothing changed (your app fill entire screen). Did you bound screen size to container styles? How can I repro it? I'm willing to help, but I'm not sure what are your styles and what are you doing with this container.
so I design according to figma where default screen width is 360
and if there is a box with width 100 and height 100
it will be different in a device with width of 320 and 420 and 100 in 360
to determine that I use a variable of 1/360
I've a function
scale(value: number = 10) { const threshold = 1/360 return value * threshold * UnistylesRuntime.screen.width; },
so in this case the screen width should also change but it doesn't
let me update the repro example
Cool, thanks for the demo!
I've updated the example https://github.com/dhruv-00/unistyles-repro
this is how I use unistyles in all my projects
@dhruv-00 It was all about making the screen pixel density dynamic. I used to read it only once while creating the unistyles instance.
I included a fix in version 2.8.0-beta.4.
I will keep this issue open until I release the stable version. Thanks for the demos!
I'm updating my main project with beta.4 until the stable release. I'll keep updating in the same thread if I face any issues.
I’ve just released version 2.8.0-rc.1 with a complete implementation for iOS and Android. I believe all the reported issues have been addressed.
If not, please reopen the task 🙏