运维开发网

基于Unity3D的3D照片墙效果的实现

运维开发网 https://www.qedev.com 2022-07-25 21:03 出处:网络
Unity3D不仅仅可以开发游戏,还有非常多的开发方向。本文就将用Unity3D制作出一个3D照片墙的效果,文中的示例代码讲解详细,感兴趣的可以了解一下 一、前言

Unity3D不仅仅可以开发游戏,还有非常多的开发方向。本文就将用Unity3D制作出一个3D照片墙的效果,文中的示例代码讲解详细,感兴趣的可以了解一下 一、前言

Unity3D不仅可以开发游戏,还可以有很多发展方向。坚持利益至上,你将能够使用Unity制作的各种应用案例,分享如何开发,如何实现。希望你能在自己感兴趣的地方学到自己想学的东西。

今天,我们将实现3D照片墙的效果。

我对这个项目的想法是,照片是3D的,可以滑动,然后用DoTween插件做动画,平滑移动。

好了,我们开始吧。

先看看效果图:

二、正式开发

新项目,我用的版本是Unity3D 2019.4.7f1,模板是3D:


(1)导入DoTween插件。

(2)创建一个新的画布并设置参数:


将画布的坐标设置为0,0,0:


(3)在画布上创建n个新图像:


(4)设置主摄像头的属性:


设置的外观:


无论如何,只要让图像在屏幕中间。

(5)新建一个脚本UIRotate.cs,双击打开脚本,编辑代码:

using DG.Tweening;using UnityEngine;using UnityEngine.EventSystems;public class UIRotate : MonoBehaviour{ private int halfSize; private GameObject[] gameObjects; /// lt;summarygt; /// 圆半径 /// lt;/summarygt; private int r = 300; /// lt;summarygt; /// 相间角度 /// lt;/summarygt; private int angle; private void Start() { //初始化数组 var childCount = transform.childCount; //计算出中点 halfSize = (childCount - 1) / 2; //求出圆内角度 angle = 360 / childCount; //初始 gameObjects = new GameObject[childCount]; for (var i = 0; i lt; childCount; i++) { gameObjects[i] = transform.GetChild(i).gameObject; SetPosition(i); SetDeepin(i); } } /// lt;summarygt; /// 设置物体位置 /// lt;/summarygt; private void SetPosition(int index) { float x = 0; float z = 0; if (index lt; halfSize) { int id = halfSize - index; x = r * Mathf.Sin(angle * id); z = -r * Mathf.Cos(angle * id); } else if (index gt; halfSize) { int id = index - halfSize; x = -r * Mathf.Sin(angle * id); z = -r * Mathf.Cos(angle * id); } else { x = 0; z = -r; } Tweener tweener = gameObjects[index].GetComponentlt;RectTransformgt;().DOLocalMove(new Vector3(x, 0, z), 1); } private void SetDeepin(int index) { //计算图片深度也就是z轴的距离,离摄像机的远近 int deepin = 0; if (index lt; halfSize) { deepin = index; } else if (index gt; halfSize) { deepin = gameObjects.Length - (1 + index); } else { deepin = halfSize; } gameObjects[index].GetComponentlt;RectTransformgt;().SetSiblingIndex(deepin); }}

(6)将UIRotate.cs脚本附加到Canvas对象并运行程序:


(7)添加左右拖动代码,继续修改UIRotate.cs代码:

using DG.Tweening;using UnityEngine;using UnityEngine.EventSystems;public class UIRotate : MonoBehaviour{ private int halfSize; private GameObject[] gameObjects; /// lt;summarygt; /// 圆半径 /// lt;/summarygt; private int r = 300; /// lt;summarygt; /// 相间角度 /// lt;/summarygt; private int angle; private void Start() { //初始化数组 var childCount = transform.childCount; //计算出中点 halfSize = (childCount - 1) / 2; //求出圆内角度 angle = 360 / childCount; //初始 gameObjects = new GameObject[childCount]; for (var i = 0; i lt; childCount; i++) { gameObjects[i] = transform.GetChild(i).gameObject; SetPosition(i); SetDeepin(i); } } /// lt;summarygt; /// 设置物体位置 /// lt;/summarygt; private void SetPosition(int index) { float x = 0; float z = 0; if (index lt; halfSize) { int id = halfSize - index; x = r * Mathf.Sin(angle * id); z = -r * Mathf.Cos(angle * id); } else if (index gt; halfSize) { int id = index - halfSize; x = -r * Mathf.Sin(angle * id); z = -r * Mathf.Cos(angle * id); } else { x = 0; z = -r; } Tweener tweener = gameObjects[index].GetComponentlt;RectTransformgt;().DOLocalMove(new Vector3(x, 0, z), 1); } private void SetDeepin(int index) { //计算图片深度也就是z轴的距离,离摄像机的远近 int deepin = 0; if (index lt; halfSize) { deepin = index; } else if (index gt; halfSize) { deepin = gameObjects.Length - (1 + index); } else { deepin = halfSize; } gameObjects[index].GetComponentlt;RectTransformgt;().SetSiblingIndex(deepin); } /// lt;summarygt; /// 向左滑动 /// lt;/summarygt; public void OnLeftDrag() { var length = gameObjects.Length; for (var i = 0; i lt; length; i++) { var temp = gameObjects[i]; gameObjects[i] = gameObjects[length - 1]; gameObjects[length - 1] = temp; } for (var i = 0; i lt; length; i++) { SetPosition(i); SetDeepin(i); } } /// lt;summarygt; /// 向右滑动 /// lt;/summarygt; public void OnRightDrag() { var length = gameObjects.Length; for (var i = 0; i lt; length-1; i++) { var temp = gameObjects[i]; gameObjects[i] = gameObjects[i+1]; gameObjects[i+1] = temp; } for (var i = 0; i lt; length; i++) { SetPosition(i); SetDeepin(i); } } private Vector2 touchFirst = Vector2.zero;//手指开始按下的位置 private Vector2 touchSecond = Vector2.zero;//手指拖动的位置 void OnGUI() { if (Event.current.type == EventType.MouseDown) { touchFirst = Event.current.mousePosition;//记录开始按下的位置 } if (Event.current.type == EventType.MouseUp) { touchSecond = Event.current.mousePosition;//记录拖动的位置 if (touchSecond.x lt; touchFirst.x) { OnLeftDrag();//向左滑动 } if (touchSecond.x gt; touchFirst.x) { OnRightDrag();//向右滑动 } touchFirst = touchSecond; } }}

运行程序:


(8)导入照片并尝试最后一次:


三、总结

在Unity3D中实现了3D照片墙。虽然效果出来了,但要达到更美的效果还需要一些努力。

关于基于Unity3D实现3D照片墙效果的文章到此结束。关于Unity3D照片墙的更多信息

0

精彩评论

暂无评论...
验证码 换一张
取 消