echo3D
🌐 Back to website💻 Go to console📺 Watch workshop💬 Discuss on Slack
  • Introduction
  • Quickstart
    • 🔑Register
    • 💻Access the Console
    • 🎲Add a 3D Asset
    • 📤Share it with Others
    • ❔Troubleshooting
  • Web Console
    • 📦Load a Collection
    • 💼Manage Pages
      • Content Page
        • Assets and Targets
        • Add Content
        • Edit Content
        • Share Content
        • Access Permissions
        • Version Control
        • Asset Hierarchy
        • Bulk Actions on Assets
        • Asset Commenting
        • Activity Sidebar
      • Metadata & Tags Page
        • Collection Taxonomy and Asset Specific Metadata
        • How to Add and Edit Metadata
        • How to Add Associated Files and Text
      • Collections and Sharing Page
        • Users Tab
        • Groups Tab
        • Collections
        • Collection Sharing Tab
        • Asset Sharing Tab
        • Security Tab
      • Customizer Page
      • Model Editor Page
      • Scene Editor Page
    • 🚚Deliver Pages
      • Locations Page
      • Users Page
      • Insights Page
    • 🕛Optimize Pages
      • Convert & Compress Page
    • 🎓Learn Pages
      • Tutorials Page
    • 👤Account Page
      • Profile Tab
      • Email & Password
      • Plans Tab
      • Credit Usage Tab
      • Notifications Tab
      • Delete Account Tab
    • ❓Help Menu
    • ⏬Downloads
    • 🎨Themes
    • 🔎Search
  • API
    • 🧩Objects
    • 🗨️Queries
    • 📊Data
      • 📑What Metadata is Stored
    • 🔼Upload
    • 🔽Download
    • ❌Delete
    • 🌳Entry Hierarchy
    • 🔄Convert
    • 🔃Compress
    • 📁Organize
    • ⏪Version
    • ⏬Locate
    • 🔎Search
    • 🖼️Search by Image or Model
    • Share Content
  • Unity
    • 🔨Installation
    • 🧰Using the SDK
    • 🔧Script Settings
    • 📐Transforming Content
    • 👩‍💻Edit Code
    • 🤳Adding AR Capabilities
    • ❔Troubleshooting
  • Unreal 4
    • 🔨Installation
    • 🧰Using the SDK
    • 🔧Demo Project
  • Web
    • 🔨Installation
    • 🧰Using the Package
  • Scene Viewer
    • 📲Deploy Experience
    • 📐Transforming Content
    • 🔢Embed into Website or App
    • 👩‍💻Add Code
    • ❔Troubleshooting
  • AR.js
    • 📲Deploy Experience
    • 📐Transforming Content
    • 🔢Embed into Website or App
    • ❔Troubleshooting
  • FaceAR
    • 📲Deploy Experience
    • 📐Transforming Content
    • 🔢Embed into Website or App
    • ❔Troubleshooting
  • React Native
    • 📩Fetching Data
    • 👩‍💻Edit Code
    • 🤳Adding AR/VR Capabilities
    • 📐Transforming Content
  • Swift
    • 🔨Installation
    • 🔢Displaying a Model Asset
    • 🤳Adding AR Capabilities
    • 🧰Using the SDK
  • Flutter
    • 🔨Installation
    • 👩‍💻Edit Code
    • 🤳Adding AR Capabilities
  • JavaScript
    • 🔨Installation
    • 🧰Using the SDK
    • 📩Fetching Data
    • 👩‍💻Edit Code
  • Python
    • 🔨Installation
    • 🧰Using the SDK
    • 🔧Demo Project
  • NVIDIA Omniverse
    • 🔨Installation
  • Adobe Substance 3D Painter
    • 🔨Installation
  • 🧰Using the Plugin
  • Blender
    • 🔨Installation
    • 🧰Using the Add-on
  • eCommerce Sites
    • 🛒Shopify
    • 🌐Wix
  • 3D Content
    • 🎨Content Creation
    • 💎Google Poly
    • 📦Objaverse
    • 💫3D Capture Apps
      • MagiScan
      • Qlone
      • ARitize360
      • SCANN3D
      • 3D Scanner
      • Didimo Xperience
      • Scaniverse
      • Metascan3D
      • Polycam3D
      • RealityScan
Powered by GitBook
On this page
  • 1. Repository Setup
  • 2. Console Setup
  • 3. Unity Project Build Settings
  • Android
  • iOS
  • 4. Flutter Configuration
  • Android
  • iOS
  • 5. Run

Was this helpful?

  1. Flutter

Adding AR Capabilities

Learn how to add AR capabilities to your cloud-connected Flutter project.

PreviousEdit CodeNextInstallation

Last updated 1 year ago

Was this helpful?

Now that you are successfully able to stream 3D content into Flutter and know how to make custom adjustments, it's time to add AR capabilities to your project.

To add AR capabilities, we will integrate Unity as a library into our Flutter project.

Unity provides a framework purpose-built for AR development called . It allows you to build across multiple mobile and wearable AR devices, such as Android with ARCore and iOS with ARKit.

1. Repository Setup

Clone our open-source example project.

2. Console Setup

to the console.

Create a new Unity project.

.

Open the sample scene under echo3D/Examples/sample.unity.

in the Inspector of the echo3D game object.

3. Unity Project Build Settings

Android

Open the Build Settings window by clicking File > Build Settings....

Select Android and click Switch Platform.

Check Export Project.

Open the Player Settings window by clicking Player Settings...

Configure the folowing:

  • Other Settings > Rendering > Graphics APIs: OpenGLES3

  • Other Settings > Configuration > Scripting Backends: IL2CPP

  • Other Settings > Configuration > Target Architectures: ✔ ARMv7, ✔ ARM64

Notice what is your Minimum API Level. You may need it later.

Close the Player Settings window.

Click Add Open Scenes.

Click Export and save as unityExport.

iOS

Open the Build Settings window by clicking File > Build Settings....

Select iOS and click Switch Platform.

Click Add Open Scenes.

Click Export and save as unityProject.

4. Flutter Configuration

Import the project dependecies by running flutter pub get from your terminal

Android

Copy your unityExport folder to <your_flutter_project>/android/unityExport

Run flutter pub run flutter_unity:unity_export_transmogrify in your terminal

Open <your_flutter_project>/android/app/build.gradle and make sure your project minSdkVersion equals to the one you defined for your Unity Project as Minimum API Level.

Open <your_flutter_project>/android/build.gradle and, inside allprojects { repositories {} }, add the following:

flatDir {
    dirs "${project(':unityExport').projectDir}/libs"
}

so it will look something like this:

allprojects {
    repositories {
        google()
        jcenter()
        flatDir {
            dirs "${project(':unityExport').projectDir}/libs"
                }
    }
}

Open <your_flutter_project>/android/settings.gradle and add the following at the end of the file:include ':unityExport'

iOS

Copy your UnityProject folder to <your_flutter_project>/iOS/UnityProject

Open <your_flutter_project>/iOS/Runner.xcworkspace in Xcode

Go to File > Add Files to "Runner", and add <your_flutter_project>/ios/UnityProject/Unity-iPhone.xcodeproj

Select Unity-iPhone/Data, and, in the Inspectors pane, set the Target Membership to UnityFramework

Select Unity-iPhone, select PROJECT : Unity-iPhone, and, in the Build Settings tab, configure the following:

  • Build Options > Enable Bitcode: No

  • Linking > Other Linker Flags: -Wl,-U,_FlutterUnityPluginOnMessage

Select Runner, select TARGETS : Runner, and, in the General tab, configure the following:

  • Frameworks, Libraries, and Embedded Content: UnityFramework.framework -> Embed & Sign

Open Runner/Runner/Info.plist, and configure the following:

Key

Type

Value

io.flutter.embedded_views_preview

Boolean

YES

5. Run

Open your main.dart file.

Find and replace the value <YOUR-PROJECT-KEY> with your API key and uncomment the code line.

Find and replace the value <YOUR-ENTRY-ID> with your model's entry ID and uncomment the code line.

Save the file and run the project on an phone.

🤳
AR Foundation
Flutter + Unity + AR Foundation + echo3D
Add a 3D model
Install the echo3D Unity SDK
Set the API key