基于Unity3D实现3D照片墙效果
一、前言
Unity3D不仅仅可以开发游戏,还有非常多的开发方向,秉承着兴趣为先,将可以使用Unity制作的各种应用案例,分享如何进行开发,如何实现,希望大家可以在感兴趣的地方,学习到自己想要学习的东西。
今天就来实现一个3D照片墙的效果。
我对于这个项目的构思就是照片是3D的,可以滑动,然后使用DoTween插件去做动画平滑移动。
OK,那就正式开始。
先看一下效果图:
二、正式开发
新建项目,我使用的版本是Unity3D 2019.4.7f1,模板选用3D:
(1)导入DoTween插件。
(2)新建Canvas,设置参数:
设置Canvas的坐标到0,0,0:
(3)在Canvas新建N个Image:
(4)设置Main Camera的属性:
设置完的样子:
反正就是让Image在屏幕中间就可以了。
(5)新建脚本UIRotate.cs,双击打开脚本,编辑代码:
using DG.Tweening; using UnityEngine; using UnityEngine.EventSystems; public class UIRotate : MonoBehaviour { private int halfSize; private GameObject[] gameObjects; /// <summary> /// 圆半径 /// </summary> private int r = 300; /// <summary> /// 相间角度 /// </summary> 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 < childCount; i++) { gameObjects[i] = transform.GetChild(i).gameObject; SetPosition(i); SetDeepin(i); } } /// <summary> /// 设置物体位置 /// </summary> private void SetPosition(int index) { float x = 0; float z = 0; if (index < halfSize) { int id = halfSize - index; x = r * Mathf.Sin(angle * id); z = -r * Mathf.Cos(angle * id); } else if (index > 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].GetComponent<RectTransform>().DOLocalMove(new Vector3(x, 0, z), 1); } private void SetDeepin(int index) { //计算图片深度也就是z轴的距离,离摄像机的远近 int deepin = 0; if (index < halfSize) { deepin = index; } else if (index > halfSize) { deepin = gameObjects.Length - (1 + index); } else { deepin = halfSize; } gameObjects[index].GetComponent<RectTransform>().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; /// <summary> /// 圆半径 /// </summary> private int r = 300; /// <summary> /// 相间角度 /// </summary> 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 < childCount; i++) { gameObjects[i] = transform.GetChild(i).gameObject; SetPosition(i); SetDeepin(i); } } /// <summary> /// 设置物体位置 /// </summary> private void SetPosition(int index) { float x = 0; float z = 0; if (index < halfSize) { int id = halfSize - index; x = r * Mathf.Sin(angle * id); z = -r * Mathf.Cos(angle * id); } else if (index > 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].GetComponent<RectTransform>().DOLocalMove(new Vector3(x, 0, z), 1); } private void SetDeepin(int index) { //计算图片深度也就是z轴的距离,离摄像机的远近 int deepin = 0; if (index < halfSize) { deepin = index; } else if (index > halfSize) { deepin = gameObjects.Length - (1 + index); } else { deepin = halfSize; } gameObjects[index].GetComponent<RectTransform>().SetSiblingIndex(deepin); } /// <summary> /// 向左滑动 /// </summary> public void OnLeftDrag() { var length = gameObjects.Length; for (var i = 0; i < length; i++) { var temp = gameObjects[i]; gameObjects[i] = gameObjects[length - 1]; gameObjects[length - 1] = temp; } for (var i = 0; i < length; i++) { SetPosition(i); SetDeepin(i); } } /// <summary> /// 向右滑动 /// </summary> public void OnRightDrag() { var length = gameObjects.Length; for (var i = 0; i < length-1; i++) { var temp = gameObjects[i]; gameObjects[i] = gameObjects[i+1]; gameObjects[i+1] = temp; } for (var i = 0; i < 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 < touchFirst.x) { OnLeftDrag();//向左滑动 } if (touchSecond.x > touchFirst.x) { OnRightDrag();//向右滑动 } touchFirst = touchSecond; } } }
运行程序:
(8)导入照片最后试一下:
三、总结
在Unity3D中实现了3D照片墙,虽然效果出来了,但是想要实现更加美观的效果还需要一些努力。
到此这篇关于基于Unity3D实现3D照片墙效果的文章就介绍到这了,更多相关Unity3D照片墙内容请搜索猪先飞以前的文章或继续浏览下面的相关文章希望大家以后多多支持猪先飞!
原文出处:https://blog.csdn.net/q764424567/article/details/123368231
相关文章
- 这篇文章主要为大家详细介绍了基于jQuery实现照片墙自动播放特效,具有一定的参考价值,感兴趣的小伙伴们可以参考一下...2017-01-16
- 这篇文章主要为大家详细介绍了Unity3D UGUI实现翻书特效,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下...2020-06-25
- 这篇文章主要为大家详细介绍了Unity3D使用GL实现图案解锁功能,具有一定的参考价值,感兴趣的小伙伴们可以参考一下...2020-06-25
- 这篇文章主要为大家详细介绍了Unity3D实现飞机大战游戏,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下...2020-11-03
Unity3D游戏开发数据持久化PlayerPrefs的用法详解
在本篇文章里小编给大家整理了关于Unity3D游戏开发之数据持久化PlayerPrefs的使用的相关知识点内容,需要的朋友们参考下。...2020-06-25- 这篇文章主要介绍了Unity3D基于OnGUI实时显示FPS,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下...2020-06-25
- 这篇文章主要为大家详细介绍了Unity3D仿写Button面板事件绑定功能,具有一定的参考价值,感兴趣的小伙伴们可以参考一下...2020-06-25
- 这篇文章主要为大家详细介绍了unity3D实现三维物体跟随鼠标,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下...2020-06-25
- 本文通过实例代码给大家介绍vue实现3D标签云的方法,代码简单易懂,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友参考下吧...2021-07-20
- 这个是在网上看到的,经测试可以在电脑上运行,确实调用了本地摄像头。有需要的小伙伴可以参考下。...2020-06-25
- 这篇文章主要为大家详细介绍了Unity3D Shader实现镜子效果,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下...2020-06-25
- 这篇文章主要为大家详细介绍了Unity3D实现待机状态图片循环淡入淡出,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下...2020-06-25
- 这篇文章主要为大家详细介绍了Unity3D Shader实现动态屏幕遮罩效果,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下...2020-06-25
- 这篇文章主要为大家详细介绍了Unity3D使用UGUI开发原生虚拟摇杆,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下...2020-06-25
- 这篇文章主要为大家详细介绍了Unity3D UGUI特效之Image高斯模糊效果,具有一定的参考价值,感兴趣的小伙伴们可以参考一下...2020-06-25
- 这篇文章主要为大家详细介绍了Unity3D实现物体闪烁效果,类似霓虹灯、跑马灯、LED灯效果,具有一定的参考价值,感兴趣的小伙伴们可以参考一下...2020-06-25
- 这篇文章主要介绍了javascript制作照片墙及制作过程中出现的问题,感兴趣的朋友可以参考一下...2016-04-06
原生javascript+css3编写的3D魔方动画旋扭特效
这篇文章主要介绍了原生javascript+css3编写的3D魔方动画旋扭特效的相关资料,需要的朋友可以参考下...2016-03-18- 这篇文章主要为大家详细介绍了Unity3D利用DoTween实现卡牌翻转效果,具有一定的参考价值,感兴趣的小伙伴们可以参考一下...2020-06-25
- 这篇文章主要为大家详细介绍了Unity3D实现分页系统,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下...2020-06-25