-
Notifications
You must be signed in to change notification settings - Fork 1.8k
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
Allow profile header to overscroll #5457
Conversation
|
const headerTransform = useAnimatedStyle(() => ({ | ||
transform: [ | ||
{ | ||
translateY: Math.min(Math.min(scrollY.value, headerOnlyHeight) * -1, 0), | ||
}, | ||
], | ||
})) | ||
const headerTransform = useAnimatedStyle(() => { | ||
const translateY = Math.min(scrollY.value, headerOnlyHeight) * -1 | ||
return { | ||
transform: [ | ||
{ | ||
translateY: allowHeaderOverScroll | ||
? translateY | ||
: Math.min(translateY, 0), | ||
}, | ||
], | ||
} | ||
}) |
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.
This is where the action happens, the rest is just prop drilling
@@ -82,6 +83,7 @@ export const ProfileFeedSection = React.forwardRef< | |||
onScrolledDownChange={setIsScrolledDown} | |||
renderEmptyState={renderPostsEmpty} | |||
headerOffset={headerHeight} | |||
progressViewOffset={ios(0)} |
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.
this makes sure the spinner is at the top of the page, where it should be
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.
code seems ok to me but maybe let's not enable this yet (i.e. not set prop to true) until we get in the blurred stuff in as well? the behavior in this PR feels a bit weird to me.
or do you think this is decent as is? i guess it better handles profiles with tall bios than main?
I can easily feature flag it? |
e5abcd0
to
bdc0a73
Compare
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.
lgtm
This extracts the simple parts out of #2171
Adds
allowHeaderOverScroll
prop toPagerWithHeader
so that the profile header can scroll with the rest of the pageiOS only. does nothing on other platforms.
Simulator.Screen.Recording.-.iPhone.16.-.2024-09-23.at.22.02.29.mp4
Test plan
Make sure android behaves the same, and make sure other list screens on iOS are unchanged (i.e. the PTR spinner is still visible)