В этом кратком совете мы создадим статический класс ActionScript для многократного использования, который будет создавать эффект «Пишущая машинка» в одну строку. Читай дальше!
Шаг 1: Краткий обзор
Мы разделим пользовательскую строку на массив, а затем добавим полученные буквы в TextField
по TextField
, используя класс Timer
.
Шаг 2: Класс пишущей машинки
Наш класс будет static
, что означает, что его не нужно создавать с использованием ключевого слова new
. Чтобы получить доступ к члену статического класса, используйте имя класса вместо имени экземпляра.
Создайте новый файл ActionScript и напишите следующий код:
01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
|
package
{
import flash.text.TextField;
import flash.utils.Timer;
import flash.events.TimerEvent;
public final class Typewriter
{
/* Declare the variables and methods as static */
private static var chars:Array;
private static var tf:TextField;
private static var timer:Timer;
private static var i:int = 0;
public static function write(txt:String, txtField:TextField, time:Number):void
{
chars = txt.split(«»);
tf = txtField;
timer = new Timer(time);
timer.addEventListener(TimerEvent.TIMER, writeChar);
timer.start();
}
private static function writeChar(e:TimerEvent):void
{
if (i < chars.length)
{
tf.appendText(chars[i]);
i++;
}
if (i >= chars.length) //check whether string is complete
{
timer.stop();
timer.removeEventListener(TimerEvent.TIMER, writeChar);
timer = null;
}
}
}
}
|
Шаг 3: Использование
Использование не может быть проще — просто добавьте класс Typewriter.as
в папку вашего проекта и используйте следующий код:
1
2
3
|
import Typewriter;
Typewriter.write(‘Text to Write’, targetTextfield, 50);
|
Вот и все, протестируйте свой фильм, и вы увидите свой TextField, используя эффект «Пишущая машинка».
Шаг 4: Пример
Я использовал класс в этом примере SWF, чтобы вы могли увидеть эффект:
Вывод
Используйте этот класс, чтобы создавать свои собственные эффекты!
Спасибо за чтение. Если вам нужна более продвинутая версия этого эффекта для использования в ваших проектах, взгляните на Анимацию Letter By Letter от Rasmus Wriedt Larsen.