Unity3D轮转图

1.3d轮转图就是像一个圆形,然后拖动旋转

代码如下:

把物体数量和轮转图的半径声明为一个变量,这里我们用小球做示范,创建一个预制体

using System.Collections;
using System.Collections.Generic;
using UnityEngine;

public class RotationChart : MonoBehaviour
{
    public GameObject prefeb;
    public int num;//数量
    public float r;//半径
    public float dec=5;
    float ang;//弧度
    public List<GameObject> list=new List<GameObject>();
    public List<Transform> sort=new List<Transform>();
    // Start is called before the first frame update
    void Start()
    {
        ang = 2 * Mathf.PI / num;
        for (int i = 0; i < num; i++)
        {
            //计算顶点
            float x=Mathf.Sin(ang*i)*r;
            float z=Mathf.Cos(ang*i)*r;
            GameObject sphere = Instantiate(prefeb);
            sphere.transform.parent = transform;
            sphere.transform.localPosition = new Vector3(x, 0, z);
            sphere.GetComponent<RotationItem>().rotationChart = this;
            list.Add(sphere);
            sort.Add(sphere.transform);
        }
    }

把每个物体的位置赋值

接下来把每个物体添加下一下脚本,是关于3d拖拽的坐标转换

using System.Collections;
using System.Collections.Generic;
using UnityEngine;

public class RotationItem : MonoBehaviour
{
    public RotationChart rotationChart;
    // Start is called before the first frame update
    void Start()
    {
        
    }

    // Update is called once per frame
    void Update()
    {
        
    }
    private void OnMouseDrag()
    {
        Vector3 pos=Camera.main.WorldToScreenPoint(transform.position);
        Vector3 next = Camera.main.ScreenToWorldPoint(new Vector3(Input.mousePosition.x, Input.mousePosition.y, pos.z));
        float dis=next.x-transform.position.x;
        rotationChart.OnDrag(dis);
    }
    private void OnMouseUp()
    {
        Vector3 pos = Camera.main.WorldToScreenPoint(transform.position);
        Vector3 next = Camera.main.ScreenToWorldPoint(new Vector3(Input.mousePosition.x, Input.mousePosition.y, pos.z));
        float dis = next.x - transform.position.x;
        rotationChart.Inertia(dis);
    }
}

在第一个脚本里继续写拖拽的方法,拖动后把拖动后的位置赋值给物体

float allang = 0;
    public void OnDrag(float dis)
    {
        float moveang = dis / r;
        allang -= moveang;
        for (int i = 0;i < list.Count;i++) 
        {
            float x = Mathf.Sin(ang * i+allang) * r;
            float z = Mathf.Cos(ang * i + allang) * r;
            list[i].transform.localPosition = new Vector3(x, 0, z);
        }

        
    }

接下来是一个运用dotween的缓动效果(惯性)并且区中对齐效果

public void Inertia(float dis)
    {
        float time =Mathf.Abs(dis / dec);
        DT.To((a) =>
        {
            OnDrag(a);
        },dis,0, time).OnComplete(() =>
        {
            sort.Sort((a, b) =>
            {
                if (a.position.z < b.position.z)
                {
                    return -1;
                }
                else if(a.position.z == b.position.z)
                {
                    return 0;
                }
                else
                {
                    return 1;
                }
            });

            float aligning = Mathf.Asin(sort[0].localPosition.x / r);
            float aligningtime = Mathf.Abs(aligning * r / dec);
            DT.To((a) =>
            {
                allang = a;
                for (int i = 0; i < list.Count; i++)
                {
                    float x = Mathf.Sin(ang * i + allang) * r;
                    float z = Mathf.Cos(ang * i + allang) * r;
                    list[i].transform.localPosition = new Vector3(x, 0, z);
                }
            }, allang, allang + aligning, aligningtime);

        });
        


    }

最后手写了一个简单的dotween,运用到缓动效果

using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using System;
using UnityEngine.WSA;

public class DT : MonoBehaviour
{
    public Action<float> action;
    public float begin;
    public float end;
    public float time;
    public Action complete;
    float nowtime;
    public static DT To(Action<float> action,float begin,float end,float time)
    {
        GameObject dotween = new GameObject("DT");
        DT dt= dotween.AddComponent<DT>();
        dt.action = action;
        dt.begin = begin;
        dt.end = end;
        dt.time = time;
        dt.nowtime = Time.time;
        return dt;
    }

    // Update is called once per frame
    void Update()
    {
        if (Time.time - nowtime < time)
        {
            float t = Time.time - nowtime;
            float p = t / time;
            float a = begin * (1 - p) + end * p;
            action(a);
        }
        else
        {
            action(end);
            if(complete!=null)
            {
                complete();
            }
            Destroy(gameObject);
        }
    }
    public void OnComplete(Action complete)
    {
        this.complete = complete;
    }
}

效果如下

 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
HTML和CSS可以通过使用CSS3的transform属性来实现3D轮转。下面是一个简单的实现步骤: 1. 首先,在HTML文件中创建一个容器元素,用于包裹轮转的所有元素。例如: ```html <div class="container"> <!-- 定义每个像的元素 --> <div class="image"></div> <div class="image"></div> <div class="image"></div> <!-- 可添加更多像元素 --> </div> ``` 2. 接下来,在CSS文件中设置容器元素和像元素的样式。首先,设置容器元素的样式,使其能够显示出3D效果: ```css .container { width: 300px; /* 设置容器宽度 */ height: 300px; /* 设置容器高度 */ perspective: 1000px; /* 设置透视效果,值越大离观察者越远 */ } ``` 3. 然后,设置像元素的样式,并应用3D效果: ```css .image { width: 100%; /* 设置像元素宽度 */ height: 100%; /* 设置像元素高度 */ background-image: url("路径/到/像"); /* 设置像背景 */ background-size: cover; /* 设置像背景大小,以覆盖整个像元素 */ transform-style: preserve-3d; /* 保持3D效果 */ animation: rotation 10s infinite linear; /* 设置像旋转动画,时间、循环方式可根据需求自行调整 */ } @keyframes rotation { from { transform: rotateY(0deg); /* 开始时的旋转角度 */ } to { transform: rotateY(360deg); /* 结束时的旋转角度 */ } } ``` 通过以上步骤,我们就可以实现一个简单的3D轮转。你可以根据需要调整容器元素和像元素的样式,添加更多的像元素来实现更复杂的效果。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值