microsoft / microsoft/react-native-windows
Inverting Flatlist does not render properly nor does scroll behavior work as expected
Nobody has claimed this yet.
- Dominant language
- C++
- Stars
- 17.3k
- Forks
- 1.2k
- Avg merge
- 1d 13h
- Merged PRs (30d)
- 33
Description
"react-native@0.60.6"
"react-native-windows@0.60.0-vnext.133",
node -v: 10.15.0
npm -v: 6.4.1
- Target Platform Version(s): 10.0.18362.0
- Target Device(s): Desktop
- Visual Studio Version: VS 2017
- Build Configuration: Debug & Release
Steps to Reproduce
- Create a component that has a FlatList in it.
- Set the inverted property to true
Expected Behavior
Assuming a list of items 0-100, the FlatList with inverted set to true should render with item 0 at the bottom of the list, and item 100 at the top of the list.
If you were to scroll up, the list should scroll up, and if you were to scroll down, the list should scroll down.
Actual Behavior
While the flat list does indeed have the items in the correct order, the whole flat list is flipped on its top edge, meaning that it renders entirely outside of its normal bounds.
The scroll behavior is also inverted. If you were to scroll up, the list scrolls down, and if you were to scroll down, the list scrolls up.
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start by reproducing a FlatList with inverted set to true using the React Native Windows versions and environment listed in the issue. Compare its rendered bounds and scroll direction with the expected behavior; done when item order, placement, and scrolling all match the described expectations.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- react-native
- Domain
- desktop, frontend
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Quiet
- Clarity
- Clearly specified
- Newbie friendliness
- 52/100