Unity沉浸式/360View/全景渲染
Unity沉浸式/360View/全景渲染
啥是沉浸式
想象一下,在一个房间里,前面、后面、地面、左面、右面、天花板分别安装了铺满墙面的LED显示屏,你坐在房间里观影,是一种什么体验。如果玩游戏呢??
最近就接到了这样的小活,当然,这个房间里并不是六面都有显示器,而是只有前面、地面、左面、右面四个显示器。
现在需要把Unity里的场景,沉浸式的渲染到这4个显示器上。
Unity沉浸式/360View/全景渲染
如何实现,排坑及最终实现历程
最先想到的,就是用4个摄像机。建个空物体,底下挂4个Camera,前面的向前,左边的朝左,右边的朝右,地面的朝下,相互垂直。看起来很简单,对吧。但是,问题就出现了,画面没法对其,死活调不好摄像机的参数。手动对了半天,对不上。
4个屏幕的分辨率如下:
- 正面:3744 * 1560
- 地面:3744 * 1664
- 左面:1634 * 1872
- 右面:1648 * 1872
发现了没,这分辨率很奇葩,地面的高度居然跟侧边的高度不一样,侧边的深度跟地面的深度也不一样,我靠,这怎么能对的上呢。。
然后深入研究了一下,发现摄像机可以自定义透视矩阵。
// Unity API : Matrix4x4.Frustum
public static Matrix4x4 Frustum (float left, float right, float bottom, float top, float zNear, float zFar);
public static Matrix4x4 Frustum (FrustumPlanes fp);
这不就容易了么!!!
半小时就写了一个组件,让摄像机无视输出分辨率,直接分别调整水平和垂直的视野角度,核心的代码如下:
// horizontalFOV : 水平视野角度
// verticalFOV : 垂直视野角度float near = targetCamera.nearClipPlane;
float far = targetCamera.farClipPlane;// 计算水平和垂直方向的视锥体边界
float horizontalHalfAngle = horizontalFOV * 0.5f * Mathf.Deg2Rad;
float verticalHalfAngle = verticalFOV * 0.5f * Mathf.Deg2Rad;float right = Mathf.Tan(horizontalHalfAngle) * near;
float left = -right;
float top = Mathf.Tan(verticalHalfAngle) * near;
float bottom = -top;// 创建自定义投影矩阵
Matrix4x4 projectionMatrix = Matrix4x4.Frustum(left, right, bottom, top, near, far);
targetCamera.projectionMatrix = projectionMatrix;
当我把每个摄像机的视野参数做成可调整的,发给现场测试的哥们,他调了很久,告诉我还是对不上,主要是地面和侧面对不上。。然后认真分析了一下,主要原因是,他这个房间的地面,是倾斜的,两侧屏幕实际是个梯形。。说是为了更好的显示效果。这TM怎么能对的上。。
开始考虑怎么解决。
方案1:
两侧的摄像机,再增加一个斜压缩矩阵。
手工构造一个斜压缩矩阵,用现有的透视矩阵乘以这个矩阵,最终再赋予摄像机。然而尝试了几次,都失败了,弄出来的总是个斜切效果,可能是因为自己数学功底还是太差,对于矩阵的手工构造,一直停留在云雾状态,果断放弃。
方案2:
两边的相机不再直接输出到显示器,而是先渲染到一个RenderTexture,然后,再建一个RawImage铺满屏幕,把RenderTexture通过RawImage进行显示,这时候,就可以写一个Shader,对RawImage的UV采样进行修改:
fixed4 frag (v2f i) : SV_Target
{float s;if(_CompressRate<0)s = (1 - i.uv.x) * -_CompressRate;elses = i.uv.x * _CompressRate;i.uv.y = clamp((i.uv.y-s)/(1-s), 0, 1);return tex2D(_MainTex, i.uv);
}
新大陆
至此其实基本上已经解决了,然而,就在这个时候,又发现一个新大陆:
// Unity API : Camera.RenderToCubemap
public bool RenderToCubemap (Cubemap cubemap, int faceMask);
居然有现成的API,他可以以当前摄像机位置为视角,直接把360全景渲染到一个立方体纹理中。要是有了这个,那还要啥4个摄像机。。一个相机就够了。
于是尝试了一下。
private void Awake()
{_cubeTexture = new RenderTexture( size, size, 24 ){name = "CubeRenderTexutre",dimension = TextureDimension.Cube};
}private LateUpdate()
{_camera.RenderToCubemap(_cubeTexture);
}
然而,与想象中不一样的是,他渲染的时候,只参考相机的位置,并不会根据摄像机的朝向去渲染,而是按照世界坐标系进行渲染。也就是说,盒子里的前面始终是世界坐标系的z方向。
那么,要想把纹理从盒子里取出来,输出到屏幕上,就比较麻烦。主要是对立方体纹理的采样。经过研究,弄了一个shader出来,传入观察方向、视野角度,让他渲染到一个RawImage。
Shader "Custom/CubemapProjector" {Properties {_Cubemap ("Cubemap", Cube) = "" {}_Direction ("World Direction", Vector) = (0,0,1,0)_FovFactor ("FOV Factor", Vector) = (0.25,0.25,0,0)}SubShader {Tags { "Queue"="Transparent" "RenderType"="Transparent" }LOD 100Pass {CGPROGRAM#pragma vertex vert#pragma fragment frag#include "UnityCG.cginc"struct appdata {float4 vertex : POSITION;float2 uv : TEXCOORD0;};struct v2f {float2 uv : TEXCOORD0;float4 vertex : SV_POSITION;};samplerCUBE _Cubemap;float3 _Direction;float2 _FovFactor;v2f vert (appdata v) {v2f o;o.vertex = UnityObjectToClipPos(v.vertex);o.uv = v.uv;return o;}fixed4 frag (v2f i) : SV_Target {// 计算实际视野角度(度)float horizontalFOV = _FovFactor.x * 360.0;float verticalFOV = _FovFactor.y * 360.0;// 转换为弧度并计算tan值float tanHalfH = tan(radians(horizontalFOV) * 0.5;float tanHalfV = tan(radians(verticalFOV)) * 0.5;// 映射UV到方向平面float2 uv = (i.uv - 0.5) * 2.0; // 转换到[-1,1]uv.x *= tanHalfH;uv.y *= tanHalfV;// 创建局部坐标系float3 forward = normalize(_Direction);float3 worldUp = abs(forward.y) > 0.999 ? float3(0,0,1) : float3(0,1,0);float3 right = normalize(cross(worldUp, forward));float3 up = cross(forward, right);// 计算采样方向float3 viewDir = normalize(uv.x * right + uv.y * up + forward);// 采样立方体贴图fixed4 col = texCUBE(_Cubemap, viewDir);return col;}ENDCG}}
}
研究到这里,发现,其实这个跟四个相机也没有什么差别,因为最关键的还是视野角度和观察方向,这俩个要素是不可能脱离的,然后,Cubemap的方案就没有再继续深入研究下去了,因为经过分析,其实4相机和cubemap的渲染方法各有优劣,在性能上,也相差不大。
这个项目目前还没有竣工,以后最终选取哪一种给方案也还没有定论,目前来看,决定暂时还是用4相机。
记录一下项目历程,主要是以自己以后查看,如果能有幸帮助到后人,那就更好了。