Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add list itemLayoutAnimation documentation page and example #6279

Merged
merged 14 commits into from
Jul 23, 2024

Conversation

MatiPl01
Copy link
Member

@MatiPl01 MatiPl01 commented Jul 16, 2024

Summary

This PR adds example usage of itemLayoutAnimation prop to the example app and docs page with example recording and details.

Example image of the added docs page

Screenshot 2024-07-22 at 15 46 23

Related context

Related issue: #6278

Support for multi-column lists seems to be impossible to implement. react-native adds additional wrapper component for each row and re-renders list items in different rows when new items are added or items are removed from the list. Because the parent of list items changes and the layout animation cannot be applied to the wrapper that is added to list rows, layout animations won't work for lists with multiple columns.

At least, I didn't come up with any valid solution.

PR that adds support for FlatList items animations: #2674
What react-native does for mutli-column lists: https://github.com/facebook/react-native/blob/2098806c2207f376027184329a7285913ef8d090/packages/react-native/Libraries/Lists/FlatList.js#L643

@MatiPl01 MatiPl01 self-assigned this Jul 16, 2024
@MatiPl01 MatiPl01 marked this pull request as ready for review July 16, 2024 16:29
@MatiPl01 MatiPl01 requested a review from piaskowyk July 16, 2024 16:30
@MatiPl01 MatiPl01 changed the title Add information about lack of multi-column lists support Add list itemLayoutAnimation documentation page and example Jul 18, 2024
@MatiPl01 MatiPl01 requested a review from tjzel July 18, 2024 14:04
MatiPl01 and others added 5 commits July 22, 2024 15:02
…imations.mdx

Co-authored-by: Tomasz Żelawski <40713406+tjzel@users.noreply.github.com>
Co-authored-by: Tomasz Żelawski <40713406+tjzel@users.noreply.github.com>
…imations.mdx

Co-authored-by: Tomasz Żelawski <40713406+tjzel@users.noreply.github.com>
@MatiPl01 MatiPl01 requested a review from tjzel July 22, 2024 13:47
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants