Comment intégrer les applications mobiles :

Une fois l'écran des détails du produit ouvert, vous devrez valider le SKU. Une demande d'API doit être envoyée au point de terminaison suivant :

https://api.tangiblee.com/api/tngimpr?ids=<sku1>&domain=<domain>&activeLocale=en

Où réf. 1 est la variante actuelle SKU, un domaine doit être votre domaine.

Une fois que l'utilisateur a cliqué sur le PDP, un écran contenant le composant WebView doit s'ouvrir. Transmettez l'URL au format suivant :

https://cdn.tangiblee.com/widget/index.html?id=sku&domain=<retailer domain>&useCookies=true&price=<price>&currency=<currency symbol>

Configuration de l'application

Au cas où nous aurions besoin d'afficher la réalité augmentée, les autorisations de la caméra doivent être spécifiées.

iOS‍

1. Dans info.plist, vous devez ajouter le code suivant (cliquez avec le bouton droit de la souris et sélectionnez « Afficher en tant que code source » pour les ajouter) :

<key>NSCameraUsageDescription</key>
<string>Camera Access</string>

2. Créez un WebView et définissez le champ AllowsInlineMediaPlayback dans la WebConfiguration sur true.

Exemple de code :

class ViewController: UIViewController, WKUIDelegate {
var webView: WKWebView!

	override func loadView() {
	    let webConfiguration = WKWebViewConfiguration()
	    webConfiguration.allowsInlineMediaPlayback = true
	    webView = WKWebView(frame: .zero, configuration: webConfiguration)
	    webView.uiDelegate = self
	    view = webView
	}
	
	override func viewDidLoad() {
	    super.viewDidLoad()         
	    let myURL = URL(string:"https://cdn.tangiblee.com/widget/index.html?id=th1791880&domain=titan.co.in&useCookies=true&price=13495.00&currency=₹&version=3.1.1.180")
	    let myRequest = URLRequest(url: myURL!)
	    webView.load(myRequest)
	}
}

Android‍

1. Ajoutez au fichier manifeste :

<uses-permission android:name="android.permission.INTERNET"/>
<uses-permission android:name="android.permission.CAMERA" />

2. Ajoutez un élément WebView au fichier activity_main.xml (ou à un autre fichier .xml)

Exemple de code :

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <WebView
        android:id="@+id/webview"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

</RelativeLayout>

3. Ajoutez le code suivant à MainActivity.kt (ou à un autre fichier .java ou .kt) :

class MainActivity : AppCompatActivity() {
    val PERMISSION_CAMERA_REQUEST_CODE = 200
    lateinit var webView: WebView;

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
        requestPermissions(this, arrayOf(Manifest.permission.CAMERA), PERMISSION_CAMERA_REQUEST_CODE)

        webView = findViewById(R.id.webview)
        webView.setWebChromeClient(object : WebChromeClient() {
            override fun onPermissionRequest(request: PermissionRequest) {
                if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
                    request.grant(request.resources)
                }
            }
        })

        webView.loadUrl("https://cdn.tangiblee.com/widget/index.html?id=th1791880&domain=titan.co.in&useCookies=true&price=13495.00¤cy=₹&version=3.1.1.180")
        webView.settings.javaScriptEnabled = true
    }
}

Restrictions

Tangiblee ne dispose pas encore de SDK mobile. Si vous souhaitez ajouter Tangiblee à votre application mobile, veuillez en informer votre responsable de compte, qui sera en mesure de vous proposer des options.

La réalité augmentée sur iOS est prise en charge à partir de la version 14.3. Sur les versions plus anciennes que celle-ci, le CTA tangible doit être masqué.