FlashList multi-column layout broken in RTL mode on Android

[SMhdAsadi]

Current behavior

When using FlashList with numColumns greater than 1 in RTL mode, the layout is incorrectly rendered on Android. The items are misaligned and do not follow the expected grid pattern. This issue is specific to RTL mode; the layout works correctly in LTR mode.

Using the disableAutoLayout prop fixes the issue, suggesting that the auto-layout feature might not be handling RTL correctly for multi-column layouts.

Screenshots (click to expand)

Expected behavior

The FlashList should maintain proper grid alignment even in RTL mode when numColumns is greater than 1, similar to its behavior in LTR mode or when disableAutoLayout is true.

To Reproduce

I've created a reproducible example here: https://github.com/SMhdAsadi/FlashListRTLIssueAndroid

Steps to reproduce:

1. Clone the repository
2. Install dependencies
3. Run the app in RTL mode on an Android device/emulator
4. Observe the misaligned grid layout

Environment details:

• React Native version: 0.74.5
• FlashList version: 1.7.1
• Expo version: 51.0.28

Platform:

• iOS
• Android

Note: Haven't tested on iOS due to environment limitations.

Environment

@shopify/flash-list: 1.7.1

Additional context

• The issue only occurs in RTL mode
• Using disableAutoLayout={true} resolves the issue
• The problem is consistent across different Android devices