Orientation changes mess up the list

[SudoPlz]

Hey there,

here's the issue that I'm having:

Note that all works well when I'm on portrait, but once I go in landscape, all hell breaks loose.
As you can see the items don't correctly on landscape, and you can see 2 items instead of one, even though their widths are correct.

I've created a repo with exactly that issue here, would you be kind enough to shed some light on this?

Thanks

[AbdallaElabd]

It's a similar problem to preserving scroll position

Maybe you can try #127 (comment), but instead of applying that logic when getting new data, you apply it when an orientation change happens.
Dimensions.addEventListener('change', ...)

[SudoPlz]

Not sure if I got this right, but my problem does not stop once the orientation changes.
Even if I fix the scroll position on orientation change, if the user tries to scroll, it will still snap to the wrong x value.

[AbdallaElabd]

Have you tried using the canChangeSize prop?

[SudoPlz]

Yeah, makes no difference.

[naqvitalha]

canChangeSize should handle it. For some reason on my machine it isn't running the iOS build. It doesn't resize on Android. Can you run this on expo so that I can have a look?

[SudoPlz]

It's using a native module (called react-native-orientation), and I haven't linked that on Android, so maybe that's why it's not working on Android.

It should work on iOS, what error do you get @naqvitalha ? Maybe I can fix it.

Also, I can create an expo, but does expo support native modules (I thought it didn't)?

I'll do anything to sort this out.

[naqvitalha]

Why do you need a native module to detect orientation change? Check #58

[SudoPlz]

Ok, I wasn't aware of that, but never the less, can you please tell me the issue iOS is giving you?
or should we skip that and create an expo project from scratch?

I really need to focus on the real issue here :/

[naqvitalha]

If you can reproduce this on Android I will take a look ASAP. I think I need to upgrade Mac OS and XCode to run the project. That's why I always use expo for iOS. Expo or, Android repro will do.

[SudoPlz]

Perfect, @naqvitalha the Android project should now be working on that same repo.

Try it and let me know how it went.

[naqvitalha]

@SudoPlz Dude I tried on Android post your changes and saw the same issue. I added canChangeSize and it works perfectly post that. canChangeSize was designed for such scenarios. Try that maybe you did something wrong before.

[SudoPlz]

Whaaat? But I did add canChangeSize and tested on iOS, and I got the same issue. :S
I'll try on Android as well!!

[naqvitalha]

Yeah :P try and let me know.

[SudoPlz]

Pffff.... it does work on the reproduction repo, but not on my main project. I might be using a slightly older version (that does have canChangeSize in it though). I'll try to update and see if that changes.

[SudoPlz]

Ok, so I confirm that after I updated to the latest version canChangeSize did work, thanks a ton for your time @naqvitalha and sorry for wasting your time.

You see I'm not using your library through npm, I'm using a build locally, because I wanted to be able to modify and debug your library in real time, without having to care about typescript.

The reason is #103

Closing the current issue as it's resolved.