“I am participating in the Mid-Autumn Festival Creative Submission Contest. Please see: Mid-Autumn Festival Creative Submission Contest for details.”

Recommended reading

  • CSDN home page
  • GitHub open source address
  • Unity3D plugin sharing
  • Jane’s address book
  • My personal blog
  • QQ group: 1040082875

Hello everyone, I am a Buddhist engineer ❤️ quiet little dragon ❤️, update Unity development skills from time to time, think useful remember to like collection oh.

One, foreword

The Mid-Autumn Festival is coming. It’s time to enjoy the full moon and eat moon cakes again.

The Mid-Autumn Festival is a traditional Chinese festival. The full moon symbolizes reunion and expresses people’s longing for their hometown and loved ones.

Speaking of the Mid-Autumn Festival will have to say about the Mid-Autumn festival legend, the most famous is chang ‘e fly to the moon.

We take the goddess of the Moon as the title, make a small Demo of the goddess of the moon.

Effect:

Second, chang ‘e flew to the moon

To realize the animation of chang ‘e flying to the moon with a customized path, it is necessary to complete the drawing route first, and then chang ‘e moves along the route.

To draw a line, use GL to draw a line and then render it onto the object.

Then move using DoTween’s path move.

❤️ Step 1: Create a new project

After setting the name and path of the project, click the Create button to create a project.

❤️ Step 2: Set up a scenario

First import our background picture and Chang ‘e into the project:

Note: Directly save as a picture download, import into the project can be.

In Hierarchy view, select Create→3D Object→Quad to Create a Quad Object and attach the background image:

In this way, our project is set up, the following needs to achieve the function of drawing lines.

❤️ Step 3: Customize line drawing

Create a new script paintui. cs and edit the script:

using DG.Tweening;
using System.Collections;
using System.Collections.Generic;
using UnityEngine;

public class PaintUI : MonoBehaviour{[Header("Rendering Quad")]
    public Renderer m_rendered;
    [Header("Color")]
    public Color m_drawColor;

    public GameObject m_player;

    private List<Vector3> m_vertexList;
    private void Start()
    {
        m_vertexList = new List<Vector3>();
    }

    private void Update()
    {
        if (Input.GetMouseButtonDown(0))
        {
            
            m_vertexList = new List<Vector3>();
        }
        if (Input.GetMouseButton(0))
        {
            // Record the pointm_vertexList.Add(Camera.main.ScreenToViewportPoint(Input.mousePosition)); }}public void OnRenderObject()
    {
        Draw a line / /
        GL.Begin(GL.LINES);
        GL.LoadOrtho();
        GL.Color(m_drawColor);
        for (int i = 1; i < m_vertexList.Count; i++)
        {
            GL.Vertex3(m_vertexList[i - 1].x, m_vertexList[i - 1].y, 0);
            GL.Vertex3(m_vertexList[i].x, m_vertexList[i].y, 0); } GL.End(); }}Copy the code

Attach the script to the Quad object, and then drag the Quad object to the Rendered card slot of the PaintUI component:

Run the program and you can see that the line can be drawn normally:

❤️ The fourth step: Chang ‘e runs to the moon

Chang ‘e’s Texture Type is set to Sprite:

Then directly drag Chang ‘e from the Project area to the Hierarchy view:

Set the size and position of the chang ‘e to match the scene:

Import the DoTweenPro plugin:

Download.csdn.net/download/q7…

Path Path animation is required, so you need to import the DOTweenPro plugin

Import the DOTweenPro plugin and then modify the paintui.cs script:

using DG.Tweening;
using System.Collections;
using System.Collections.Generic;
using UnityEngine;

public class PaintUI : MonoBehaviour{[Header("Rendering Quad")]
    public Renderer m_rendered;
    [Header("Color")]
    public Color m_drawColor;

    public GameObject m_player;

    private List<Vector3> m_vertexList;
    private void Start()
    {
        m_vertexList = new List<Vector3>();
    }

    private void Update()
    {
        if (Input.GetMouseButtonDown(0))
        {
            
            m_vertexList = new List<Vector3>();
        }
        if (Input.GetMouseButton(0))
        {
            // Record the point
            m_vertexList.Add(Camera.main.ScreenToViewportPoint(Input.mousePosition));
        }
        if (Input.GetMouseButtonUp(0)) { Moonfall(); }}public void OnRenderObject()
    {
        Draw a line / /
        GL.Begin(GL.LINES);
        GL.LoadOrtho();
        GL.Color(m_drawColor);
        for (int i = 1; i < m_vertexList.Count; i++)
        {
            GL.Vertex3(m_vertexList[i - 1].x, m_vertexList[i - 1].y, 0);
            GL.Vertex3(m_vertexList[i].x, m_vertexList[i].y, 0);
        }
        GL.End();
    }
    private void Moonfall()
    {
        Vector3[] path = m_vertexList.ToArray();
        m_player.transform.DOPath(path, 3); }}Copy the code

Then wait for the script to compile and drag chang ‘e into the Player slot of the PaintUI component:

Run the program:

Three, after the speech

This article uses GL to draw lines, then uses the DoTweenPro plugin to create a custom arbitrary path of chang ‘e moon flight animation, the renderings are shown above.

Welcome to communicate with us.

Give it a thumbs up if you think it’s funny.