O(∩_∩)O哈哈~大家好,这是本菜鸡的第一篇分享,主要介绍如何还原类似崩坏3主界面的陀螺仪旋屏效果。以下实现仅基于个人的分析理解,难度挺低的,大佬们凑合看看就好啦,写的不好的地方欢迎指正哈~
需求分析
崩坏3的主界面陀螺仪效果具备以下两个特点:
1、当用户转动手机的时候,摄像机的视角会朝指定的方向旋转。
2、摄像机的视角旋转速度和回复速度的大小与用户转动手机的速度大小成正比。
设计实现
首先了解下Unity中提供的陀螺仪相关信息。如下图所示,陀螺仪的坐标轴是右手坐标系与unity的左手坐标系不同,在使用时需要注意!
手机平放,x轴为右手边,y轴为正前方,z轴为正上方。
图1 陀螺仪坐标轴陀螺仪主要参数详解:
Input.gyro.enabled:bool类型,返回陀螺仪的启用状态。
Input.gyro.attitude:Vector3类型,返回手机当前的姿态信息,即与手机初始姿态相比在x、y、z轴上的偏离情况(单位:弧度),初始姿态指的是手机水平正向放置(此时Input.gyro.attitude为(0,0,0))。
Input.gyro.rotationRate:Vector3类型,返回陀螺仪测量的各轴上的旋转速率的原始值,单位为“弧度/秒”。
Input.gyro.rotationRateUnbiased:Vector3类型,返回陀螺仪测量的各轴上的旋转速率的修正值,单位为“弧度/秒”。
Input.gyro.updateInterval:float类型,返回陀螺仪参数的更新间隔,单位:秒。
Input.gyro.gravity:Vector3类型,返回陀螺仪测量的重力加速度向量。
Input.gyro.userAcceleration:Vector3类型,返回设备的加速度向量。
注意:在手机的Portrait(竖屏)和Landscape(横屏)模式下,陀螺仪的坐标轴并不一致,如果需要的话需要相应变换。
了解陀螺仪相关参数的作用后,我们开始分析如何实现需求。首先,只有当用户转动手机的时候,摄像机的视角才会相应变化,说明摄像机的变化跟手机的当前姿态无关。这意味着我们的输入应该是陀螺仪测量的旋转速率(rotationRate)而非手机的当前姿态(attitude)信息。由于rotationRateUnbiased是在rotationRate的基础上进行修正,测量结果更加准确,我们使用该属性控制摄像机视角的旋转。
我们所说的摄像机视角的旋转,实际上是摄像机基于自身坐标轴根据陀螺仪的rotationRateUnbiased参数进行旋转。结合图1各轴的方向分析可知,手机横屏放置时,陀螺仪的x、y轴和摄像机自身的x、y轴的正方向是吻合的(z轴正方向相反)。我们仅需要在x、y轴方向上旋转摄像机,陀螺仪z轴上的旋转变化不应对摄像机产生影响。
我们可通过在Update方法里执行以下语句控制摄像机的旋转。
transform.Rotate(vertRotateRate, horiRotateRate, 0);
其中,vertRotateRate和horiRotateRate分别表示陀螺仪在垂直(绕x轴)方向和水平(绕y轴)方向上的旋转速率:
vertRotateRate = Input.gyro.rotationRateUnbiased.x;
horiRotateRate = Input.gyro.rotationRateUnbiased.y;
为了防止旋转速率过大,导致摄像机瞬间旋转较大角度从而影响表现的问题,我们需要通过以下语句限制旋转速率的大小:
vertRotateRate = Mathf.Sign(vertRotateRate) * Mathf.Clamp(Mathf.Abs(vertRotateRate), 0, maxRotateRate);
horiRotateRate = Mathf.Sign(horiRotateRate) * Mathf.Clamp(Mathf.Abs(horiRotateRate), 0, maxRotateRate);
其中,maxRotateRate是我们设定的最大旋转速率,其值可设为Mathf.PI,即最大为π rad / s。
实现摄像机的旋转后,还要考虑如何在旋转结束后让其回复至初始旋转状态,并且使得回复速率与陀螺仪输入的旋转速率成正比,即"转得越快,回得越快"。为了实现摄像机得回复功能,我们需要用一个变量initRotation(Quaternion类型)记录摄像机的初始旋转状态。因此,我们可以通过在Update里面对相机的当前rotation到initRotation进行插值以实现回复效果,实现如下:
transform.localRotation = Quaternion.Slerp(transform.localRotation, initRotation, restoreRate + restoreRate * factor);
其中,restoreRate是一个可设定的默认值,建议取值在0.05左右,factor是一个缩放因子,跟vertRotateRate 及horiRotateRate 相关,其值为vertRotateRate 和horiRotateRate 中绝对值较大者和maxRotateRate的比值(factor的值在[0,1]之间)。通过restoreRate和factor构建的简单线性关系,可以实现回复速率与旋转速率成正比。factor的计算如下:
factor = Mathf.Max(Mathf.Abs(vertRotateRate), Mathf.Abs(horiRotateRate)) / maxRotateRate;
需要注意的是,我们使用transform.localRotation旋转摄像机,如果你的项目中摄像机没有父对象,请改为transform.rotation。
好了,讲到这里,我们的实现逻辑已经很清晰了,其实超级简单对不对,但效果还是可以的。值得再提的一点是,我们可以设置两个缩放因子vertRotateRateScale、horiRotateRateScale来分别控制摄像机垂直、水平方向上旋转速率的大小(使得两个方向上的旋转速率差异化),以增强灵活性。
最后,放出我们最终的实现代码,毕竟目前水平有限,如果您有好的建议或优化方案,还请不吝赐教哈O(∩_∩)O~感谢!
public class CameraGyroController : MonoBehaviour
{
public Vector3 initEuler = Vector3.zero; //初始旋转对应欧拉角
private Quaternion initRotation = Quaternion.identity; //初始旋转信息
private Vector3 lastInitEuler = Vector3.zero; //用于判断初始欧拉角是否变化
public float vertRotateRateScale = 0f; //垂直陀螺仪旋转速率缩放系数
public float horiRotateRateScale = 0f; //水平陀螺仪旋转速率缩放系数
public float restoreRate = 0f; //回复速率
private float maxRotateRate = Mathf.PI; //陀螺仪单轴最大旋转速率
private float factor = 0f; //陀螺仪旋转速率和回复速率间的关联系数(旋转速率越大回复越快)
private float vertRotateRate = 0f; //垂直方向旋转速率
private float horiRotateRate = 0f; //水平方向旋转速率
void Init()
{
initRotation = transform.localRotation;
initEuler = initRotation.eulerAngles;
lastInitEuler = initEuler;
Input.gyro.enabled = true;
}
/// <summary>
/// 根据陀螺仪控制主界面mainCamera的旋转
/// </summary>
void CameraRotateControl()
{
if (!Input.gyro.enabled)
{
return;
}
//如果初始旋转角度发生变化,则更新
if (lastInitEuler != initEuler)
{
initRotation = Quaternion.Euler(initEuler);
lastInitEuler = initEuler;
}
vertRotateRate = Input.gyro.rotationRateUnbiased.x;
vertRotateRate = Mathf.Sign(vertRotateRate) * Mathf.Clamp(Mathf.Abs(vertRotateRate), 0, maxRotateRate);
horiRotateRate = Input.gyro.rotationRateUnbiased.y;
horiRotateRate = Mathf.Sign(horiRotateRate) * Mathf.Clamp(Mathf.Abs(horiRotateRate), 0, maxRotateRate);
factor = Mathf.Max(Mathf.Abs(vertRotateRate), Mathf.Abs(horiRotateRate)) / maxRotateRate;
//z轴不旋转
transform.Rotate(vertRotateRateScale * vertRotateRate, horiRotateRateScale * horiRotateRate, 0);
//逐帧往初始位置回复
transform.localRotation = Quaternion.Slerp(transform.localRotation, initRotation, restoreRate + restoreRate * factor);
}
// Use this for initialization
void Start()
{
Init();
}
// Update is called once per fram
void Update()
{
CameraRotateControl();
}
void OnGUI()
{
GUILayout.Label("rotation rate unbiased:" + Input.gyro.rotationRateUnbiased);
vertRotateRateScale = GUI.HorizontalSlider(new Rect(75, 400, 200, 40), vertRotateRateScale, 0f, 1f);
GUI.Label(new Rect(300, 395, 200, 40), "Vert Rotate Rate:" + vertRotateRateScale);
horiRotateRateScale = GUI.HorizontalSlider(new Rect(75, 475, 200, 40), horiRotateRateScale, 0f, 1f);
GUI.Label(new Rect(300, 470, 200, 40), "Hori Rotate Rate:" + horiRotateRateScale);
restoreRate = GUI.HorizontalSlider(new Rect(75, 550, 200, 40), restoreRate, 0f, 0.2f);
GUI.Label(new Rect(300, 545, 200, 40), "Restore Rate:" + restoreRate);
}
}
网友评论