achieved goals

Sometimes we need to play some standby animation, and the animation can have outlines without affecting the interface behind.
way1:
We will use animation frame sequences with channels. Normally, two-dimensional art is ready for animation, and hundreds of sequence frames are output and we import and use (create animation state machine to load, or code to load sprite).
Total number of pictures
way2: After
finishing the video, make a mask, but the mask can only be a picture, and it will not change with the change of the video content.

We will find the drawbacks: when there are a lot of sequence frames, rendering takes a lot of performance and resources, and the fps is often low to single digits, and it is too stuck to watch! If you want to optimize performance, small projects are totally different, time-consuming and labor-intensive.

Optimization and solution

Use transparent video: format webm, ogv

Implementation

1. Standardize the naming of sequence frames:
folders and files cannot have Chinese characters. A batch naming tool is recommended: ReNamer, download address . Irregular
naming case:
modify the folder name to English;
open ReNamer and set the following settings:
Set up
carry out
complete renaming.

2. Download the conversion tool ffmpeg, download address
3. Start to convert webm transparent video
Open the cmd window, no need to open the administrator. If you don’t know cmd, please go to Baidu.
Insert picture description here
Input: "-i Absolute path of the folder where the picture is located\picture name prefix+% digits of the serial number of the first picture d.png -auto-alt-ref 0 -c:v libvpx -r frame rate -b:v 1000k output Path folder name\video name.webm” ( Do not copy the quotation marks . If the first picture is rw_00001, fill in rw_%5d.png. The output path cannot be in the root directory of the C drive , because it has no permission, it can be the path to the desktop.), Command download address
Reference: C:\Users\GK\Desktop\ffmpeg\bin\ffmpeg.exe -i C:\Users\GK\Des
ktop\renwu\rw_%4d.png -auto-alt-ref 0 -c: v libvpx -r 25 -b:v 1000k C:\Users\GK\D
esktop\ffmpeg\v.webm
Insert picture description here
The following interface appears, and the

production is complete.
Let’s take a look at the output size. You can compare the first picture in this article.

Used in Untiy

way1: Follow the icon to select and set the transparent video. I use RawImage imaging to play video, and I must set VP8 mode, otherwise the colors are wrong.
Insert picture description here

Here is the video playback code that has been collected for many years

Play code

using System;
using UnityEngine;
using UnityEngine.UI;
using UnityEngine.Video;

public class VideoControl : MonoBehaviour
{
    private VideoPlayer Vp;
    private RawImage RawImg;

    void Awake()
    {
        Vp = GetComponent<VideoPlayer>();
        RawImg = GetComponent<RawImage>();
        Vp.isLooping = true;
    }

    void OnEnable()
    {
        RawImg.color = new Color(1, 1, 1, 0);
        Vp.Play();
        Vp.loopPointReached += VideoEnd;
    }

    void VideoEnd(VideoPlayer vp)
    {
        Vp.Play();

    }

    void Update()
    {
        if (Vp.frame > 0)
        {
            RawImg.color = new Color(1, 1, 1, 1);
            RawImg.texture = Vp.texture;
        }
        else
        {
            //RawImg.color=new Color(1,1,1,0);
        }
    }

    void OnDisable()
    {
        RawImg.color = new Color(1, 1, 1, 0);
        Vp.Stop();
    }
}

When playing, you will find a silky version of fps6666

Bye bye

Other playback methods:
way2: For example, create a 3D patch, set a shader, and select the rendering mode to see the picture. This does not require code to control playback, it can be played directly
Insert picture description here

way3:
Adjust the rendering mode of videoplayer, this does not require code to control playback
Insert picture description here

Each has its own pros and cons, decide for yourself!

Talking about the production and benefits of Unity transparent video