Aller au contenu principal

AR Clip SDK

Créez dans Unity des expériences AR qui s'ouvrent dans AR Clip sous forme d'App Clip. Votre contenu WebGL est chargé en streaming, et ARKit et AR Clip VPS se chargent de la localisation.

Avant de commencer​

Testez sur un téléphone

Dans l'éditeur Unity, la plupart des API AR Clip sont encapsulées dans Application.isEditor. Pour un vrai suivi, faites un build WebGL et testez dans l'application mobile AR Clip.

Installer le package​

  1. Ouvrez Window → Package Manager.
  2. Cliquez sur + → Add package from Git URL….
  3. Collez https://github.com/WebAR-Studio/arclip_sdk.git et validez.

Avant l'import, supprimez l'éventuel ancien dossier Assets/ARLib. Sinon, vous aurez des erreurs de symboles en double comme celle-ci :

error CS0433: The type 'ARLibTester' exists in both 'ARLib' and 'Assembly-CSharp'

Importer les exemples​

Dans Package Manager → AR Clip → Samples :

  • Importez WebGLTemplates et copiez le dossier créé à la racine de Assets/. Il apparaît ensuite dans Project Settings → Player → WebGL Template.
  • Importez TransparentBackground et déplacez TransparentBackground.jslib dans Assets/Plugins. WebGL obtient ainsi un fond transparent.

Préparer la scène​

  1. Ajoutez un GameObject vide nommé ARClipController.
  2. Ajoutez-lui ARLibController et assignez une caméra au champ renderCamera.
  3. Désactivez le composant Camera de ce GameObject. Réglez Clear Flags = Solid Color et utilisez RGBA(0,0,0,0) pour le fond.
  4. Facultatif : dans l'éditeur, ajoutez ARLibTester (depuis les exemples) pour simuler les callbacks natifs.

Script de démarrage minimal​

using UnityEngine;
using ARLib;

public class ARClipBootstrap : MonoBehaviour
{
[SerializeField] private Camera renderCamera;

private void OnEnable()
{
ARLibController.Initialized += HandleInitialized;
ARLibController.VPSPositionUpdated += HandleVpsPose;
}

private void OnDisable()
{
ARLibController.Initialized -= HandleInitialized;
ARLibController.VPSPositionUpdated -= HandleVpsPose;
}

private void Start()
{
ARLibController.SetRenderCamera(renderCamera);
ARLibController.Initialize();
}

private void HandleInitialized()
{
ARLibController.EnableCamera();
ARLibController.EnableAR();
ARLibController.EnableSurfaceTracking("horizontal");
}

private void HandleVpsPose(VPSPoseData pose)
{
Debug.Log($"VPS pose: {pose.Position}");
}
}

Lancer la localisation VPS​

Configurez le VPS après l'initialisation et avant de lancer la localisation :

var settings = new VPSSettings
{
apiKey = "your-api-key",
locationIds = new[] { "your-location-id" }
};

ARLibController.SetupVPS(settings);
ARLibController.StartVPS();

Écoutez ces événements :

  • ARLibController.VPSInitialized — le VPS est prêt.
  • ARLibController.VPSPositionUpdated — une nouvelle pose de localisation.
  • ARLibController.OnVPSErrorHappened — une erreur, sous forme de chaîne.

Pour régler la fréquence d'envoi des requêtes sur un lieu donné, utilisez SetSendPhotoDelay, SetGpsAccuracyBarrier et SetFirstRequestDelay.

Suivi d'images et de surfaces​

  • Enregistrez les images avec AddTrackingImage avant d'activer le suivi. Attendez TrackedImagesArrayUpdate pour confirmer qu'elles sont chargées.
  • Appelez EnableSurfaceTracking("horizontal" | "vertical" | "both") pour détecter des plans. Les résultats arrivent par SurfaceTrackingUpdated.

Build et mise en ligne​

  1. Choisissez le template WebGL. Dans Project Settings → Player → WebGL → Resolution and Presentation, choisissez le template que vous avez copié depuis le package.
  2. Faites le build. Utilisez File → Build Settings → WebGL → Build.
  3. Compressez. Compressez le build en zip de sorte que index.html soit à la racine de l'archive.
  4. Mettez en ligne. Envoyez l'archive dans l'outil de mise en ligne.
  5. Testez. Scannez le QR code obtenu avec l'application AR Clip pour iOS.

Dépannage​

  • Pas d'image caméra en WebGL. Vérifiez que TransparentBackground.jslib est bien dans Assets/Plugins, et que la caméra de rendu est à la fois assignée et désactivée.
  • Pas d'événements AR en mode Play dans l'éditeur. C'est normal. Utilisez ARLibTester, ou faites un build WebGL pour avoir des données réelles.
  • Erreurs de symboles en double. Vérifiez que vous avez supprimé l'ancien dossier ARLib avant d'importer le package.