Flash Stage3D 在2D UI 界面上显示3D模型问题完美解决

  一直以来很多Stage3D开发者都在为3D模型在2DUI上显示的问题头疼。Stage3D一直是在 Stage2D下面。为了做到3D模型在2DUI上显示通常大家有几种实现方式,下面来说说这几种实现方式吧。

实现方式1:

  在2DUI上挖个洞透过去显示3D层。这种做法的缺陷在于如果两个UI界面同时打开就会UI错层显示错乱。为了解决这问题很多程序员选择了当挖洞显示3D的UI打时把其他界面隐藏掉,用户体验超差。

实现方式2:

  利用Context3D 的 drawToBitmapData API 实时将3D层渲染的物价绘制到BitmapData上。然后再添加到2DUI上。这种做法的缺陷在于每次drawToBitmapData函数。每次从显卡draw图然后再回传回来的开销非常大,会导致帧频下降。而每次draw图会产生大量的内存。有人可能会说我draw图的时候 按时间间隔去draw,减少一部分开销。其实都一样画面不流畅。

实现方式3:

  把3D模型渲染成序列帧位图。再实现一个位图播放器在2DUI上显示。这样做法会导致所需要加载的位图量非常大,内存大小就可想而知了。

好吧以上都是我们的常用做法。实在恶心,很多程序员会选择使用第3方提供的 3DUI 例如 starling等来实现。没错这是最终的解决方案,但是头疼的问题又来了坐标转换是个麻烦的问题。再一个就是 starling 对于AS3程序员来说用起来总不是那么得心应手。怎么办....怎么办....痛苦纠结针扎中。

  朋友如果你还在为以上这些问题头疼、纠结、针扎中那么下面我向你推荐下另一种几乎可以解决以上你所担心的任何问题。老规矩先上图吧。

怎么样呢?是否感觉很赞呢?

  话说有一天在开晨会的时候同事和我说他想到一个方式可以解决UI互斥的问题。抱着半信半疑的心里我看了下他的实现方式。下面我就来说说吧

  其实原理还是前面说到过的 实现方式1 只是在这个做法上做了些优化。大家都知道as3中的 Graphics 画一个矩形在同一个地方画两次就会挖个洞出来。首先检查到带有3D模型的UI 面板是否和其他UI重叠。如果重叠则把最上层的UI保留,下层的UI画空。这样就可以解决了。但是问题又来了一个带3D模型的UI 和一个普通2DUI 显示没问题了。那么两个带3D模型的UI 叠在一起就可以看到另一个UI上的模型跑到这个UI上来了。 原因是模型都是渲染在同一个Context3D上一旦画空了就全显示出来了。为了解决这个问题我们得改下3D引擎的渲染方式了。首先把要再UI上显示的3D元素都做一个标间,以便与在引擎底层用来区分渲染。

当检查到标记的时候先调用下 Context3D清理一次深度

  context.clear(0, 0, 0, 1, 1, 0, Context3DClearMask.DEPTH);

好了 下面我们来整理下我们渲染在2D界面上的3D物件的渲染顺序:

灯光--> 网格(作为背景底板)---> 3D模型

好了顺序清楚了流程,现在开始渲染。

灯光就无视了。只要你调好坐标能照到你的模型即可,无需做特殊处理。重点来了,在渲染背景底板的时候,我们再调用一次context.clear(0, 0, 0, 1, 1, 0, Context3DClearMask.DEPTH);再渲染。

清理深度这个主要是用来控制不让下层的3D物件因深度问题而透到前面来。好了底板已经渲染OK了现在再来重复一次渲染底板的方式再渲染一次模型吧。好了现在看上去还好一切正常现在多创建几个叠加试试

OK 大功告成一切正常。最后还是声明下如果有条件的朋友还是建议自己写3DUI 来做。不会写的也没关系可以考虑用 starling 或第3方的一些类库来实现。

时间: 2024-10-12 11:59:28

Flash Stage3D 在2D UI 界面上显示3D模型问题完美解决的相关文章

Android手势识别 Camera 预览界面上显示文字 布局注意事项(merge布局)

通常在Surfaceview作为预览视频帧的载体,有时需在上面显示提示文字.以前我弄的都好好的,今天忽然发现叠加的TextView不管咋弄都出不来文字了,跟Surfaceview一起放在FrameLayout也不行,后来想到merge布局,发现也不行.大爷的,奇了怪了,最后发现了原因,原来是顺序问题.也即无论是在RelativeLayout里还是merge布局里,View是逐个叠加上去的,一层一层铺上去的.如果你先放TextView在最前面,那肯定被后面的全屏Surfaceview覆盖了.用常规

Qt 3D研究(三):显示3D模型

Qt 3D研究(三):显示3D模型 上一篇文章介绍了如何使用最少的代码创建一个Qt 3D的应用.和大家最初接触的glut一样,对于3D应用来说,需要做的准备工作还真不少,不过呢,Qt 3D把一些窗口相关的琐碎事情解决了,剩下的,该由我们完成重要的渲染部分了,可以说,带来了某种程度的方便. 蒋彩阳原创文章,首发地址:http://blog.csdn.net/gamesdev/article/details/43964499.欢迎同行前来探讨. 我们接下来要使用Qt 3D将一个模型显示出来.Qt 3

第一个iOS的程序,在界面上显示“Hello World”

1.如何新建一个工程 iOS->Single View Application->工程名.保存位置 2.运行App 点击三角符号或使用快捷键(Command + R) 快捷键:Command+B 只是编译,不是运行 3.工程的文件组成 4.应用程序是如何运行起来的? 1)main方法 int main(int argc, char* argv[])               {              @autoreleasepool {             return UIAppl

Mask裁切UI粒子特效或者3D模型

刚好前几天有人问我这个问题,再加上新项目也可能用,所以这两天就研究了一下.其实如果粒子特效 和3D模型 都用RenderTexture来做的话就不会有裁切的问题,但是粒子特效用RenderTexture来做会有显示的问题,所以还是得用摄像机.废话不多说了,进入正题. 原理就是把Mask的裁切区域传给粒子特效Shader,当超出这个区域那么直接让它完全透明即可.粒子特效的源生shader大家可以去unity官网下载,我在这里把需要修改的地方标注给大家. //add 注释中的内容就是我做修改的地方.

将.stl文件转化为.dae并动态加载到SceneKit显示(ios中显示3d模型)

ios8之后苹果推出了一个3D模型渲染框架.SceneKit.但是国内针对这方面的教程并不是很多.前两天搞了一下也是一头雾水,终于把最基础的内容搞明白了之后,写下这篇随笔作为cnblogs的开篇,希望能一直写下去. SceneKit现在可以支持有限的几种模型,截止到我写这篇文章为止似乎只有.dae和.abc后一种模型我没有使用过.这篇文章只针对.dae模型写. 首先如果是希望加载一个已有的,不需要程序在运行的时候动态添加的dae模型.那么我们可以直接新建一个game类型的工程.在选项中选择Sce

egret中通过判断不同的类型来使同一个UI面板上显示不同的效果

点击不同按钮弹出同一个面板上的不同效果,通过传入类型来判断: this.btnRight.addEventListener(egret.TouchEvent.TOUCH_TAP,this.onUpgradeforgift,this); this.btnLeft.addEventListener(egret.TouchEvent.TOUCH_TAP,this.onPayforgift,this); private onUpgradeforgift(evt:egret.TouchEvent){ ma

关于UI界面上的坐标

CGRect是一个结构体,包含CGPoint origin 和 CGSize size origin 表示的是frame的前两个参数 x,y,表示的是起始点的坐标 size表示的是自身的尺寸,长和宽

Unity3D物体在UI界面的显示同时控制模型旋转

using System.Collections; using System.Collections.Generic; using UnityEngine; public class ChinarSmoothUi3DCamera : MonoBehaviour { public Transform point; private Vector3 Tras = Vector3.zero; public float distance = 10.0f; public float minDistance

通过windowmanager在camera界面上显示内容

https://www.baidu.com/s?ie=UTF-8&wd=%E9%80%9A%E8%BF%87windowmanager%E5%9C%A8camera%E7%95%8C%E9%9D%A2%E4%B8%8A%E6%98%BE%E7%A4%BA%E5%86%85%E5%AE%B9 https://bbs.csdn.net/topics/391990009?page=1 WM.addView exception: Unable to add window -- token null is