This page shows how to Create the Flutter platform client using platform channels


Clone and run sample Flutter app with ARCloud module bridge.

Step 1 - Clone this git repo

Github - Graffity-Technologies/graffity-viewer

Step 2 - Put YOUR_ACCESS_TOKEN in TextField and press Submit Button

Create the Flutter platform client

Step 1 - Import the necessary packages

import 'dart:async';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';

Step 2 - Construct the channel to establish communication between Flutter and platform-specific code

Read More: Flutter Docs (opens in a new tab)

class _MyHomePageState extends State<MyHomePage> {
  static const platform = MethodChannel('YOUR_CHANNEL'); // For example 'samples.flutter.dev/ar'

Step 3 - Invoke a method on the method channel

Here is how you get your Access Token

static const platform = MethodChannel('YOUR_CHANNEL'); // For example 'samples.flutter.dev/ar'
var String accessToken = "YOUR_ACCESS_TOKEN"
Future<void> _openARFunction() async {
    await platform.invokeMethod('YOUR_METHOD_CHANNEL', {'accessToken': accessToken});

Step 4 - Use your function

  onPressed: _openARFunction,
  child: Text(
    'Open AR',),

iOS with Flutter

Before starting, make sure you already Install the Graffity AR Cloud SDK for iOS

Let's get started!

Step 1 - Setup AR

import UIKit
import Flutter
@objc class AppDelegate: FlutterAppDelegate {
    var navigationController: UINavigationController!
    override func application(
        _ application: UIApplication,
        didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?) -> Bool {
        // Optional if you have external packages such as url_launcher, etc.    
        GeneratedPluginRegistrant.register(with: self) 
        // AR Setup
        let controllerAR = window?.rootViewController as! FlutterViewController
        self.navigationController = UINavigationController(rootViewController: controllerAR)
        self.window.rootViewController = self.navigationController
        self.navigationController.setNavigationBarHidden(true, animated: false)

Step 2 - Flutter Platform Channel Setup

let ARChannel = FlutterMethodChannel(name: "YOUR_CHANNEL", binaryMessenger: controllerAR.binaryMessenger)
    ARChannel.setMethodCallHandler { [weak self] (call: FlutterMethodCall, result: @escaping FlutterResult) -> Void in
            if call.method == "YOUR_METHOD_CHANNEL" {
                if let args = call.arguments as? Dictionary<String, Any>,
                    let accessToken = args["accessToken"] as? String {
                    let arVC = ARViewController()
                    arVC.accessToken = accessToken
                    self?.navigationController?.setNavigationBarHidden(false, animated: true)
                    self?.navigationController?.pushViewController(arVC, animated: true)

Step 3 - Create ARViewController.swift

import UIKit
import GraffityARCloudService
class ARViewController: UIViewController {
    var accessToken: String?
    let graffityARCloud = GraffityARCloud(accessToken: "YOUR_ACCESS_TOKEN")
    override func viewDidLoad() {
        // Use the "accessToken" property to display the passed data
        if let accessToken = accessToken {
                let graffityARCloud = GraffityARCloud(accessToken: accessToken)
                let arCloudUIView = ARCloudUIView(service: self.graffityARCloud)

Step 4 - Finally, Add a permission request for your iOS app

Check this

Android with Flutter

Before starting, ensure you do steps 1 - 3 of the Android SDK page.

Step 1 - Add Graffity AR Cloud dependencies

Step 2 - Set minimum SDK version

Step 3 - Add package dependency

Let's get started!

Step 1 - Add an AR Cloud activity

import android.content.Intent
import androidx.annotation.NonNull
import com.graffity.arcloud.ar.ARCloudActivity
import io.flutter.embedding.android.FlutterActivity
import io.flutter.embedding.engine.FlutterEngine
import io.flutter.plugin.common.MethodChannel
import io.flutter.plugins.GeneratedPluginRegistrant
class MainActivity: FlutterActivity() {
    private val CHANNEL = "YOUR_CHANNEL"
    override fun configureFlutterEngine(@NonNull flutterEngine: FlutterEngine) {
        MethodChannel(flutterEngine.dartExecutor.binaryMessenger, CHANNEL).setMethodCallHandler {
                call, result ->
            if (call.method == "YOUR_METHOD_CHANNEL") {
                val accessToken = call.argument<String>("accessToken")
                val intent = Intent(this, ARCloudActivity::class.java)
                intent.putExtra("PointCloudMode", true)
                intent.putExtra("AccessToken", accessToken)
            } else {

Step 2 - Finally, Add a permission request for your Android app

Check this

Report Issues

If you're facing any issues related to this package, please find out here.