From 33981944f5cb1c572733c74001240c9b07920d0c Mon Sep 17 00:00:00 2001
From: Alan Lee <42583872+alanleedev@users.noreply.github.com>
Date: Tue, 14 Jan 2025 08:07:49 -0800
Subject: [PATCH] Android targetSdk 35 update - remove SafeAreaView and use
 padding (#95)

* Use safe padding for both iOS and Android and Remove use of SafeAreaView and ScrollView.contentInsetAdjustmentBehavior prop.

* update Android targetSdkVersion to 35

---------

Co-authored-by: Nicola Corti <corti.nico@gmail.com>
---
 template/App.tsx              | 23 ++++++++++++++++++-----
 template/android/build.gradle |  2 +-
 2 files changed, 19 insertions(+), 6 deletions(-)

diff --git a/template/App.tsx b/template/App.tsx
index 125fe1b..b693003 100644
--- a/template/App.tsx
+++ b/template/App.tsx
@@ -8,7 +8,6 @@
 import React from 'react';
 import type {PropsWithChildren} from 'react';
 import {
-  SafeAreaView,
   ScrollView,
   StatusBar,
   StyleSheet,
@@ -62,19 +61,33 @@ function App(): React.JSX.Element {
     backgroundColor: isDarkMode ? Colors.darker : Colors.lighter,
   };
 
+  /*
+   * To keep the template simple and small we're adding padding to prevent view
+   * from rendering under the System UI.
+   * For bigger apps the reccomendation is to use `react-native-safe-area-context`:
+   * https://github.com/AppAndFlow/react-native-safe-area-context
+   *
+   * You can read more about it here:
+   * https://github.com/react-native-community/discussions-and-proposals/discussions/827
+   */
+  const safePadding = '5%';
+
   return (
-    <SafeAreaView style={backgroundStyle}>
+    <View style={backgroundStyle}>
       <StatusBar
         barStyle={isDarkMode ? 'light-content' : 'dark-content'}
         backgroundColor={backgroundStyle.backgroundColor}
       />
       <ScrollView
-        contentInsetAdjustmentBehavior="automatic"
         style={backgroundStyle}>
-        <Header />
+        <View style={{paddingRight: safePadding}}>
+          <Header/>
+        </View>
         <View
           style={{
             backgroundColor: isDarkMode ? Colors.black : Colors.white,
+            paddingHorizontal: safePadding,
+            paddingBottom: safePadding,
           }}>
           <Section title="Step One">
             Edit <Text style={styles.highlight}>App.tsx</Text> to change this
@@ -92,7 +105,7 @@ function App(): React.JSX.Element {
           <LearnMoreLinks />
         </View>
       </ScrollView>
-    </SafeAreaView>
+    </View>
   );
 }
 
diff --git a/template/android/build.gradle b/template/android/build.gradle
index a62d6da..9766946 100644
--- a/template/android/build.gradle
+++ b/template/android/build.gradle
@@ -3,7 +3,7 @@ buildscript {
         buildToolsVersion = "35.0.0"
         minSdkVersion = 24
         compileSdkVersion = 35
-        targetSdkVersion = 34
+        targetSdkVersion = 35
         ndkVersion = "27.1.12297006"
         kotlinVersion = "2.0.21"
     }