Browse Source

Rename android package, add readme instructions

Janic Duplessis 5 years ago
parent
commit
ec27b755f1

+ 96
- 0
README.md View File

@@ -1 +1,97 @@
1 1
 # react-native-safe-area-context
2
+
3
+A flexible way to handle safe area, also works on Android!
4
+
5
+## Getting started
6
+
7
+Install the library using either Yarn:
8
+
9
+```
10
+yarn add react-native-safe-area-context
11
+```
12
+
13
+or npm:
14
+
15
+```
16
+npm install --save react-native-safe-area-context
17
+```
18
+
19
+You then need to link the native parts of the library for the platforms you are using. The easiest way to link the library is using the CLI tool by running this command from the root of your project:
20
+
21
+```
22
+react-native link react-native-safe-area-context
23
+```
24
+
25
+If you can't or don't want to use the CLI tool, you can also manually link the library using the instructions below (click on the arrow to show them):
26
+
27
+<details>
28
+<summary>Manually link the library on iOS</summary>
29
+
30
+Either follow the [instructions in the React Native documentation](https://facebook.github.io/react-native/docs/linking-libraries-ios#manual-linking) to manually link the framework or link using [Cocoapods](https://cocoapods.org) by adding this to your `Podfile`:
31
+
32
+```ruby
33
+pod 'react-native-safe-area-context', :path => '../node_modules/react-native-safe-area-context'
34
+```
35
+
36
+</details>
37
+
38
+<details>
39
+<summary>Manually link the library on Android</summary>
40
+
41
+Make the following changes:
42
+
43
+#### `android/settings.gradle`
44
+```groovy
45
+include ':react-native-safe-area-context'
46
+project(':react-native-safe-area-context').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-safe-area-context/android')
47
+```
48
+
49
+#### `android/app/build.gradle`
50
+```groovy
51
+dependencies {
52
+   ...
53
+   implementation project(':react-native-safe-area-context')
54
+}
55
+```
56
+
57
+#### `android/app/src/main/.../MainApplication.java`
58
+On top, where imports are:
59
+
60
+```java
61
+import com.th3rdwave.safeareacontext.SafeAreaContextPackage;
62
+```
63
+
64
+Add the `SafeAreaContextPackage` class to your list of exported packages.
65
+
66
+```java
67
+@Override
68
+protected List<ReactPackage> getPackages() {
69
+    return Arrays.asList(
70
+            new MainReactPackage(),
71
+            new SafeAreaContextPackage()
72
+    );
73
+}
74
+```
75
+</details>
76
+
77
+## Example
78
+
79
+```js
80
+import React from 'react';
81
+import { View } from 'react-native';
82
+import { SafeAreaProvider, useSafeArea } from 'react-native-safe-area-context';
83
+
84
+function SomeComponent() {
85
+  const insets = useSafeArea();
86
+
87
+  return <View style={{ paddingTop: insets.top }} />;
88
+}
89
+
90
+function App() {
91
+  return (
92
+    <SafeAreaProvider>
93
+      <SomeComponent />
94
+    </SafeAreaProvider>
95
+  );
96
+}
97
+```

+ 1
- 1
android/src/main/AndroidManifest.xml View File

@@ -1,6 +1,6 @@
1 1
 
2 2
 <manifest
3 3
 	xmlns:android="http://schemas.android.com/apk/res/android"
4
-	package="com.th3rdwave.safeareaview">
4
+	package="com.th3rdwave.safeareacontext">
5 5
 
6 6
 </manifest>

android/src/main/java/com/th3rdwave/safeareaview/EdgeInsets.java → android/src/main/java/com/th3rdwave/safeareacontext/EdgeInsets.java View File

@@ -1,4 +1,4 @@
1
-package com.th3rdwave.safeareaview;
1
+package com.th3rdwave.safeareacontext;
2 2
 
3 3
 /* package */ class EdgeInsets {
4 4
   public float top;

android/src/main/java/com/th3rdwave/safeareaview/InsetsChangeEvent.java → android/src/main/java/com/th3rdwave/safeareacontext/InsetsChangeEvent.java View File

@@ -1,4 +1,4 @@
1
-package com.th3rdwave.safeareaview;
1
+package com.th3rdwave.safeareacontext;
2 2
 
3 3
 import com.facebook.react.bridge.Arguments;
4 4
 import com.facebook.react.bridge.WritableMap;

android/src/main/java/com/th3rdwave/safeareaview/SafeAreaViewPackage.java → android/src/main/java/com/th3rdwave/safeareacontext/SafeAreaContextPackage.java View File

@@ -1,4 +1,4 @@
1
-package com.th3rdwave.safeareaview;
1
+package com.th3rdwave.safeareacontext;
2 2
 
3 3
 import com.facebook.react.ReactPackage;
4 4
 import com.facebook.react.bridge.NativeModule;
@@ -10,7 +10,7 @@ import java.util.List;
10 10
 
11 11
 import javax.annotation.Nonnull;
12 12
 
13
-public class SafeAreaViewPackage implements ReactPackage {
13
+public class SafeAreaContextPackage implements ReactPackage {
14 14
 
15 15
   @Nonnull
16 16
   @Override
@@ -23,4 +23,5 @@ public class SafeAreaViewPackage implements ReactPackage {
23 23
   public List<ViewManager> createViewManagers(@Nonnull ReactApplicationContext reactContext) {
24 24
     return Collections.<ViewManager>singletonList(new SafeAreaViewManager());
25 25
   }
26
+
26 27
 }

android/src/main/java/com/th3rdwave/safeareaview/SafeAreaView.java → android/src/main/java/com/th3rdwave/safeareacontext/SafeAreaView.java View File

@@ -1,4 +1,4 @@
1
-package com.th3rdwave.safeareaview;
1
+package com.th3rdwave.safeareacontext;
2 2
 
3 3
 import android.app.Activity;
4 4
 import android.content.Context;
@@ -7,7 +7,6 @@ import android.os.Build;
7 7
 import android.view.Surface;
8 8
 import android.view.View;
9 9
 import android.view.ViewTreeObserver;
10
-import android.view.Window;
11 10
 import android.view.WindowInsets;
12 11
 import android.view.WindowManager;
13 12
 

android/src/main/java/com/th3rdwave/safeareaview/SafeAreaViewManager.java → android/src/main/java/com/th3rdwave/safeareacontext/SafeAreaViewManager.java View File

@@ -1,4 +1,4 @@
1
-package com.th3rdwave.safeareaview;
1
+package com.th3rdwave.safeareacontext;
2 2
 
3 3
 import com.facebook.react.common.MapBuilder;
4 4
 import com.facebook.react.uimanager.ThemedReactContext;

+ 2
- 2
example/android/app/src/main/java/com/safeareaviewexample/MainApplication.java View File

@@ -7,7 +7,7 @@ import com.facebook.react.ReactNativeHost;
7 7
 import com.facebook.react.ReactPackage;
8 8
 import com.facebook.react.shell.MainReactPackage;
9 9
 import com.facebook.soloader.SoLoader;
10
-import com.th3rdwave.safeareaview.SafeAreaViewPackage;
10
+import com.th3rdwave.safeareacontext.SafeAreaContextPackage;
11 11
 
12 12
 import java.util.Arrays;
13 13
 import java.util.List;
@@ -24,7 +24,7 @@ public class MainApplication extends Application implements ReactApplication {
24 24
     protected List<ReactPackage> getPackages() {
25 25
       return Arrays.asList(
26 26
           new MainReactPackage(),
27
-          new SafeAreaViewPackage());
27
+          new SafeAreaContextPackage());
28 28
     }
29 29
 
30 30
     @Override

+ 1
- 1
package.json View File

@@ -1,7 +1,7 @@
1 1
 {
2 2
   "name": "react-native-safe-area-context",
3 3
   "version": "0.1.0",
4
-  "description": "A more flexible <SafeAreaView>",
4
+  "description": "A flexible way to handle safe area, also works on Android.",
5 5
   "main": "src/index.tsx",
6 6
   "files": [
7 7
     "/android",