AR--alpha通道视频

发表于2015-08-10
评论0 1.4k浏览

想免费获取内部独家PPT资料库?观看行业大牛直播?点击加入腾讯游戏学院游戏程序行业精英群

711501594
这里使用两种方式使视频有实现透明通道,其中使用插件的这种方法不能发布到ios平台
使用shader的方式要方便一点
////////////////////////////////////////////////////////////////////////
Dora
20150727
//////////////////////////////////////////////////////////////////////
首先先把场景里面必要的东西先搬进来,
1.插件VideoPlayback-4-2-3.unitypackage,就是官网上做视频的那个范例包(我们之后懂原理了就自己做,不要老用插件包,这样发布出来的档案太大了)
2.插件mobile movie texture.unitypackage,这个是用来做alpha通道的插件
下载地址:链接:http://pan.baidu.com/s/1c034kFI 密码:bpag
3.删掉场景里面的main camera
4.添加插件a.unitypackage(vuforia官网我上传的图片后下载的database的数据)
5.添加ARCamera
6.添加image target
7.添加video作为image target的子物件,并命名为videoSmall
8.给ARCamera添加license key,添加videoPlaybackContorl的脚本,设定load data set a启用,下面的activa也启用
9.给image targetdata setaimage targetbaoma,下面添加脚本TrackableEventHandler
以上这些是在video playback的文档里面都有图文解说,这里就不一一详细图解了
接下来,首先我们来解决通道的问题
首先我们先创建一个空的物件,就是那个GameObject,当然我们这里已经在空物件下面添加了一些奇怪的东西,我们先不要去管它,先添加空物件就好了
然后再添加一个plane,这个plane是用来做遮罩用的,所以我们给它添加一个材质球到它的属性面板。这个材质球专门过滤蓝膜的背景通道的视频(这个解释不够专业,等一下上图,就了解了)
上面这个是将mobile movie texture这个插件里面已经做好的材质球给我们的plane,下面是拥有蓝色背景的视频,当我们的plane拥有了这个材质球之后,就能当做一个遮罩板来过滤我们的蓝色。
将我们的plane拖给空物件作为子物件,然后调整plane的大小,这个大小取决于你的视频想要显示多大,像我的视频想要刚好完全覆盖在图片上,所以X20Z16
再创建一个空物件,命名为MobileMovieTexture,并将MMTmobile movie texture)插件里的MobileMovieTexture.cs脚本拖拽给该物件。
将视频的路径添加到path里面,path下面还有一个参数叫absolute path,打上勾勾代表这是绝对路径,我们暂时不需要。另外MMT插件下面使用视频的话必须使用ogg格式的,并且视频要放在StreamingAssets文件夹下面。
这个脚本下面有很多其他的参数,可以控制循环,可以让视频播完后停留在最后一帧,等等...具体的功能可以看看下面的单词就明白了。所以这个插件虽然会导致发布成apk的时候导致安装包比较大,但是在某些方面还是挺让人省心的。
另外,其实MMT插件的使用方法,在这个资源包下面有一个instructions的文档有详细的讲解,只不过都是英文的,看完就基本上会用了。这个文档在下面这个地方:

好了我们继续
将材质球MovieChromaKey拖给MobileMovieTexture这个脚本里相应填材质的地方,这样plane上的滤镜就能和这个脚本上的movie相结合了
接下来,我们再添加一个空物件命名为audio,并添加组件audio source,将想添加的音效添加在这个组件上面,因为ogg格式的视频会导致声音播放不出来(是在用这个插件的时候,单独播放还是可以播放的出来的)。将audio source下面的play on awake的钩钩取消掉,否则会在打开该软件的时候就会播放声音,这不是我们想要看到的,我们希望在扫描后才有声音,另外将下面的loop的钩钩打开,因为我们的视频就是循环播放的。然后,再将audio这个物件作为GameObject的子物件。如下图:
再添加一个C#脚本来控制我们的声音
该脚本如下所示:
using UnityEngine;
using System.Collections;
using Vuforia;
public class mp3Play : MonoBehaviour, ITrackableEventHandler
{
        public AudioSource music;        
        public float musicVolume;        
        TrackableBehaviour trackableBehaviour;//跟踪状态的
        void Start() {
                trackableBehaviour = GetComponent<ImageTargetBehaviour>();//跟踪图片
                trackableBehaviour.RegisterTrackableEventHandler(this);
                musicVolume = 0.5F;        
                if (!music.isPlaying){
                         
                        music.Play();
                }
        }
        public void OnTrackableStateChanged(TrackableBehaviour.Status previousStatus, TrackableBehaviour.Status newStatus)
        {
                if (newStatus == TrackableBehaviour.Status.DETECTED ||
                    newStatus == TrackableBehaviour.Status.TRACKED ||
                    newStatus == TrackableBehaviour.Status.EXTENDED_TRACKED)
                {
                        OnTrackingFound();
                }
                else
                {
                        OnTrackingLost();
                }
        }
        void OnTrackingFound()
        {
                music.mute = false;//mute静音
        }
        void OnTrackingLost()
        {
                music.mute = true;
        }
}
将以上脚本给image target.audio拖给mp3Play这个脚本下的music,将整个GameObject拖给image target做为子物件。
这个时候发布出来,大概都已经实现了,只是我们的视频是翻转的,所以需要将plane反过来,movie的展示都是通过这个planeplane的原理就相当于一个荧幕
调整了planeY轴的旋转
这个时候看到我的planescale有变小,是因为我偷偷把GameObjectscale有变大,所以这边就可以调小了。
--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
以上是使用MMT插件做出来的透明通道。接下来我们使用shader做透明通道。
首先我们将GameObject隐藏了,还有video下面的icon也隐藏了,隐藏具体如下
选择icon,然后在属性面板将它前面的钩钩取消掉
接着选择video,在path里面填我们视频的路径,我这里的视频已经转换为MP4的格式了,全称为hecheng.mp4,放在左边如下图所示的位置
将下面的auto play打开,这样扫描图片就会自动播放影片了。下面还有一些touch play什么的先不用管,这是我自己添加的。
在下面有个keyframe texture是显示我们画面播放第一帧的,如果不选择跟我们扫描的图片一样的图的话,可能会出现轻微的闪动,当然也只有第一次扫的时候,会抖动一下而已。在如下图的地方选择:
选择图片后,在它的下面有一个材质球可以选着shader的,选择的地方如下图所示:
图一为选着的地方,图二为选着的shader
当然,这个shader是我加载进来的,是已经写好的shader,下载地址如下
链接:http://pan.baidu.com/s/1qWBnoCW 密码:on2z
再调整你需要滤镜的颜色
下面还有两个功能,第一个的大概意思是基本的敏感度吧,太敏感了会把我们想要的保留的颜色也去掉,所以这个参数值不要太高,下面第二个大概是平滑度的意思,这个可以稍微高一点,避免画面噪点太高,太锐利。
以上是透明通道的部分,如果颜色有误或者奇怪什么的,可以调整滤镜的颜色。另外使用shader就没有声音的问题了,MP4格式的视频可以直接播放声音。


原文链接

著作权归作者所有,商业转载请联系作者获得授权,非商业转载请注明出处。

如社区发表内容存在侵权行为,您可以点击这里查看侵权投诉指引

游戏学院公众号二维码
腾讯游戏学院
微信公众号

提供更专业的游戏知识学习平台