Vuforia開發完全指南（四）--- Image Target

Vuforia開發完全指南---Image Target，簡單方便的AR圖像識別

概述

在Vuforia提供的SDK中，最簡單、也是最常見的AR功能就是Image Target---圖像識別。你只需提供一張可識別的圖片，將圖片移到設備的攝像頭下，設備上就能出現之前已經集成進去的虛擬場景，而且可以根據ARCamera的不同模式，讓圖片和虛擬場景的疊加現象有所不同。這篇文章詳細講解了Vuforia中基於Image Target的AR產品開發流程，學完之后你就能開發出一個基於圖片的AR App。

演示Demo

這是筆者做的一個簡單的冰與火之歌的AR Demo，基於Vuforia Image Target。
點擊觀看
視頻地址：https://v.qq.com/x/page/k0557z1x02n.html

准備工作

工欲善其事，必先利其器。首先我們要做的是准備好工具，這里采用Unity作為開發工具，演示在iOS設備上，因此還需要Mac系統和Xcode。進行開發的第一步就是要下載Vuforia的SDK，登上Vuforia官網進入開發者平台下載Unity的SDK包，完成之后將package導入到Unity中。然后就要登錄License Manager和Target Manager創建App的license，以及上傳需要掃描的圖片。關於License Manager和Target Manager，已經在之前的教程中詳細講過了，可以參考一下。
Vuforia開發完全指南（三）---License Manager和Target Manager詳解

首先是在License Manager中創建license key，然后進入Target Manger創建Database，上傳需要掃描的圖片。這里在點擊Add Target之后選擇的類型是Device，然后輸入相關參數。上傳成功后就可以下載圖片SDK，導入到Unity中。

功能開發

1. 打開Unity工程，在Project面板中找到Vuforia文件夾，將其Prefabs文件夾中的ARCamera拖到Unity場景中，之后刪掉場景中之前默認的Camera。
2. 將Prefabs文件夾中的ImageTarget拖到場景中，這個是Vuforia用來專門進行圖像識別的工具。
   
3. 點擊場景中的ARCamera，在其選項面板中點擊“Open Vuforia configuration”，將之前創建的license key復制到“App License Key”輸入框中。然后在下面的Datasets中，勾選住之前創建的database以及其“Activate”選項，將database激活。
4. 點擊場景中的ImageTarget，在其選項面板的“Image Target Behaviour”組件中，在Database和Image Target選中對應的名字。
5. 將想要展現的3D模型拖入到場景中，並將其作為ImageTarget的子物體。這樣，已經完成了最簡單的AR圖像識別，如果你現在編譯工程在設備上運行，將識別圖放到攝像頭取景范圍內，模型就能出來了，並隨着識別圖的位置改變而改變。但是如果想要加入更多的交互功能，就要用代碼來控制。
6. 點擊場景中的ImageTarget，在其屬性面板中可以看到已經掛了一個腳本“Default Trackable Event Handler”，在這個腳本里我們就能對AR場景中的物體進行控制，當圖片被成功識別時做什么，當圖片消失時又會做什么。
   
   在這個腳本中需要關注兩個函數：OnTrackingFound()和OnTrackingLost()函數。其中OnTrackingFound會在圖片被識別后調用，OnTrackingLost會在被識別的圖片從攝像頭取景范圍內消失后調用。這兩個函數的定義如下：

		private void OnTrackingFound()
        {
            Renderer[] rendererComponents = GetComponentsInChildren<Renderer>(true);
            Collider[] colliderComponents = GetComponentsInChildren<Collider>(true);

            // Enable rendering:
            foreach (Renderer component in rendererComponents)
            {
                component.enabled = true;
            }

            // Enable colliders:
            foreach (Collider component in colliderComponents)
            {
                component.enabled = true;
            }

            Debug.Log("Trackable " + mTrackableBehaviour.TrackableName + " found");
        }


        private void OnTrackingLost()
        {
            Renderer[] rendererComponents = GetComponentsInChildren<Renderer>(true);
            Collider[] colliderComponents = GetComponentsInChildren<Collider>(true);

            // Disable rendering:
            foreach (Renderer component in rendererComponents)
            {
                component.enabled = false;
            }

            // Disable colliders:
            foreach (Collider component in colliderComponents)
            {
                component.enabled = false;
            }

            Debug.Log("Trackable " + mTrackableBehaviour.TrackableName + " lost");
        }

這兩個函數的最后都有一行Debug.Log的打印，里面有mTrackableBehaviour.TrackableName這個變量。這個變量就是之前在Target Manager中上傳圖片后，導入到圖片SDK的圖片名字。還記得在上傳圖片時需要輸入的那個名字字符串么？mTrackableBehaviour.TrackableName這個變量就和那個名字字符串是一樣的，因此我們可以在代碼中利用這個變量來判斷是哪張圖片被識別，繼而控制場景中的物體。

在這個例子中，筆者在場景中加了一個紅龍Dragon的模型，還加了一個附帶幾個按鈕的Canvas，用來控制這個紅龍的動作。在Default Trackable Event Handler腳本中，將Dragon和Canvas聲明為public變量，

public GameObject dragon;
public GameObject canvas;

將場景中的Dragon和Canvas拖入到腳本中的物體框。然后在OnTrackingFound()函數中添加當圖像被識
別后，對Dragon和Canvas的控制代碼，這里只是簡單的讓兩者出現，注意這里對圖片的名字進行了判斷，雖說工程中只有這一張圖片，但是當需要識別多張圖片時，就必須通過ImageTarget中的圖像名稱來判斷識別出的是哪張圖片。

if (mTrackableBehaviour.TrackableName == "Dragon")
{
    dragon.SetActive(true);
    canvas.SetActive(true);
}

同樣，在OnTrackingLost()函數中通過對mTrackableBehaviour.TrackableName的判斷，來讓Dragon和Canvas消失。

if (mTrackableBehaviour.TrackableName == "Dragon")
{
    dragon.SetActive(false);
    canvas.SetActive(false);
}

Canvas中對Dragon控制的按鈕腳本代碼就不貼出來了，大家可以通過自己的需求加上很多酷炫和實用的功能。

當代碼檢查無誤后，就能編譯工程，拷進設備進行AR體驗了。大家可以看到使用Vuforia的Image Target功能，無需很復雜的代碼就能做出非常酷炫的AR程序。