快速エンジニア

駆け出しエンジニア、雑記を書く。Unity多め

【Unity】Textを電光掲示板みたいにループして流す

こんな感じでTextを流すことができます(よく見かけますね)。

vimeo.com

Canvasの下にPanel、その子にTextを二つ配置します。
名前は各自変えてください。

f:id:tantakotako:20210202170952p:plain

Panelの幅を画面いっぱいに設定します。高さはテキストが収まりそうな具合に。
また、Image>Colorのalpha値を0にすればPanelを隠すことができます。

f:id:tantakotako:20210202171217p:plain 
f:id:tantakotako:20210202171153p:plain

Textは位置をPanelの中央にしてHorizontal OverflowとVertical Overflowを「Overflow」に設定します。
また、Text1と2は全て同じ値にしてください(Duplicateしても良い)。

以下のスクリプトを書いて実行すれば流れます。
Textをインスペクタに入れるのを忘れないようにしてください。
textWidthの値はループする横幅なのでお好みで設定してください。

    [SerializeField]
    private Text musicText1, musicText2;
    private Vector3 musicText1Position, musicText2Position;
    private readonly float textWidth = 150f;

    void Start()
    {
        musicText1Position = musicText1.rectTransform.localPosition;
        musicText2Position = musicText2.rectTransform.localPosition;
        musicText1Position.x = 0;
        musicText2Position.x = textWidth;
        musicText2.rectTransform.localPosition = musicText2Position;
        musicText1.rectTransform.localPosition = musicText1Position;
    }

    void Update()
    {
        musicText1Position.x--;
        musicText2Position.x--;
        if (musicText1Position.x < -textWidth)
        {
            musicText1Position.x = textWidth;
        }
        if (musicText2Position.x < -textWidth)
        {
            musicText2Position.x = textWidth;
        }
        musicText1.rectTransform.localPosition = musicText1Position;
        musicText2.rectTransform.localPosition = musicText2Position;
    }