学习记录:Unity点击屏幕生成随机UI花朵

1 效果展示

 点击屏幕的位置生成花朵,生成的花朵等5秒后自动销毁。

2 代码展示

1 生成花朵的代码

using System.Collections;
using System.Collections.Generic;
using UnityEngine;
/// <summary>
/// 鼠标点击生成花朵
/// </summary>
public class ShowFlower : MonoBehaviour
{

    [SerializeField]Canvas canvas;
    [SerializeField]List <GameObject> panel = new List<GameObject>(); //要改变位置的UI
    RectTransform canvasRect;

    void Start()
    {
        canvasRect = canvas.GetComponent<RectTransform>();
    }
    //在点击位置实时生成花朵
    void Update()
    {
        if (Input.GetMouseButtonDown(0))
        {
            Vector2 outVec;
            if (RectTransformUtility.ScreenPointToLocalPointInRectangle(canvasRect, Input.mousePosition, null, out outVec))
            {
                //随机生成花朵
                int i = Random.Range(0, panel.Count);
                panel[i].GetComponent<RectTransform>().anchoredPosition = outVec;
                Instantiate(panel[i], gameObject.transform);
                
            }
        }
    }

  
   

}

将这个代码挂在一个空物体上,然后将Canvas面板和花朵的预制体拖进里面

2 销毁花朵的代码

using System.Collections;
using System.Collections.Generic;
using UnityEngine;
/// <summary>
/// 鼠标点击生成花朵
/// </summary>
public class ShowFlower : MonoBehaviour
{

    [SerializeField]Canvas canvas;
    [SerializeField]List <GameObject> panel = new List<GameObject>(); //要改变位置的UI
    RectTransform canvasRect;

    void Start()
    {
        canvasRect = canvas.GetComponent<RectTransform>();
    }
    //在点击位置实时生成花朵
    void Update()
    {
        if (Input.GetMouseButtonDown(0))
        {
            Vector2 outVec;
            if (RectTransformUtility.ScreenPointToLocalPointInRectangle(canvasRect, Input.mousePosition, null, out outVec))
            {
                int i = Random.Range(0, panel.Count);
                panel[i].GetComponent<RectTransform>().anchoredPosition = outVec;
                Instantiate(panel[i], gameObject.transform);
                
            }
        }
    }

  
   

}

这个代码挂载在每个花朵上,那个销毁时间开放出来了,可以自己修改

3 Unity界面

 每个预制体是不同的花朵,每个花都有他的精灵动画,所有的预制体上都挂载花朵销毁的代码。

4 花朵动画

 将花开的每个步骤,都存为一张图片,选中花的那张图片,按Ctrl+6生成Animation,将所有的图片选中,拖入Animation,调整时间,就可以生成开花动画了。

5 花朵图片的处理

百度搜索花开的gif图片,将图片下载完成后,拖入PS ,将生成的所有图片全部导出,再用WPS 的批量处理图片,扣除背景,在拖入Unity的文件夹中

猜你喜欢

转载自blog.csdn.net/shijinlinaaa/article/details/125619963