Skip to content

Commit

Permalink
feat: Add React Native 0.66 support (#490)
Browse files Browse the repository at this point in the history
* feat: Add React Native 0.66 support

* Generate lockfiles

* Update Podfile.lock

* chore: Migrate from react-native-navigation to react-navigation (#491)

* Migrate RNN -> RN

* Migrate all screens

* Fix get permission status

* fix app name

* Update AppDelegate.m

* Fix Info.plist

* Set `UIViewControllerBasedStatusBarAppearance` to `YES`

* Only enable `audio` if user granted microphone permission

* Update App.tsx

* Fix RNGH for Android

* Use `navigate` instead of `push`

* Fix animation

* Upgrade @types/react-native

* "Splash" -> "PermissionsPage"
  • Loading branch information
mrousavy committed Oct 5, 2021
1 parent a78bff6 commit 916278d
Show file tree
Hide file tree
Showing 23 changed files with 711 additions and 596 deletions.
1 change: 1 addition & 0 deletions .gitignore
Expand Up @@ -34,6 +34,7 @@ project.xcworkspace
.gradle
local.properties
android.iml
*.hprof

# Cocoapods
#
Expand Down
2 changes: 1 addition & 1 deletion android/gradle.properties
Expand Up @@ -15,6 +15,6 @@ VisionCamera_buildToolsVersion=30.0.0
VisionCamera_compileSdkVersion=30
VisionCamera_kotlinVersion=1.5.30
VisionCamera_targetSdkVersion=30
VisionCamera_ndkVersion=20.1.5948944
VisionCamera_ndkVersion=21.4.7075529
android.enableJetifier=true
android.useAndroidX=true
2 changes: 1 addition & 1 deletion example/.eslintrc.js
Expand Up @@ -10,7 +10,7 @@ module.exports = {
ecmaVersion: 2018,
sourceType: 'module',
},
ignorePatterns: ['babel.config.js', 'metro.config.js', '.eslintrc.js', 'index.js'],
ignorePatterns: ['babel.config.js', 'metro.config.js', '.eslintrc.js'],
plugins: ['@typescript-eslint'],
extends: ['plugin:@typescript-eslint/recommended', '@react-native-community', '../.eslintrc.js'],
};
10 changes: 10 additions & 0 deletions example/android/app/build.gradle
Expand Up @@ -122,6 +122,11 @@ def jscFlavor = 'org.webkit:android-jsc:+'
*/
def enableHermes = project.ext.react.get("enableHermes", false)

/**
* Architectures to build native code for in debug.
*/
def nativeArchitectures = project.getProperties().get("reactNativeDebugArchitectures")

android {
ndkVersion rootProject.ext.ndkVersion
compileSdkVersion rootProject.ext.compileSdkVersion
Expand Down Expand Up @@ -156,6 +161,11 @@ android {
buildTypes {
debug {
signingConfig signingConfigs.debug
if (nativeArchitectures) {
ndk {
abiFilters nativeArchitectures.split(',')
}
}
}
release {
// Caution! In production, you need to generate your own keystore file.
Expand Down
@@ -1,8 +1,34 @@
package com.mrousavy.camera.example;

import com.reactnativenavigation.NavigationActivity;
import com.facebook.react.ReactActivity;
import com.facebook.react.ReactActivityDelegate;
import com.facebook.react.ReactRootView;
import com.swmansion.gesturehandler.react.RNGestureHandlerEnabledRootView;
import android.os.Bundle;

public class MainActivity extends NavigationActivity {
public class MainActivity extends ReactActivity {

/**
* Returns the name of the main component registered from JavaScript. This is used to schedule
* rendering of the component.
*/
@Override
protected String getMainComponentName() {
return "VisionCameraExample";
}

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(null);
}

@Override
protected ReactActivityDelegate createReactActivityDelegate() {
return new ReactActivityDelegate(this, getMainComponentName()) {
@Override
protected ReactRootView createRootView() {
return new RNGestureHandlerEnabledRootView(MainActivity.this);
}
};
}
}
@@ -1,22 +1,25 @@
package com.mrousavy.camera.example;

import android.app.Application;
import android.content.Context;
import com.facebook.react.PackageList;
import com.mrousavy.camera.frameprocessor.FrameProcessorPlugin;
import com.reactnativenavigation.NavigationApplication;
import com.facebook.react.ReactApplication;
import com.facebook.react.ReactInstanceManager;
import com.facebook.react.ReactNativeHost;
import com.reactnativenavigation.react.NavigationReactNativeHost;
import com.facebook.react.ReactPackage;

import com.facebook.soloader.SoLoader;
import java.util.List;
import com.mrousavy.camera.CameraPackage;

import com.mrousavy.camera.CameraPackage;
import com.mrousavy.camera.frameprocessor.FrameProcessorPlugin;
import com.facebook.react.bridge.JSIModulePackage;
import com.swmansion.reanimated.ReanimatedJSIModulePackage;

public class MainApplication extends NavigationApplication {

public class MainApplication extends Application implements ReactApplication {

private final ReactNativeHost mReactNativeHost =
new NavigationReactNativeHost(this) {
new ReactNativeHost(this) {
@Override
public boolean getUseDeveloperSupport() {
return BuildConfig.DEBUG;
Expand All @@ -27,7 +30,6 @@ protected List<ReactPackage> getPackages() {
@SuppressWarnings("UnnecessaryLocalVariable")
List<ReactPackage> packages = new PackageList(this).getPackages();
// Packages that cannot be autolinked yet can be added manually here, for VisionCameraExample:
// packages.add(new MyReactNativePackage());
packages.add(new CameraPackage());
return packages;
}
Expand All @@ -51,7 +53,7 @@ public ReactNativeHost getReactNativeHost() {
@Override
public void onCreate() {
super.onCreate();
// register VisionCamera Frame Processor Plugins here.
SoLoader.init(this, /* native exopackage */ false);
FrameProcessorPlugin.register(new ExampleFrameProcessorPlugin());
}
}
2 changes: 1 addition & 1 deletion example/android/build.gradle
Expand Up @@ -7,7 +7,7 @@ buildscript {
minSdkVersion = 21
compileSdkVersion = 30
targetSdkVersion = 30
ndkVersion = "20.1.5948944"
ndkVersion = "21.4.7075529"
}
repositories {
google()
Expand Down
80 changes: 3 additions & 77 deletions example/index.js
@@ -1,79 +1,5 @@
import 'react-native-gesture-handler';
import { Navigation } from 'react-native-navigation';
import { gestureHandlerRootHOC } from 'react-native-gesture-handler';
import { CameraPage } from './src/CameraPage';
import { Splash } from './src/Splash';
import { MediaPage } from './src/MediaPage';
import { Camera } from 'react-native-vision-camera';
import { AppRegistry } from 'react-native';
import { App } from './src/App';

Navigation.setDefaultOptions({
topBar: {
visible: false,
},
window: {
backgroundColor: 'black',
},
layout: {
backgroundColor: 'black',
componentBackgroundColor: 'black',
},
statusBar: {
animated: true,
drawBehind: true,
translucent: true,
visible: true,
style: 'dark',
},
animations: {
setRoot: {
alpha: {
duration: 500,
from: 0,
to: 1,
},
},
},
});

Navigation.registerComponent(
'Splash',
() => gestureHandlerRootHOC(Splash),
() => Splash,
);
Navigation.registerComponent(
'CameraPage',
() => gestureHandlerRootHOC(CameraPage),
() => CameraPage,
);
Navigation.registerComponent(
'MediaPage',
() => gestureHandlerRootHOC(MediaPage),
() => MediaPage,
);

Navigation.events().registerNavigationButtonPressedListener((event) => {
if (event.buttonId === 'back') Navigation.pop(event.componentId);
});

Navigation.events().registerAppLaunchedListener(async () => {
const [cameraPermission, microphonePermission] = await Promise.all([
Camera.getCameraPermissionStatus(),
Camera.getMicrophonePermissionStatus(),
]);
let rootName = 'Splash';
if (cameraPermission === 'authorized' && microphonePermission === 'authorized') rootName = 'CameraPage';

Navigation.setRoot({
root: {
stack: {
children: [
{
component: {
name: rootName,
},
},
],
},
},
});
});
AppRegistry.registerComponent('VisionCameraExample', () => App);
1 change: 1 addition & 0 deletions example/ios/Podfile
Expand Up @@ -15,5 +15,6 @@ target 'VisionCameraExample' do

post_install do |installer|
react_native_post_install(installer)
__apply_Xcode_12_5_M1_post_install_workaround(installer)
end
end

0 comments on commit 916278d

Please sign in to comment.