-
-
Notifications
You must be signed in to change notification settings - Fork 514
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
fix(iOS): right header incorrect position #2316
Conversation
@@ -72,9 +72,6 @@ - (void)updateLayoutMetrics:(const react::LayoutMetrics &)layoutMetrics | |||
self); | |||
} else { | |||
self.bounds = CGRect{CGPointZero, frame.size}; | |||
// We're forcing the parent view to layout this subview with correct frame size, | |||
// see: https://github.com/software-mansion/react-native-screens/pull/2248 | |||
[self.superview layoutIfNeeded]; |
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.
I'm not super familiar with this code, but will this take away the ability to position the layout when the headerRight view changes internally (not through a setOptions
)?
useEffect(() => {
navigation.setOptions({
headerRight: () => <HeaderRight />
})
}, [])
const HeaderRight = () => {
const [x, setX] = useState(false)
useTimeout(() => setX(true), 2000)
return <View style={{backgroundColor:'green', height:20, width: x ? 40 : 20}} />
}
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.
@thomasttvo It'll be fine 😉. If you have any concerns, feel free to test this change within your project and let me know if it works as intended.
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.
Hey, native code changes look ok, if you claim this solves the issues. What I want you to do right now is:
- Add some inline comment around the line with
layoutIfNeeded
you added explaining why it is there. - Rebase the PR on main & make sure that it still works, since there were some changes interfering with header layout logic since this PR has been opened.
Great job overall!
@kkafar Rebased and added a brief comment. I can confirm the fix is still doing it's job 😉 |
patched this into our project and fixes our issue with the right header 👍 |
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.
Excellent @alduzy, we can proceed with merging then. Thank you!
@Jonoh89, thanks for confirmation! |
## Description This PR intents to fix header subviews incorrect layout when changing tabs. The previous solution did layout the subviews correctly in the test cases, but triggered an undesirable `layoutIfNeeded` when going back from tab to tab. In such case the navigation layout happened without updating subview's layout metrics. Moving the logic to subview resolves the issue as the re-layout is now triggered only when subview's layout metrics are updated. Related fixes from the past: #2316, #2248 ## Changes - combined `Test2231.tsx` with `Test432.tsx` to create comprehensive test case - moved re-layout logic to subview ## Screenshots / GIFs ### Before ![Screenshot 2024-10-04 at 10 10 15](https://github.com/user-attachments/assets/1a8a747e-fe1d-4b03-ba63-1891732d7d77) ### After ![Screenshot 2024-10-04 at 10 09 37](https://github.com/user-attachments/assets/68b3554f-d67d-47f4-946d-ace60e1bbf83) ## Test code and steps to reproduce - Use `Test432.tsx` repro ## Checklist - [x] Included code example that can be used to test this change - [x] Ensured that CI passes
## Description This PR fixes the incorrect position of the custom header items when updating more than one option at the same time. The proposed solution let us remove the previous fix for a similar problem: software-mansion#2248 which only fixed the issue on fabric. Fixes software-mansion#432, software-mansion#2231. ## Changes - forced re-layout of the navigation controller when subviews are updated - removed previous fix - updated `Test432` repro <!-- ## Screenshots / GIFs Here you can add screenshots / GIFs documenting your change. You can add before / after section if you're changing some behavior. ### Before ### After --> ## Test code and steps to reproduce - use `Test432` and `Test2231` to test this fix on both architectures. ## Checklist - [x] Included code example that can be used to test this change - [x] Ensured that CI passes
## Description This PR intents to fix header subviews incorrect layout when changing tabs. The previous solution did layout the subviews correctly in the test cases, but triggered an undesirable `layoutIfNeeded` when going back from tab to tab. In such case the navigation layout happened without updating subview's layout metrics. Moving the logic to subview resolves the issue as the re-layout is now triggered only when subview's layout metrics are updated. Related fixes from the past: software-mansion#2316, software-mansion#2248 ## Changes - combined `Test2231.tsx` with `Test432.tsx` to create comprehensive test case - moved re-layout logic to subview ## Screenshots / GIFs ### Before ![Screenshot 2024-10-04 at 10 10 15](https://github.com/user-attachments/assets/1a8a747e-fe1d-4b03-ba63-1891732d7d77) ### After ![Screenshot 2024-10-04 at 10 09 37](https://github.com/user-attachments/assets/68b3554f-d67d-47f4-946d-ace60e1bbf83) ## Test code and steps to reproduce - Use `Test432.tsx` repro ## Checklist - [x] Included code example that can be used to test this change - [x] Ensured that CI passes
Description
This PR fixes the incorrect position of the custom header items when updating more than one option at the same time. The proposed solution let us remove the previous fix for a similar problem: #2248 which only fixed the issue on fabric.
Fixes #432, #2231.
Changes
Test432
reproTest code and steps to reproduce
Test432
andTest2231
to test this fix on both architectures.Checklist