Skip to content
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

Android targetSdk 35 update - Add Android only padding to account for lack of SafeAreaView #94

Open
wants to merge 2 commits into
base: main
Choose a base branch
from

Conversation

alanleedev
Copy link
Collaborator

@alanleedev alanleedev commented Jan 9, 2025

Summary:

Updating to targetSdk 35 on Android enforces edge-to-edge on Android 15+.
We decided not to use react-native-safe-area-context in the template (PR #84 ) to reduce external dependency although it is the current recommendation handling forced edge-to-edge.
To account for UI overlap, we are using a magic padding value for Android in the template.
iOS still uses SafeAreaView and remain unaffected.

Changelog:

[ANDROID][CHANGED] - update targetSdk to 35 which will enforce edge-to-edge on Android 15+

Test Plan:

ios_safeareaview.mp4
ios_safeareaview_land.mp4
android_hacky_padding.mp4
android_hacky_padding_land.mp4

…rgetSdk 35.

This is to avoid importing react-native-safe-area-context library which is the recommended approach but omitting here to reduce external dependency.
@alanleedev alanleedev self-assigned this Jan 9, 2025
@alanleedev alanleedev marked this pull request as ready for review January 9, 2025 22:24
@@ -71,10 +75,14 @@ function App(): React.JSX.Element {
<ScrollView
contentInsetAdjustmentBehavior="automatic"
style={backgroundStyle}>
<Header />
<View style={{paddingRight: hackyPadding}}>
Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

right padding for RN version indicator

<View
style={{
backgroundColor: isDarkMode ? Colors.black : Colors.white,
paddingHorizontal: hackyPadding,
Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

left, right padding for content within ScrollView

<View
style={{
backgroundColor: isDarkMode ? Colors.black : Colors.white,
paddingHorizontal: hackyPadding,
paddingBottom: hackyPadding,
Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

bottom padding to prevent content overlap with button nav bar

@blakef
Copy link
Collaborator

blakef commented Jan 10, 2025

@cipolleschi can you make a call on this? @alanleedev I'm away atm.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants