Unity学习4:如何实现2D图像跟踪(涂色类AR项目实践1)

简介: AR tracked image manager(2D图像检测追踪管理器)


AR tracked image manager(2D图像检测追踪管理器)

跟踪图像管理器是一种可跟踪管理器,执行二维图像跟踪。

跟踪图像管理器为环境中检测到的每个图像创建游戏对象。在可以检测到图像之前,必须指示管理器查找编译到参考图像库中的一组参考图像。

何为参考图像库(Reference Image library)?

参考图像库用来存储一系列的参考图像用于对比,每一个图像跟踪程序都必须有一个参考图 像库,但需要注意的是,参考图像库中存储的实际是参考图像的特征值信息而不是原始图 像,这有助于提高对比速度与鲁棒性。参考图像库越大,图像对比就会越慢,建议参考图像 库的图像不要超过 1000 张。

参考图片库可以在运行时设置,但只要启用了跟踪图片管理器组件,参考图片库必须为非空。

您可以将参考图像库设置为 XRReferenceImageLibraryRuntimeReferenceImageLibrary。只能在 Editor 中创建 XRReferenceImageLibrary,不能在运行时修改。

准备:创建项目

在资源管理面板新建几个文件夹,用于存放和管理资源文件,在Assets面板单击鼠标右键选择“create-》Floder",更改文件名

Scenes:系统默认生成,用于存放场景文件

Scripts:存放脚本文件

Fbxes:存放Fbx格式的模型文件

Materials:存放材质文件

Textures:存放贴图纹理文件

Shaders:存放shader脚本

ImageLib:存放参考图像库

第一步:创建参考图像库

在 Unity 中新建一个工程,第一步建立一个参考图像库,首先在 Project 窗口中的 ImageLib 文件夹下点击鼠标右键并依次选择 Create->XR->Reference Image Library 新建一个参考图 像库,并命名为 RefImageLib,如下图所示。

在 Project 窗口中的 Fbxes(没有就创建一个)文件夹下拖进两个.fbx格式的模型Earth和Frame

网盘链接获取模型和图片

链接:https://pan.baidu.com/s/1-zC4vNAs7UU9pzj2-WueLw提取码:lixu

在 Project 窗口中的 TexTures(没有就创建一个)文件夹下拖进两张.png格式图片

这里我们用到的参考识别图像是Card_02(有轮廓)

此张图片是Card_01(无轮廓)

选择新建的 RefImageLib 参考图像库,在 Inspector 窗口中,点击“Add Image”添加参考图像,将参考图像拖到图像框中,如下图所示。

Physical Size:尽量小些,还原真实尺寸,如果识别图的尺寸填太大了后面检测出的模型就会很小

第二步:挂载组件

在完成上述工作之后,在 Hierarchy 窗口中选择 AR Session Origin,并为其挂载 AR Tracked Image Manager 组件,将第一步制作的 RefImageLib 参考图像库拖到 Reference Library 属性中,并设置相 应的 Prefab(这里用到的预制体是我们组员提前制作好的.fbx格式的地球仪模型),如下图所示。

Serialized Library里设置的是刚刚创建的参考图像库RefImageLib

Max Number of Moving Images表示最大的追踪的图像数量

Tracked Image Prefab:设置的是我们组员提前制作好的.fbx格式地球仪模型(命名为Earth)

小插曲:如何显示整个地球仪

在资源管理面板的“materials”文件夹中,新建一个材质并命名为“Mat_Color”,Shader属性选择“Mobile-》Diffuse”,贴图选择Textures文件夹下的Card_02

到这一步运行出来的画面就已经有纹路了,存疑?

现在就跑出来的demo会只显示一个地球却没有框架,因为我们只添加了Earth模型作为图像追踪的预制体,所以我们把Earth和Frame都拖到Hierarchy窗口,并把Frame作为Earth的子物体,最后把Earth拖到AR tracked image manager的Tracked Image Prefab下

除此之外还会出现一个bug,在画面中即使没有检测到图像,也会始终有一个地球仪的模型,画面中出现检测图像时,再检测图像上又会出现一个模型,整个画面中会有两个模型

为解决这一问题,我开始探究,我在场景管理窗口再添加了一个树枝模型,果然运行的画面中又多了一支树枝,所以放在场景窗口下的模型都会再程序运行后立马在画面中生效,为此我将Earth作为预制体放在Prefabs文件夹下,再把场景管理窗口下的模型删掉

将包含Frame子物体的Earth模型拖到Prefabs中会出现一个提示:我们选择Prefab Variant

这样运行的程序画面中只有检测到识别图才会出现地球仪模型

第三步:为Prefab添加模型贴图

在资源管理面板的“materials”文件夹中,新建一个材质并命名为“Mat_Model”,Shader属性选择“Mobile-》Diffuse”,这时模型贴图为空,默认是白色,把这个材质设置在Earth和Frame模型上,然后我们通过脚本来实现换色

在Scripts文件夹下创建一个名为Change_T的C#脚本,代码如下(核心代码为一行)

usingSystem.Collections;

usingSystem.Collections.Generic;

usingUnityEngine;

 

publicclassChange_T : MonoBehaviour {

 

   publicGameObjectEarth;

   //申请GameObject类型的变量 储存地球模型

 

   publicTextureCard_01;

   //申请Texture类型的变量  储存Card_01图片

 

    // Use this for initialization

    voidStart () {

       Earth.GetComponent<Renderer>().material.mainTexture=Card_01;

       //将地球模型材质的主贴图替换为Card_01

    }

   

    // Update is called once per frame

    voidUpdate () {

       

    }

}

 

第四步:挂载脚本

将新创建的脚本Change_T添加到AR Session Origin上,可以看到其中有两个属性Earth和Card_01,正是我们刚刚在代码中声明的两个变量

故Earth属性中拖入名为Earth Variant的模型,Card_01中拖入Card_01的纹理图

这样就完成了识别图追踪检测带有纹理的地球仪

遗存问题:跑出来的demo地球仪模型太小,如何调大?

第五步:使用按钮替换贴图

按钮属于UI元素,在场景管理面板(Hierarchy)下创建一个Button,命名为ChangeBtn

打开之前的Change_T脚本,新一个新的公有函数Button_T,将替换贴图的核心代码写在这个公有函数中

 

usingSystem.Collections;

usingSystem.Collections.Generic;

usingUnityEngine;

 

publicclassChange_T : MonoBehaviour

{

 

    publicGameObjectEarth;

    //申请GameObject类型的变量 储存地球模型

 

    publicTextureCard_01;

    //申请Texture类型的变量  储存Card_01图片

 

    // Use this for initialization

    voidStart()

    {

       

    }

 

    // Update is called once per frame

    voidUpdate()

    {

 

    }

 

    //换贴图的按钮函数

    publicvoidButton_T()

   {

        Earth.GetComponent<Renderer>().sharedMaterial.mainTexture=Card_01;

        //将地球模型材质的主贴图替换为Card_01

    }

}

 

为按钮的点击事件添加这个函数,实现监听响应

点击这个按钮出现响应效果,地球仪初始是白色的,响应后出现纹路

效果展示:https://www.bilibili.com/video/BV1B3411Y7Lz?spm_id_from=333.999.0.0

第六步:2D图像截屏检测追踪

打开Change_T脚本,更改里面的内容

usingSystem.Collections;

usingSystem.Collections.Generic;

usingUnityEngine;

 

publicclassChange_T : MonoBehaviour {

 

   publicGameObjectEarth;

   //申请GameObject类型的变量 储存地球模型

 

   publicTextureCard_01;

   //申请Texture类型的变量  储存Card_01图片

 

   publicMaterialMat_Model;

 

   // Use this for initialization

   voidStart () {

       

    }

   

    // Update is called once per frame

    voidUpdate () {

       

    }

 

   //换贴图的按钮函数

   publicvoidButton_T() {

 

       Texture2DTe=newTexture2D(Screen.width, Screen.height, TextureFormat.RGB24, false);

       //申请Texture2D类型的变量宽高为(Screen.width, Screen.height)

       //颜色模式为TextureFormat.RGB24

       //不适用mipmap

 

       Te.ReadPixels(newRect(0, 0, Screen.width, Screen.height), 0, 0);

       //用Texture2D类型的变量Te来读取屏幕像素

       //读取的起始点为屏幕的(0,0)点,读取的宽高为屏幕的宽高

       //将读取到的屏幕图像从Te的(0,0)点开始填充

 

       Te.Apply();

       //执行对Texture2D的操作

 

       Earth.GetComponent<Renderer>().sharedMaterial.mainTexture=Te;

       //将地球模型材质的主贴图替换为Card_01

   

   }

 

}

 

点击按钮获取屏幕截图,作为材质的贴图,赋给地球模型

效果展示:https://www.bilibili.com/video/BV1ma41127WB?spm_id_from=333.999.0.0

由视频可见获取的截图会整块的贴在地球仪上,不能达到预期效果

存疑:Renderer.materialRenderer.sharedMaterial的区别

笔记中提供了三段代码,第四步中的代码Earth.GetComponent<Renderer>().material.mainTexture = Card_01;与第五步,第六步中的代码 Earth.GetComponent<Renderer>().sharedMaterial.mainTexture = Te;有差异,笔者没能弄懂Renderer.materialRenderer.sharedMaterial的区别,之所以更换成Renderer.sharedMaterial是因为,使用Renderer.material一直报错,始终没能找到原因,暂作记录,日后复盘。

NotallowedtoaccessRenderer.materialonprefabobject. UseRenderer.sharedMaterialinstead

UnityEngine.Renderer:get_material ()

Change_T:Button_T () (atAssets/Scripts/Change_T.cs:45)

UnityEngine.EventSystems.EventSystem:Update () (atLibrary/PackageCache/com.unity.ugui@1.0.0/Runtime/EventSystem/EventSystem.cs:385)

 

相关文章
|
13天前
|
数据可视化 vr&ar C#
|
17天前
|
图形学
【制作100个unity游戏之29】使用unity复刻经典游戏《愤怒的小鸟》(完结,附带项目源码)(上)
【制作100个unity游戏之29】使用unity复刻经典游戏《愤怒的小鸟》(完结,附带项目源码)
27 2
|
17天前
|
图形学
【推荐100个unity插件之19】武器拖尾特效插件——Pocket RPG Weapon Trails(2d 3d通用)
【推荐100个unity插件之19】武器拖尾特效插件——Pocket RPG Weapon Trails(2d 3d通用)
15 0
|
17天前
|
图形学
【制作100个unity游戏之29】使用unity复刻经典游戏《愤怒的小鸟》(完结,附带项目源码)(下)
【制作100个unity游戏之29】使用unity复刻经典游戏《愤怒的小鸟》(完结,附带项目源码)(下)
22 0
|
17天前
|
存储 JSON 关系型数据库
【制作100个unity游戏之27】使用unity复刻经典游戏《植物大战僵尸》,制作属于自己的植物大战僵尸随机版和杂交版13(完结,附带项目源码)
【制作100个unity游戏之27】使用unity复刻经典游戏《植物大战僵尸》,制作属于自己的植物大战僵尸随机版和杂交版13(完结,附带项目源码)
24 0
|
17天前
|
图形学
【制作100个unity游戏之27】使用unity复刻经典游戏《植物大战僵尸》,制作属于自己的植物大战僵尸随机版和杂交版12(附带项目源码)
【制作100个unity游戏之27】使用unity复刻经典游戏《植物大战僵尸》,制作属于自己的植物大战僵尸随机版和杂交版12(附带项目源码)
19 0
|
17天前
|
存储 图形学
【制作100个unity游戏之27】使用unity复刻经典游戏《植物大战僵尸》,制作属于自己的植物大战僵尸随机版和杂交版11(附带项目源码)
【制作100个unity游戏之27】使用unity复刻经典游戏《植物大战僵尸》,制作属于自己的植物大战僵尸随机版和杂交版11(附带项目源码)
15 0
|
17天前
|
图形学
【制作100个unity游戏之27】使用unity复刻经典游戏《植物大战僵尸》,制作属于自己的植物大战僵尸随机版和杂交版10(附带项目源码)
【制作100个unity游戏之27】使用unity复刻经典游戏《植物大战僵尸》,制作属于自己的植物大战僵尸随机版和杂交版10(附带项目源码)
14 0
|
17天前
|
图形学
【制作100个unity游戏之27】使用unity复刻经典游戏《植物大战僵尸》,制作属于自己的植物大战僵尸随机版和杂交版3(附带项目源码)
【制作100个unity游戏之27】使用unity复刻经典游戏《植物大战僵尸》,制作属于自己的植物大战僵尸随机版和杂交版3(附带项目源码)
25 2
|
17天前
|
图形学
【制作100个unity游戏之28】花半天时间用unity复刻童年4399经典小游戏《黄金矿工》(附带项目源码)
【制作100个unity游戏之28】花半天时间用unity复刻童年4399经典小游戏《黄金矿工》(附带项目源码)
33 0