推薦閱讀

• CSDN主頁
• GitHub開源地址
• Unity3D插件分享
• 簡書地址
• 我的個人博客
• QQ群：1040082875

大家好，我是佛系工程師☆恬靜的小魔龍☆，不定時更新Unity開發技巧，覺得有用記得一鍵三連哦。

一、前言

首先，介紹一波我這個專欄：Unity3D之Unity應用案例

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照片墻，雖然效果出來了，但是想要實現更加美觀的效果還需要一些努力。

源代碼就放在CSDN吧：
https://download.csdn.net/download/q764424567/84045547

你的點贊就是對博主的支持，有問題記得留言：

博主還有跟多寶藏文章等待你的發掘哦：

專欄方向簡介

Unity3D開發小游戲	小游戲開發教程	分享一些使用Unity3D引擎開發的小游戲，分享一些制作小游戲的教程。
Unity3D從入門到進階	入門	從自學Unity中獲取靈感，總結從零開始學習Unity的路線，有C#和Unity的知識。
Unity3D之UGUI	UGUI	Unity的UI系統UGUI全解析，從UGUI的基礎控件開始講起，然后將UGUI的原理，UGUI的使用全面教學。
Unity3D之讀取數據	文件讀取	使用Unity3D讀取txt文檔、json文檔、xml文檔、csv文檔、Excel文檔。
Unity3D之數據集合	數據集合	數組集合：數組、List、字典、堆棧、鏈表等數據集合知識分享。
Unity3D之VR/AR（虛擬仿真）開發	虛擬仿真	總結博主工作常見的虛擬仿真需求進行案例講解。
Unity3D之插件	插件	主要分享在Unity開發中用到的一些插件使用方法，插件介紹等
Unity3D之日常開發	日常記錄	主要是博主日常開發中用到的，用到的方法技巧，開發思路，代碼分享等
Unity3D之日常BUG	日常記錄	記錄在使用Unity3D編輯器開發項目過程中，遇到的BUG和坑，讓后來人可以有些參考。

總結

以上是生活随笔為你收集整理的【Unity3D应用案例系列】Unity3D中实现《3D照片墙》的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。