last item in Horizontal flatlist moves to the left in ANDROID when an item is removed
Description
while looking at the end of horizontal flatlist, when an item is deleted then the last item in Horizontal flatlist moves to the left in ANDROID leaving an empty space but when we scroll a bit the last item comes to the end. but surprisingly this does not happen for vertical flatlist(default) and it happens only in android. its working fine in web
check the screenshots here : https://github.com/facebook/react-native/issues/36416#issuecomment-1462081750
React Native Version
0.71.3
Output of npx react-native info
System: OS: macOS 13.2.1 CPU: (10) arm64 Apple M1 Pro Memory: 168.89 MB / 16.00 GB Shell: 5.8.1 - /bin/zsh Binaries: Node: 16.17.0 - /usr/local/bin/node Yarn: 1.22.19 - ~/Desktop/project/todoApp/todoV1/todo/node_modules/.bin/yarn npm: 8.15.0 - /opt/homebrew/bin/npm Watchman: 2023.02.13.00 - /opt/homebrew/bin/watchman Managers: CocoaPods: 1.11.3 - /usr/local/bin/pod SDKs: iOS SDK: Platforms: DriverKit 22.2, iOS 16.2, macOS 13.1, tvOS 16.1, watchOS 9.1 Android SDK: Not Found IDEs: Android Studio: 2022.1 AI-221.6008.13.2211.9477386 Xcode: 14.2/14C18 - /usr/bin/xcodebuild Languages: Java: 11.0.18 - /usr/bin/javac npmPackages: @react-native-community/cli: ^10.2.0 => 10.2.0 react: 18.2.0 => 18.2.0 react-native: 0.71.3 => 0.71.3 react-native-macos: Not Found npmGlobalPackages: react-native: Not Found
Steps to reproduce
create a HORIZONTAL flatlist with items such that we can scroll over them. move to the end and delete any item using hooks the last item will be moved to its left
Snack, code example, screenshot, or link to a repository
https://snack.expo.io/@saad-bashar/remove-item-flatlist
while searching for a solution found this code by Saad Khan. Try running this code in both web and android and delete an item at the last. You can notice the difference.
| :warning: | Newer Version of React Native is Available! |
|---|---|
| :information_source: | You are on a supported minor version, but it looks like there's a newer patch available. Please upgrade to the highest patch for your minor or latest and verify if the issue persists (alternatively, create a new project and repro the issue in it). If it does not repro, please let us know so we can close out this issue. This helps us ensure we are looking at issues that still exist in the most recent releases. |
it is working fine on both (Android and IOS)
it is working fine on both (Android and IOS)
Really? did you try after moving to the end?
yes, @prithivilaksh
yes, @prithivilaksh
This is the case for me
before deleting
after deleting

Expecting this

@prithivilaksh Try this https://github.com/facebook/react-native/issues/36845#issuecomment-1508369640