diff --git a/Example/android/app/src/main/java/com/swmansion/reanimated/example/MainApplication.java b/Example/android/app/src/main/java/com/swmansion/reanimated/example/MainApplication.java index 128397314377..06828081ad5d 100644 --- a/Example/android/app/src/main/java/com/swmansion/reanimated/example/MainApplication.java +++ b/Example/android/app/src/main/java/com/swmansion/reanimated/example/MainApplication.java @@ -3,23 +3,18 @@ import android.app.Application; import android.content.Context; -import androidx.annotation.Nullable; - import com.facebook.react.ReactApplication; -import com.facebook.react.uimanager.UIImplementationProvider; import com.reactnativecommunity.picker.RNCPickerPackage; import com.swmansion.rnscreens.RNScreensPackage; import com.th3rdwave.safeareacontext.SafeAreaContextPackage; import com.facebook.react.ReactInstanceManager; import com.facebook.react.ReactNativeHost; import com.facebook.react.ReactPackage; -import com.facebook.react.bridge.JSIModulePackage; import com.facebook.react.shell.MainReactPackage; import com.facebook.soloader.SoLoader; import com.horcrux.svg.SvgPackage; import com.reactnativepagerview.PagerViewPackage; import com.swmansion.gesturehandler.react.RNGestureHandlerPackage; -import com.swmansion.reanimated.ReanimatedJSIModulePackage; import com.swmansion.reanimated.ReanimatedPackage; import org.reactnative.maskedview.RNCMaskedViewPackage; @@ -56,12 +51,6 @@ protected List getPackages() { protected String getJSMainModuleName() { return "index"; } - - @Nullable - @Override - protected JSIModulePackage getJSIModulePackage() { - return new ReanimatedJSIModulePackage(); - } }; @Override diff --git a/android/src/main/java/com/swmansion/reanimated/ReanimatedJSIModulePackage.java b/android/src/main/java/com/swmansion/reanimated/ReanimatedJSIModulePackage.java index 6de60f0918fb..687de66b96bd 100644 --- a/android/src/main/java/com/swmansion/reanimated/ReanimatedJSIModulePackage.java +++ b/android/src/main/java/com/swmansion/reanimated/ReanimatedJSIModulePackage.java @@ -1,32 +1,33 @@ package com.swmansion.reanimated; import android.util.Log; + import com.facebook.react.bridge.JSIModulePackage; import com.facebook.react.bridge.JSIModuleSpec; import com.facebook.react.bridge.JavaScriptContextHolder; import com.facebook.react.bridge.ReactApplicationContext; +import com.facebook.react.devsupport.LogBoxDialog; +import com.facebook.react.devsupport.LogBoxModule; + import java.util.Arrays; import java.util.List; public class ReanimatedJSIModulePackage implements JSIModulePackage { + /** + * @deprecated Since 2.5.0, Reanimated autoinstalls on Android - you can remove + * getJSIModulePackage() override in MainApplication.java. + */ + @Deprecated + public ReanimatedJSIModulePackage() { + super(); + } @Override public List getJSIModules( ReactApplicationContext reactApplicationContext, JavaScriptContextHolder jsContext) { - - // When debugging in chrome the JS context is not available. - // https://github.com/facebook/react-native/blob/v0.67.0-rc.6/ReactAndroid/src/main/java/com/facebook/react/modules/blob/BlobCollector.java#L25 - Utils.isChromeDebugger = jsContext.get() == 0; - - if (!Utils.isChromeDebugger) { - NodesManager nodesManager = - reactApplicationContext.getNativeModule(ReanimatedModule.class).getNodesManager(); - nodesManager.initWithContext(reactApplicationContext); - } else { - Log.w( - "[REANIMATED]", - "Unable to create Reanimated Native Module. You can ignore this message if you are using Chrome Debugger now."); - } + Log.w( + "[REANIMATED]", + "Since 2.5.0, Reanimated autoinstalls on Android - you can remove getJSIModulePackage() override in MainApplication.java."); return Arrays.asList(); } } diff --git a/android/src/main/java/com/swmansion/reanimated/ReanimatedModule.java b/android/src/main/java/com/swmansion/reanimated/ReanimatedModule.java index d76bebc4ccfc..19f69f9f2fe9 100644 --- a/android/src/main/java/com/swmansion/reanimated/ReanimatedModule.java +++ b/android/src/main/java/com/swmansion/reanimated/ReanimatedModule.java @@ -1,5 +1,6 @@ package com.swmansion.reanimated; +import android.util.Log; import com.facebook.react.bridge.Callback; import com.facebook.react.bridge.LifecycleEventListener; import com.facebook.react.bridge.ReactApplicationContext; @@ -102,6 +103,21 @@ public NodesManager getNodesManager() { return mNodesManager; } + @ReactMethod(isBlockingSynchronousMethod = true) + public void installTurboModule() { + // When debugging in chrome the JS context is not available. + // https://github.com/facebook/react-native/blob/v0.67.0-rc.6/ReactAndroid/src/main/java/com/facebook/react/modules/blob/BlobCollector.java#L25 + Utils.isChromeDebugger = getReactApplicationContext().getJavaScriptContextHolder().get() == 0; + + if (!Utils.isChromeDebugger) { + this.getNodesManager().initWithContext(getReactApplicationContext()); + } else { + Log.w( + "[REANIMATED]", + "Unable to create Reanimated Native Module. You can ignore this message if you are using Chrome Debugger now."); + } + } + @ReactMethod public void animateNextTransition(int tag, ReadableMap config) { mTransitionManager.animateNextTransition(tag, config); diff --git a/docs/docs/fundamentals/installation.md b/docs/docs/fundamentals/installation.md index d6286680c5d4..409aac4bd5ff 100644 --- a/docs/docs/fundamentals/installation.md +++ b/docs/docs/fundamentals/installation.md @@ -38,37 +38,7 @@ Reanimated plugin has to be listed last. ## Android -1. Turn on Hermes engine by editing `android/app/build.gradle` - -```java {2} -project.ext.react = [ - enableHermes: true // <- here | clean and rebuild if changing -] -``` - -2. Plug Reanimated in `MainApplication.java` - -```java {1-2,12-15} - import com.facebook.react.bridge.JSIModulePackage; // <- add - import com.swmansion.reanimated.ReanimatedJSIModulePackage; // <- add - ... - private final ReactNativeHost mReactNativeHost = new ReactNativeHost(this) { - ... - - @Override - protected String getJSMainModuleName() { - return "index"; - } - - @Override - protected JSIModulePackage getJSIModulePackage() { - return new ReanimatedJSIModulePackage(); // <- add - } - }; - ... -``` - -You can refer [to this diff](https://github.com/software-mansion-labs/reanimated-2-playground/pull/8/commits/71642dbe7bd96eb41df5b9f59d661ab15f6fc3f8) that presents the set of the above changes made to a fresh react native project in our [Playground repo](https://github.com/software-mansion-labs/reanimated-2-playground). +No additional steps are necessary. ### Proguard diff --git a/ios/REAModule.m b/ios/REAModule.m index b1aa768010d8..e45a99ced9cb 100644 --- a/ios/REAModule.m +++ b/ios/REAModule.m @@ -28,6 +28,8 @@ - (dispatch_queue_t)methodQueue return RCTGetUIManagerQueue(); } +#pragma mark-- Initialize + - (void)setBridge:(RCTBridge *)bridge { [super setBridge:bridge]; @@ -40,6 +42,11 @@ - (void)setBridge:(RCTBridge *)bridge [bridge.uiManager.observerCoordinator addObserver:self]; } +RCT_EXPORT_METHOD(installTurboModule) +{ + // TODO: Move initialization from UIResponder+Reanimated to here +} + #pragma mark-- Transitioning API RCT_EXPORT_METHOD(animateNextTransition : (nonnull NSNumber *)rootTag config : (NSDictionary *)config) diff --git a/src/reanimated2/NativeReanimated/NativeReanimated.ts b/src/reanimated2/NativeReanimated/NativeReanimated.ts index 1432be8a9f23..ab7c863526a0 100644 --- a/src/reanimated2/NativeReanimated/NativeReanimated.ts +++ b/src/reanimated2/NativeReanimated/NativeReanimated.ts @@ -1,31 +1,34 @@ +import { NativeModules } from 'react-native'; import { SharedValue } from '../commonTypes'; import { Descriptor } from '../hook/commonTypes'; -const InnerNativeModule = global.__reanimatedModuleProxy; - export class NativeReanimated { native: boolean; - useOnlyV1: boolean; + private InnerNativeModule: any; constructor(native = true) { + if (global.__reanimatedModuleProxy === undefined) { + const { ReanimatedModule } = NativeModules; + ReanimatedModule?.installTurboModule(); + } + this.InnerNativeModule = global.__reanimatedModuleProxy; this.native = native; - this.useOnlyV1 = InnerNativeModule === null; } installCoreFunctions(valueSetter: (value: T) => void): void { - return InnerNativeModule.installCoreFunctions(valueSetter); + return this.InnerNativeModule.installCoreFunctions(valueSetter); } makeShareable(value: T): T { - return InnerNativeModule.makeShareable(value); + return this.InnerNativeModule.makeShareable(value); } makeMutable(value: T): SharedValue { - return InnerNativeModule.makeMutable(value); + return this.InnerNativeModule.makeMutable(value); } makeRemote(object = {}): T { - return InnerNativeModule.makeRemote(object); + return this.InnerNativeModule.makeRemote(object); } startMapper( @@ -35,7 +38,7 @@ export class NativeReanimated { updater: () => void, viewDescriptors: Descriptor[] | SharedValue ): number { - return InnerNativeModule.startMapper( + return this.InnerNativeModule.startMapper( mapper, inputs, outputs, @@ -45,18 +48,18 @@ export class NativeReanimated { } stopMapper(mapperId: number): void { - return InnerNativeModule.stopMapper(mapperId); + return this.InnerNativeModule.stopMapper(mapperId); } registerEventHandler( eventHash: string, eventHandler: (event: T) => void ): string { - return InnerNativeModule.registerEventHandler(eventHash, eventHandler); + return this.InnerNativeModule.registerEventHandler(eventHash, eventHandler); } unregisterEventHandler(id: string): void { - return InnerNativeModule.unregisterEventHandler(id); + return this.InnerNativeModule.unregisterEventHandler(id); } getViewProp( @@ -64,10 +67,10 @@ export class NativeReanimated { propName: string, callback?: (result: T) => void ): Promise { - return InnerNativeModule.getViewProp(viewTag, propName, callback); + return this.InnerNativeModule.getViewProp(viewTag, propName, callback); } enableLayoutAnimations(flag: boolean): void { - InnerNativeModule.enableLayoutAnimations(flag); + this.InnerNativeModule.enableLayoutAnimations(flag); } } diff --git a/src/reanimated2/NativeReanimated/index.ts b/src/reanimated2/NativeReanimated/index.ts index 776ce1ff139f..7212c59ae7d3 100644 --- a/src/reanimated2/NativeReanimated/index.ts +++ b/src/reanimated2/NativeReanimated/index.ts @@ -1,6 +1,5 @@ import reanimatedJS from '../js-reanimated'; import { shouldBeUseWeb } from '../PlatformChecker'; -import { Platform } from 'react-native'; import { NativeReanimated } from './NativeReanimated'; let exportedModule; @@ -8,11 +7,6 @@ if (shouldBeUseWeb()) { exportedModule = reanimatedJS; } else { exportedModule = new NativeReanimated(); - if (exportedModule.useOnlyV1 && Platform.OS === 'android') { - console.warn( - `If you want to use Reanimated 2 then go through our installation steps https://docs.swmansion.com/react-native-reanimated/docs/installation` - ); - } } export default exportedModule as NativeReanimated; diff --git a/src/reanimated2/core.ts b/src/reanimated2/core.ts index 626153cd3813..cb4531356f4d 100644 --- a/src/reanimated2/core.ts +++ b/src/reanimated2/core.ts @@ -63,7 +63,7 @@ export const checkPluginState: (throwError: boolean) => boolean = ( export const isConfigured: (throwError?: boolean) => boolean = ( throwError = false ) => { - return checkPluginState(throwError) && !NativeReanimatedModule.useOnlyV1; + return checkPluginState(throwError); }; export const isConfiguredCheck: () => void = () => { @@ -362,32 +362,30 @@ export function runOnJS( } } -if (!NativeReanimatedModule.useOnlyV1) { - NativeReanimatedModule.installCoreFunctions( - NativeReanimatedModule.native - ? (workletValueSetter as (value: T) => void) - : (workletValueSetterJS as (value: T) => void) - ); +NativeReanimatedModule.installCoreFunctions( + NativeReanimatedModule.native + ? (workletValueSetter as (value: T) => void) + : (workletValueSetterJS as (value: T) => void) +); - if (!isWeb() && isConfigured()) { - const capturableConsole = console; - runOnUI(() => { - 'worklet'; - const console = { - debug: runOnJS(capturableConsole.debug), - log: runOnJS(capturableConsole.log), - warn: runOnJS(capturableConsole.warn), - error: runOnJS(capturableConsole.error), - info: runOnJS(capturableConsole.info), +if (!isWeb() && isConfigured()) { + const capturableConsole = console; + runOnUI(() => { + 'worklet'; + const console = { + debug: runOnJS(capturableConsole.debug), + log: runOnJS(capturableConsole.log), + warn: runOnJS(capturableConsole.warn), + error: runOnJS(capturableConsole.error), + info: runOnJS(capturableConsole.info), + }; + _setGlobalConsole(console); + if (global.performance == null) { + global.performance = { + now: global._chronoNow, }; - _setGlobalConsole(console); - if (global.performance == null) { - global.performance = { - now: global._chronoNow, - }; - } - })(); - } + } + })(); } type FeaturesConfig = {