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

 更新时间:2022年03月09日 16:49:40   作者:恬静的小魔龙  
Unity3D不仅仅可以开发游戏,还有非常多的开发方向。本文就将用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照片墙内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

  • C#自定义控件实现TextBox禁止粘贴的方法

    C#自定义控件实现TextBox禁止粘贴的方法

    这篇文章主要介绍了C#自定义控件实现TextBox禁止粘贴的方法,结合具体实例形式分析了C#自定义控件的创建、使用方法及TextBox禁止粘贴的实现技巧,需要的朋友可以参考下
    2017-06-06
  • c# 使用线程对串口serialPort进行收发数据(四种)

    c# 使用线程对串口serialPort进行收发数据(四种)

    本文主要介绍了c# 使用线程对串口serialPort进行收发数据,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2022-07-07
  • C#实现生成指定图片的缩略图

    C#实现生成指定图片的缩略图

    这篇文章主要为大家详细介绍了如何使用C#实现生成指定图片的缩略图,文中的示例代码讲解详细,感兴趣的小伙伴可以跟随小编一起学习一下
    2024-04-04
  • C#自定义控件添加右键菜单的方法

    C#自定义控件添加右键菜单的方法

    这篇文章主要介绍了C#自定义控件添加右键菜单的方法,本文用到control控件,专门自定义右键菜单,下面小编给大家整理下,有需要的小伙伴可以来参考下
    2015-08-08
  • C#实现销售管理系统

    C#实现销售管理系统

    这篇文章主要为大家详细介绍了C#实现销售管理系统,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2021-06-06
  • C#实现获取文件大小并进行比较

    C#实现获取文件大小并进行比较

    这篇文章主要为大家详细介绍了C#如何实现获取文件大小进行单位转换与文件大小比较功能,文中的示例代码讲解详细,感兴趣的小伙伴可以了解一下
    2023-03-03
  • 自动输出类的字段值实用代码分享

    自动输出类的字段值实用代码分享

    有点时候在测试的时候希望打印输出返回对象的各字段的值,采用下面的代码可以很方便的列出对象的各字段值
    2013-12-12
  • C#及WPF获取本机所有字体和颜色的方法

    C#及WPF获取本机所有字体和颜色的方法

    这篇文章主要介绍了C#及WPF获取本机所有字体和颜色的方法,实例分析了C#及WPF获取本机字体及颜色的相关技巧,非常简单实用,需要的朋友可以参考下
    2015-09-09
  • Unity UGUI的LayoutElement布局元素组件介绍使用示例

    Unity UGUI的LayoutElement布局元素组件介绍使用示例

    这篇文章主要为大家介绍了Unity UGUI的LayoutElement布局元素组件介绍使用示例,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2023-07-07
  • C#调用pyd的方法

    C#调用pyd的方法

    这篇文章主要介绍了C#调用pyd的方法,帮助大家在项目中实现c#代码与python代码交互,在C#中调用python,也可以在python中调用C#.
    2020-11-11

最新评论