-
Notifications
You must be signed in to change notification settings - Fork 24.3k
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
Support sticky headers for inverted Lists #17762
Support sticky headers for inverted Lists #17762
Conversation
@facebook-github-bot label Core Team Generated by 🚫 dangerJS |
@@ -676,6 +684,15 @@ const ScrollView = createReactClass({ | |||
this.scrollResponderHandleScroll(e); | |||
}, | |||
|
|||
_handleLayout: function(e: Object) { | |||
if (this.props.invertStickyHeaders) { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Fast path here since we only need the height of the ScrollView for the inverted case which is pretty rare.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
awesome, thanks @janicduplessis!
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@sahrens is landing this pull request. If you are a Facebook employee, you can view this diff on Phabricator.
@sahrens Might need to re-import there was a flow error. |
I tried to merge this pull request into the Facebook internal repo but some checks failed. To unblock yourself please check the following: Does this pull request pass all open source tests on GitHub? If not please fix those. Does the code still apply cleanly on top of GitHub master? If not can please rebase. In all other cases this means some internal test failed, for example a part of a fb app won't work with this pull request. I've added the Import Failed label to this pull request so it is easy for someone at fb to find the pull request and check what failed. If you don't see anyone comment in a few days feel free to comment mentioning one of the core contributors to the project so they get a notification. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@sahrens is landing this pull request. If you are a Facebook employee, you can view this diff on Phabricator.
@sahrens Now I'm waiting for that blog post 😄 |
Summary: Sticky headers for inverted lists should still stick at the top of the list instead of the bottom. Tested by adding the inverted prop to the SectionList example in RNTester. It does add a prop to ScrollView but it's very specific to the inverted list implementation, not sure if it should be documented. [GENERAL][ENHANCEMENT][LISTS] - Support sticky headers for inverted Lists Closes facebook#17762 Differential Revision: D6830784 Pulled By: sahrens fbshipit-source-id: 6841fdd46e04b30547659d85ff54c3a21c61a8a2
Hi @janicduplessis, now headers stick for the top instead of the bottom, but still, they are footers but not headers. Should I do some extra setup to fix it? |
Is this making it into upstream anytime soon? I just stumbled across this exact use case. |
@terrysahaidak, did you found a solution how to make sticky headers stick to the top in inverted section list? |
Motivation
Sticky headers for inverted lists should still stick at the top of the list instead of the bottom.
Test Plan
Tested by adding the inverted prop to the SectionList example in RNTester.
Related PRs
It does add a prop to ScrollView but it's very specific to the inverted list implementation, not sure if it should be documented.
Release Notes
[GENERAL][ENHANCEMENT][LISTS] - Support sticky headers for inverted Lists