npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

@mythologi/react-native-unity

v0.1.11

Published

React Native package to use Unity as library with React Native app

Downloads

5

Readme

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>
  )
}