[Unity3d] How to achieve automatic scrolling text effect

When we use Text in making UI, if the text information is too long, there are two ways to deal with it, one is wrapping display, and the other is scrolling display. The following blogger will introduce how to make automatic scrolling text.

The first step is to create an Image (GameObject > UI > Image), you can see a white frame appears, change the size of the frame to display text information, and then create a Text under the Image (GameObject > UI > Iegacy > Text), change the size of the Text, if the length exceeds the size or boundary of the Image, you can change the Image to semi-transparent, and initialize the text information "Success is the ability to go from one failure to another with no loss of enthusiasm.", and the properties are carried out according to your own settings, as shown in the figure below.

The second step is to add the component Mask to the Image, the effect is as shown in the picture above, and then add the Scroll Rect component, and set it as shown in the picture below, drag Text into it, Horizontal is horizontal scrolling, Vertical is vertical scrolling, here we cancel Vertical, Movement Type (below will be for an introduction) to Clamped (dragable, inflexible).

Attribute Movement Type introduction:

Unrestricted: Unrestricted, can be dragged and dropped arbitrarily, and can exceed the text boundary.

Elastic: draggable, flexible, and cannot exceed the text boundary.

Clamped: Draggable, inelastic, and cannot exceed the text boundary.

The third step is to paste the code to the Image, create a new C# file, rename it to TextController, and double-click to open the cs file. The code is as follows:

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

public class TextController : MonoBehaviour
{
    public ScrollRect rect;
    // Start is called before the first frame update
    void Start()
    {
        rect = gameObject.GetComponent<ScrollRect>();//绑定组件
    }

    // Update is called once per frame
    void Update()
    {
        rect.horizontalNormalizedPosition += 0.08f * Time.deltaTime;//滚动速度
    }
}

Above, a simple automatic text scrolling effect is done, just run it.

Let me introduce to you how to control the synchronization of the scrolling effect and the player's typing speed in the blogger's 3D game project case ( Kingsoft Typing: Life and Death Speed ), the code is as follows:

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

public class TextController : MonoBehaviour
{
    public ScrollRect rect;
    // Start is called before the first frame update
    void Start()
    {
        rect = gameObject.GetComponent<ScrollRect>();
    }

    // Update is called once per frame
    void Update()
    {
        //rect.horizontalNormalizedPosition += 0.08f * Time.deltaTime;
    }
    public void Run()
    {
        rect.horizontalNormalizedPosition += 0.02f;//滚动频率
    }
}

In the original PlayerController.cs file to determine whether to press the letter function, add the following code to implement the call:

    if (index >= 9)//当敲第10个字母的时候，开始滚动
    {
       runText.GetComponent<TextController>().Run();//调用函数
    }

[Unity3d] How to achieve automatic scrolling text effect

Guess you like