Touchable Row Direction Problem

With a Touchable set to Direction = Row, two nested views appear correct in the builder, but not in iOS live preview. To work around the issue, I inserted a View in the hierarchy and set its Direction to Row.


Problem Screen:
https://build.draftbit.com/apps/uMgqC9KB/screens/8bBaA4g4?c=jPJXNyZa


Working Screen:
https://build.draftbit.com/apps/uMgqC9KB/screens/9QFX10ez?c=uyv0Riba


Thanks!
Gary

Hey @Gary_Griffin thanks for pointing this out! So, I think you actually ended up in the proper place: best practice is to nest two or more “sibling” items inside a “parent” view, and then set flex-direction of the parent to Row.

In general, the “source of truth” for how a Layout will look is the Live Preview (Expo) experience, while the in-browser experience is not source-of-truth (however it’s quite good!). I’m not 100% on how to change the flex-direction of items which are nested, so I’ll have to check and circle back with you. I’m also leaving this bug report open because the mismatch between Web Preview and Live Preview is still a bug.

Thanks again for taking the time to report!

1 Like