@mythologi/react-native-unity
TypeScript icon, indicating that this package has built-in type declarations

0.1.11 • Public • Published

react-native-unity-play

Thanks to two projects react-native-unity and react-native-unity-view

I collected and modified the code that allows you to embed a UNITY project into the react native as a full-fledged component

EXAMPLE

GOOGLE DRIVE LINK

Getting started

$ npm install react-native-unity-play --save

Before build project in Unity

UNITY VERSION >= 2020.x

iOS

UNITY PLAYER SETTINGS

  1. Multitasking -> Requires Fullscreen -> no selection set !
  2. Status Bar -> Status Bar Hidden -> no selection set !

Android

BUILD SETTINGS

  1. Export project -> selection set !

UNITY PLAYER SETTINGS

  1. Resolution and Presentation -> Start in fullscreen mode -> no selection set !
  2. Resolution and Presentation -> Render outside safe area -> no selection set !

Installation

  1. Install package via npm
  2. Move your Unity project to unity folder at project root

iOS

  1. Run pod install
  2. Build Unity app to [project_root]/unity/builds/ios
  3. Add Unity-iPhone.xcodeproj to your workspace: Menu -> File -> Add Files to [workspace_name]... -> [project_root]/unity/builds/ios/Unity-iPhone.xcodeproj
  4. Add UnityFramework.framework to Frameworks, Libraries, and Embedded Content:
    • select your_app target in workspace
    • in General / Frameworks, Libraries, and Embedded Content press +
    • select Unity-iPhone/Products/UnityFramework.framework
    • in Build Phases remove UnityFramework.framework from Linked Frameworks and Libraries ( select it and press - )
    • in Build Phases move Embedded Frameworks before Compile Sources ( drag and drop )

Add following lines to your project main.m file (located at same folder with AppDelegate)

#import <UIKit/UIKit.h>
+++ #import <RNUnity/RNUnity.h>

#import "AppDelegate.h"

int main(int argc, char * argv[]) {
  @autoreleasepool {
    +++ [RNUnity setArgc:argc];
    +++ [RNUnity setArgv:argv];
    return UIApplicationMain(argc, argv, nil, NSStringFromClass([AppDelegate class]));
  }
}

Add following lines to your project AppDelegate.m file

#import "AppDelegate.h"

#import <React/RCTBridge.h>
#import <React/RCTBundleURLProvider.h>
#import <React/RCTRootView.h>
+++ #import <RNUnity/RNUnity.h>

+++ - (void)applicationWillResignActive:(UIApplication *)application { [[[RNUnity ufw] appController] applicationWillResignActive: application]; }
+++ - (void)applicationDidEnterBackground:(UIApplication *)application { [[[RNUnity ufw] appController] applicationDidEnterBackground: application]; }
+++ - (void)applicationWillEnterForeground:(UIApplication *)application { [[[RNUnity ufw] appController] applicationWillEnterForeground: application]; }
+++ - (void)applicationDidBecomeActive:(UIApplication *)application { [[[RNUnity ufw] appController] applicationDidBecomeActive: application]; }
+++ - (void)applicationWillTerminate:(UIApplication *)application { [[[RNUnity ufw] appController] applicationWillTerminate: application]; }

@end

Android

  1. Create directory into android/app/libs

  2. Copy libs from <project_name>/unity/builds/android/unityLibrary/libs/* to android/app/libs

  3. Add ndk support into android/app/build.gradle

    defaultConfig {
        ...
        ndk {
            abiFilters "armeabi-v7a", "arm64-v8a"
        }
    }
  4. Append the following lines to android/settings.gradle:

    include ':unityLibrary'
    project(':unityLibrary').projectDir=new File('..\\unity\\builds\\android\\unityLibrary')
  5. Insert the following lines inside the dependencies block in android/app/build.gradle:

      implementation project(':unityLibrary')
      implementation files("${project(':unityLibrary').projectDir}/libs/unity-classes.jar")
  6. Add strings to res/values/strings.xml

    <string name="game_view_content_description">Game view</string>
    <string name="unity_root">unity_root</string>
  7. Update .MainActivity into AndroidManifest.xml

    <application
      ...
      android:extractNativeLibs="true"
    
    <activity
      android:name=".MainActivity"
      ...
      android:configChanges="mcc|mnc|locale|touchscreen|keyboard|keyboardHidden|navigation|orientation|screenLayout|uiMode|screenSize|smallestScreenSize|fontScale|layoutDirection|density"
      android:hardwareAccelerated="true"
    >
  8. Setup minSdkVersion greater than or equal to 21

  9. Remove <intent-filter>...</intent-filter> from <project_name>/unity/builds/android/unityLibrary/src/main/AndroidManifest.xml at unityLibrary to leave only integrated version.

  10. Add to android/gradle.properties

    unityStreamingAssets=.unity3d
  11. Add to build.gradle

    allprojects {
        repositories {
            flatDir {
                dirs "$rootDir/app/libs"
            }
  12. <project_name>/unity/builds/android/unityLibrary/src/main/AndroidManifest.xml delete android:icon="@mipmap/app_icon" and android:theme="@style/UnityThemeSelector" if they are installed

Usage

import { StyleSheet, View, Dimensions, Button } from 'react-native'
import UnityView, { UnityModule, UnityResponderView } from 'react-native-unity-play'

const { width, height } = Dimensions.get('window')

const App: () => Node = () => {
  const [isVisible, setVisible] = useState(false)
  let unityElement

  if (Platform.OS === 'android') {
    unityElement = <UnityView style={{ flex: 1 }} />
  } else {
    unityElement = <UnityResponderView fullScreen={true} style={{ width: width, height: height }} />
  }

  return (
    <View>
      {!isVisible && <Button title={'Start'} onPress={() => setVisible(true)} />}
      {isVisible && (
        <>
          {unityElement}
          <View
            style={{
              position: 'absolute',
              top: 45,
              left: 20,
              zIndex: 2,
            }}>
            <Button
              title={'Close'}
              onPress={() => {
                if (Platform.OS === 'android') {
                  UnityModule.quit()
                }
                setVisible(false)
              }}
              style={{ color: '#fff' }}
            />
          </View>
        </>
      )}
    </View>
  )
}

Readme

Keywords

Package Sidebar

Install

npm i @mythologi/react-native-unity

Weekly Downloads

3

Version

0.1.11

License

MIT

Unpacked Size

440 kB

Total Files

56

Last publish

Collaborators

  • stockhuman