洪流學(xué)堂，讓你快人幾步。你好，我是你的技術(shù)探路者鄭洪智，你可以叫我大智。
小新：“這個(gè)情人節(jié)有點(diǎn)難，快遞都到不了，怎么給女神表達(dá)我滿滿的愛(ài)意呢？”
大智：“病毒可沒(méi)有把網(wǎng)絡(luò)隔離哦”
小新：“如果我給女神一個(gè)電子相冊(cè)，每個(gè)照片背后都有一段我們美好的記憶，那女神不得老感動(dòng)了，哈哈哈?！?/p>
大智：“不給你拉黑就是萬(wàn)幸了。我已經(jīng)將撩妹絕學(xué)傳授給你，你可不能吃獨(dú)食?！?/p>
小新：“那必須的，我得立馬分享出去，造福廣大同胞?！?/p>
大智：“這才像話?！?/p>
洪流學(xué)堂公眾號(hào)回復(fù)心動(dòng)時(shí)刻可獲取視頻教程。
如果你來(lái)不及動(dòng)手親自做出來(lái)，可以在洪流學(xué)堂公眾號(hào)回復(fù)私人定制。
最終效果如下：
開(kāi)發(fā)需要用到的工具如下：
- Unity
- EasyAR SDK 3.0.1（http://dl.easyar.cn/3.0/EasyARSense_3.0.1-final_Basic_Unity.zip）
- 發(fā)布需要使用的：安卓（Android SDK+JDK） / iOS（XCode）
開(kāi)發(fā)的簡(jiǎn)要流程如下：
- 創(chuàng)建Unity工程，導(dǎo)入EasyAR SDK
- 申請(qǐng)EasyAR的liscense key，并配置到Unity中
- 在
HelloAR_ImageTarget_Video的場(chǎng)景基礎(chǔ)上進(jìn)行改造，實(shí)現(xiàn)多圖片的跟蹤 - 測(cè)試、發(fā)布
1. 創(chuàng)建Unity工程，導(dǎo)入EasyAR SDK
建議使用Unity2017以上的版本，我使用的是2019.1版本，開(kāi)發(fā)過(guò)程中不會(huì)有太大差別。
下載EasyAR的Unity SDK：http://dl.easyar.cn/3.0/EasyARSense_3.0.1-final_Basic_Unity.zip
雖然目前EasyAR已經(jīng)更新到了4.0版本，但是仍建議使用EasyAR 3.0開(kāi)發(fā)，因?yàn)?.0的免費(fèi)版是無(wú)水印的，4.0的免費(fèi)版是有水印的。
下載完成后解壓出來(lái)是一個(gè).unitypackage文件，可以直接導(dǎo)入到Unity工程中。
2. 申請(qǐng)EasyAR的liscense key，并配置到Unity中
注冊(cè)EasyAR賬號(hào)，https://www.easyar.cn/
登陸后創(chuàng)建一個(gè)key：https://www.easyar.cn/view/developCenter.html#license
類型選擇EasyAR Sense 3.0中免費(fèi)的EasyAR SDK Basic即可，免費(fèi)版包含的功能可以滿足我們的需要。
配置好之后，就可以看到一個(gè)license key：
這個(gè)key需要配置到什么地方呢？看下圖中的位置：
到這配置就完成了。
3. 在HelloAR_ImageTarget_Video的場(chǎng)景基礎(chǔ)上進(jìn)行改造，實(shí)現(xiàn)多圖片的跟蹤
現(xiàn)在你可以看一下HelloAR_ImageTarget_Video場(chǎng)景，這個(gè)場(chǎng)景實(shí)現(xiàn)的功能是跟蹤圖片，識(shí)別出圖片后在圖片上顯示并播放視頻，是不是和我們的需求很相近了呢？
我們要實(shí)現(xiàn)的功能可以在這個(gè)場(chǎng)景的基礎(chǔ)上來(lái)加以改造以下幾點(diǎn)：
- 實(shí)現(xiàn)多圖片、多視頻的自動(dòng)配置管理
- 自動(dòng)根據(jù)圖片的比例設(shè)置識(shí)別圖和視頻的顯示比例
就可以基本實(shí)現(xiàn)我們的需求啦。
1、先把場(chǎng)景中的ImageTarget_argame_video拖成一個(gè)prefab
2、編輯這個(gè)Prefab，在Quad物體上添加如下腳本：
using System;
using System.Collections;
using UnityEngine;
using UnityEngine.Video;
using UnityEngine.Networking;
[RequireComponent(typeof(VideoPlayer))]
public class StreamingAssetsPathVideo : MonoBehaviour
{
public string Image;
public string Path;
// Start is called before the first frame update
IEnumerator Start()
{
if (string.IsNullOrEmpty(Path))
yield break;
var path = System.IO.Path.Combine(Application.streamingAssetsPath, Path);
var uri = new Uri(path);
// 設(shè)置視頻的路徑
GetComponent<VideoPlayer>().url = uri.AbsoluteUri;
// 獲取跟蹤圖
var www = UnityWebRequestTexture.GetTexture(new Uri(System.IO.Path.Combine(Application.streamingAssetsPath, Image)));
yield return www.SendWebRequest();
Texture2D tex2D = DownloadHandlerTexture.GetContent(www);
var ratio = (float)tex2D.height / tex2D.width;
// 設(shè)置跟蹤圖的比例
transform.localScale = new Vector3(1, ratio, 1);
GetComponent<Renderer>().material.mainTexture = tex2D;
}
}
3、在場(chǎng)景中添加一個(gè)空物體Manager，添加以下腳本：
using System;
using easyar;
using UnityEngine;
[Serializable]
public class Unit{
public string ImageFile;
public string VideoFile;
}
public class Manager : MonoBehaviour
{
public Unit[] Units;
public GameObject Prefab;
public ImageTrackerBehaviour Tracker;
// Start is called before the first frame update
void Start()
{
foreach (var unit in Units) {
var target = Instantiate(Prefab);
var targetController = target.GetComponent<ImageTargetController>();
targetController.ImageTracker = Tracker;
targetController.TargetName = unit.ImageFile;
targetController.TargetPath = unit.ImageFile;
var video = target.GetComponentInChildren<StreamingAssetsPathVideo>();
video.Image = unit.ImageFile;
video.Path = unit.VideoFile;
}
}
}
將識(shí)別圖和視頻放到StreamingAssets目錄下。
配置Manager物體上的Manager腳本：
Prefab選擇我們剛才創(chuàng)建的那個(gè)Prefab。
4.發(fā)布
發(fā)布前記得先設(shè)置Unity工程中Player Settings中的Package Name，需要和之前申請(qǐng)license時(shí)設(shè)置的Package Name一致才行。然后根據(jù)需要發(fā)布到Android或者iOS平臺(tái)即可大功告成~
洪流學(xué)堂公眾號(hào)回復(fù)心動(dòng)時(shí)刻可獲取視頻教程。
如果你來(lái)不及動(dòng)手親自做出來(lái)，可以在洪流學(xué)堂公眾號(hào)回復(fù)私人定制。
好了，今天就就讓小新絮絮叨叨到這里了。沒(méi)講清楚的地方歡迎評(píng)論。
我是大智，你的技術(shù)探路者，下次見(jiàn)！
別走！點(diǎn)贊，收藏哦！
好，你可以走了。
