前段時(shí)間公司有一個(gè)AR涂涂樂(lè)的項(xiàng)目,雖然之前接觸過(guò)AR也寫(xiě)過(guò)小Demo,但是沒(méi)有完整開(kāi)發(fā)過(guò)AR項(xiàng)目.不過(guò)經(jīng)過(guò)1個(gè)多星期的學(xué)習(xí),現(xiàn)在已經(jīng)把項(xiàng)目相關(guān)的技術(shù)都學(xué)會(huì)了,在此向互聯(lián)網(wǎng)上那些樂(lè)于分享的程序員前輩們致敬.學(xué)習(xí)的過(guò)程中我發(fā)現(xiàn)好多博客只有代碼沒(méi)有講解,在這里我就寫(xiě)一個(gè)詳細(xì)一點(diǎn)的涂涂樂(lè)教程吧.

一.AR涂涂樂(lè)原理

目前市場(chǎng)上所有的AR產(chǎn)品中,涂涂樂(lè)是一個(gè)做的比較成功的產(chǎn)品,因?yàn)槠湫蜗?生動(dòng) 新奇的特點(diǎn),在早教行業(yè)內(nèi)很受歡迎.其實(shí)AR涂涂樂(lè)的原理非常簡(jiǎn)單,就是把被當(dāng)作畫(huà)畫(huà)工具的識(shí)別圖上的顏色材質(zhì)渲染到空白的模型上.

二.制作流程

我大概總結(jié)了下從模型到AR應(yīng)用涉及到的具體流程,如下:

  1. 美術(shù)制作AR應(yīng)用中需要用到的模型和動(dòng)畫(huà)

  2. 模型制作好之后,對(duì)照識(shí)別圖上的模型外形匹配好UV

  3. UV匹配好之后把模型和識(shí)別圖交付程序,程序登錄Vuforia官網(wǎng)添加證書(shū)和目標(biāo)數(shù)據(jù)

  4. 程序把Vuforia插件和目標(biāo)數(shù)據(jù)分別下好并導(dǎo)入工程

  5. 刪除默認(rèn)場(chǎng)景中的攝像機(jī),添加ARCamera和ImageTarget到場(chǎng)景并配置好參數(shù)

  6. 把涂涂樂(lè)需要用到的模型放入場(chǎng)景,把模型的動(dòng)畫(huà)切好

  7. 求識(shí)別圖4個(gè)頂點(diǎn)的位置,獲取一幀圖像,把這些參數(shù)傳給Shader,Shader處理過(guò)后,識(shí)別圖上的顏色就渲染到模型上了

  8. 導(dǎo)出的手機(jī),我這里是安卓平臺(tái)

三.圖文教程

這里以我最近寫(xiě)的項(xiàng)目為例:

網(wǎng)友評(píng)論