|
3 | 3 | * [[Setup] Create the calculator folder and the package.json](#setup)
|
4 | 4 | * [[Native Module] Create the JS import](#js-import)
|
5 | 5 | * [[Native Module] Create the iOS implementation](#ios-native)
|
| 6 | +* [[Native Module] Create the Android implementation](#android-native) |
6 | 7 |
|
7 | 8 | ## Steps
|
8 | 9 |
|
@@ -111,3 +112,110 @@ Pod::Spec.new do |s|
|
111 | 112 | s.dependency "React-Core"
|
112 | 113 | end
|
113 | 114 | ```
|
| 115 | + |
| 116 | +### <a name="android-native" />[[Native Module] Create the Android implementation](https://github.com/cipolleschi/RNNewArchitectureLibraries/commit/) |
| 117 | + |
| 118 | +1. Create a folder `calculator/android` |
| 119 | +1. Create a file `calculator/android/build.gradle` and add this code: |
| 120 | + ```js |
| 121 | + buildscript { |
| 122 | + ext.safeExtGet = {prop, fallback -> |
| 123 | + rootProject.ext.has(prop) ? rootProject.ext.get(prop) : fallback |
| 124 | + } |
| 125 | + repositories { |
| 126 | + google() |
| 127 | + gradlePluginPortal() |
| 128 | + } |
| 129 | + dependencies { |
| 130 | + classpath("com.android.tools.build:gradle:7.0.4") |
| 131 | + } |
| 132 | + } |
| 133 | + |
| 134 | + apply plugin: 'com.android.library' |
| 135 | + |
| 136 | + android { |
| 137 | + compileSdkVersion safeExtGet('compileSdkVersion', 31) |
| 138 | + |
| 139 | + defaultConfig { |
| 140 | + minSdkVersion safeExtGet('minSdkVersion', 21) |
| 141 | + targetSdkVersion safeExtGet('targetSdkVersion', 31) |
| 142 | + } |
| 143 | + } |
| 144 | + |
| 145 | + repositories { |
| 146 | + maven { |
| 147 | + // All of React Native (JS, Obj-C sources, Android binaries) is installed from npm |
| 148 | + url "$projectDir/../node_modules/react-native/android" |
| 149 | + } |
| 150 | + mavenCentral() |
| 151 | + google() |
| 152 | + } |
| 153 | + |
| 154 | + dependencies { |
| 155 | + implementation 'com.facebook.react:react-native:+' |
| 156 | + } |
| 157 | + ``` |
| 158 | +1. Create a file `calculator/android/src/main/AndroidManifest.xml` and add this code: |
| 159 | + ```xml |
| 160 | + <manifest xmlns:android="http://schemas.android.com/apk/res/android" |
| 161 | + package="com.rnnewarchitecturelibrary"> |
| 162 | + </manifest> |
| 163 | + ``` |
| 164 | +1. Create a file `calculator/android/src/main/java/com/rnnewarchitecturelibrary/CalculatorModule.java` and add this code: |
| 165 | + ```java |
| 166 | + package com.rnnewarchitecturelibrary; |
| 167 | +
|
| 168 | + import com.facebook.react.bridge.NativeModule; |
| 169 | + import com.facebook.react.bridge.Promise; |
| 170 | + import com.facebook.react.bridge.ReactApplicationContext; |
| 171 | + import com.facebook.react.bridge.ReactContext; |
| 172 | + import com.facebook.react.bridge.ReactContextBaseJavaModule; |
| 173 | + import com.facebook.react.bridge.ReactMethod; |
| 174 | + import java.util.Map; |
| 175 | + import java.util.HashMap; |
| 176 | +
|
| 177 | + public class CalculatorModule extends ReactContextBaseJavaModule { |
| 178 | + CalculatorModule(ReactApplicationContext context) { |
| 179 | + super(context); |
| 180 | + } |
| 181 | +
|
| 182 | + @Override |
| 183 | + public String getName() { |
| 184 | + return "RNCalculator"; |
| 185 | + } |
| 186 | +
|
| 187 | + @ReactMethod |
| 188 | + public void add(int a, int b, Promise promise) { |
| 189 | + promise.resolve(a + b); |
| 190 | + } |
| 191 | + } |
| 192 | + ``` |
| 193 | +1. Create a file `calculator/android/src/main/java/com/rnnewarchitecturelibrary/CalculatorPackage.java` and add this code: |
| 194 | + ```java |
| 195 | + package com.rnnewarchitecturelibrary; |
| 196 | +
|
| 197 | + import com.facebook.react.ReactPackage; |
| 198 | + import com.facebook.react.bridge.NativeModule; |
| 199 | + import com.facebook.react.bridge.ReactApplicationContext; |
| 200 | + import com.facebook.react.uimanager.ViewManager; |
| 201 | +
|
| 202 | + import java.util.ArrayList; |
| 203 | + import java.util.Collections; |
| 204 | + import java.util.List; |
| 205 | +
|
| 206 | + public class CalculatorPackage implements ReactPackage { |
| 207 | +
|
| 208 | + @Override |
| 209 | + public List<ViewManager> createViewManagers(ReactApplicationContext reactContext) { |
| 210 | + return Collections.emptyList(); |
| 211 | + } |
| 212 | +
|
| 213 | + @Override |
| 214 | + public List<NativeModule> createNativeModules(ReactApplicationContext reactContext) { |
| 215 | + List<NativeModule> modules = new ArrayList<>(); |
| 216 | + modules.add(new CalculatorModule(reactContext)); |
| 217 | + return modules; |
| 218 | + } |
| 219 | +
|
| 220 | + } |
| 221 | + ``` |
0 commit comments