Support platform customization of inverted VirtualizedList #32038
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
facebook-github-bot
added
CLA Signed
|
This pull request was exported from Phabricator. Differential Revision: D30398027 |
|
Base commit: d3345f5 |
Summary: Pull Request resolved: #32038 This change slightly modifies VirtualizedList to better support platform customization of inverted behavior. For example, on react-native-windows, the transform approach to inverted breaks some scrolling input behaviors (see https://github.com/microsoft/react-native-windows/issue/4098). In react-native-windows, inverted behavior can be implemented using a combination of Yoga and platform native anchoring behaviors. When implemented this way, some assumptions in VirtualizedList are broken, namely that layouts of list items have monotonically increasing offsets on the scroll axis. Rather than entirely overhauling VirtualizedList to eliminate this assumption, a more trivial workaround is to invert the scroll and list item layout metrics in JS so they appear to be monotonically increasing for features like data loading and onEndReached events, and using raw metrics for features like scrollToIndex. We can accomplish most of this by overwriting the `_getScrollMetrics()` and `_getFrameMetrics()` functions in the platform VirtualizedList JS module. ## Changelog: [General][Added] - Support platform customization of inverted VirtualizedList Differential Revision: D30398027 fbshipit-source-id: 8ab3c2bdec29b7d9347fea1b89d034d1e7328393
|
This pull request was exported from Phabricator. Differential Revision: D30398027 |
react-native-bot
added
the
Type: Enhancement
matthargett
reviewed
Oct 6, 2021
| @@ -1827,6 +1833,7 @@ class VirtualizedList extends React.PureComponent<Props, State> { | |||
|
|
|||
| _getFrameMetricsApprox = ( | |||
| index: number, | |||
| useRawMetrics?: boolean, | |||
There was a problem hiding this comment.
would an enum be better here for revealing intention at the call sites, and for auto-completion (per Framework Design Guidelines 2nd ed)?
|
This PR is stale because it has been open 180 days with no activity. Remove stale label or comment or this will be closed in 7 days. |
github-actions
bot
added
the
Stale
|
ping? |
cortinico
removed
the
Stale
This pull request was closed.
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Summary:
This change slightly modifies VirtualizedList to better support platform customization of inverted behavior. For example, on react-native-windows, the transform approach to inverted breaks some scrolling input behaviors (see https://github.com/microsoft/react-native-windows/issue/4098).
In react-native-windows, inverted behavior can be implemented using a combination of Yoga and platform native anchoring behaviors. When implemented this way, some assumptions in VirtualizedList are broken, namely that layouts of list items have monotonically increasing offsets on the scroll axis.
Rather than entirely overhauling VirtualizedList to eliminate this assumption, a more trivial workaround is to invert the scroll and list item layout metrics in JS so they appear to be monotonically increasing for features like data loading and onEndReached events, and using raw metrics for features like scrollToIndex.
We can accomplish most of this by overwriting the
_getScrollMetrics()and_getFrameMetrics()functions in the platform VirtualizedList JS module.Changelog:
[General][Added] - Support platform customization of inverted VirtualizedList
Differential Revision: D30398027