2018-2-23 23:20
javascript typography unity

文字列のシャッフル表示演出

追記

  • JSでも作ってみました。
  • 以下はUnity版

概要

  • 左から文字がシャッフルされながら表示される、よくある文字表示演出。

ざっくり解説

  • 演出を3つの処理に分解する
    • 必要な文字数分'-'を追加していく処理
    • 文字列の左から1文字ずつシャッフルを増やしていく処理
    • 文字列の左から1文字ずつ正しい文字を表示していく処理
  • これらをコルーチンでタイミングをずらして実行開始する

スクリプト

ShuffleText.cs

using System.Collections; using UnityEngine; using UnityEngine.UI; [RequireComponent(typeof(Text))] public class SuffleText : MonoBehaviour { // シャッフル演出用文字郡 public string RandomCharacters = "ABCDEFGHIJKLMNOPQRSTUVWXY!#$%&'()0=~|Z1234567890"; // 走査演出用文字 public string EmptyCharacter = "-"; // 各表示開始のディレイ秒 public float delay = 0.2f; // 処理間隔 public float timeOut = 0.02f; private Text textField; private float timeElapsed; private string text; private int length = 0; private int shuffleLength = 0; private int displayLength = 0; void Start () { textField = gameObject.GetComponent<Text> (); Shuffle(); } public void Shuffle () { text = textField.text; length = text.Length; shuffleLength = 0; displayLength = 0; textField.text = ""; // 各表示開始のトリガー StartCoroutine ("Starter"); } void Update() { if ( displayLength <= length ) { timeElapsed += Time.deltaTime; // 経過時間 if (timeElapsed >= timeOut) { if (textField.text.Length < length) { textField.text += EmptyCharacter; } if(shuffleLength > 0){ textField.text = GenerateRandomText (shuffleLength) + textField.text.Substring (shuffleLength ); if(shuffleLength < textField.text.Length){ shuffleLength++; } } if(displayLength > 0){ textField.text = text.Substring(0, displayLength) + textField.text.Substring (displayLength); displayLength++; } timeElapsed = 0.0f; } } } private IEnumerator Starter() { // delay秒分待機 yield return new WaitForSeconds (delay); // シャッフル表示開始 shuffleLength = 1; // delay秒分待機 yield return new WaitForSeconds (delay); // 本番表示開始 displayLength = 1; yield return false; } private string GenerateRandomText( int length ) { var stringBuilder = new System.Text.StringBuilder( length ); var random = new System.Random(); int position = 0; char c; for ( int i = 0; i < length; i++ ){ position = random.Next( RandomCharacters.Length ); c = RandomCharacters[position]; stringBuilder.Append( c ); } return stringBuilder.ToString(); } }