Aktuelles

Startseite
TP Wettbewerbe
Sitemap

Service

Hilfe-Forum
Kolumnen
Linktipps
Buchrezensionen
Traum-Team
Newsletter

Traumquelle

Dreamweaver
Fireworks
Photoshop
Flash
Traum-Start
gimp
GoLive
php / Apache
Sonstige
Grundlagen
Usability
CSS
Apple / Mac
3D

Intern

TP-Sponsor
TP SHOP
Bild Galerie
TP Wallpapers
Forum-Archiv
Link zu uns
Impressum

TP Portal > Flash > Typewriter

Typewriter

Mit Texteffekten kann man die Aufmerksamkeit des Betrachters geschickt auf eine bestimmte Stelle lenken. Ein sehr einfacher und wirkungsvoller Effekte ist die Schreibmaschine.

Es gibt natürlich auch hier wieder mehr als eine Möglichkeit so einen Effekte zu erstellen. Die wohl einfachste und billigste ist eine Maske vor dem Text zu legen.

Bei einer einzelnen Zeile ist dieses noch sehr einfach so zu machen, wenn es jedoch mehrzeiliger Text ist, erhöht sich der Aufwand um ein vielfaches. Weiter ist ActionScript kleiner und variabler zu Handhaben als Tweens!

Für dieses Tutorial soll es ausreichen das Textfeld "von Hand" auf der Bühne zu erstellen. Natürlich kann dieses später auch dynamisch geschehen. Das erstellte Textfeld wird in einen MC gewandelt, damit der Code nicht auf der Hauptzeitleiste liegt.

Dem Textfeld geben wir mal den Variablennamen Ausgabe und formatieren ihn linksbündig.

Über der Ebene mit dem Text erstellen wir eine weitere Ebene für den Code. In dieser wird im ersten Schlüsselbild der Text festgelegt und ein Zähler auf 0 gesetzt.

actionscript

var str = "Traum-Projekt.com";
var zaehler = 0;

Die eingentliche Animation findet im 2. Schlüsselbild statt, welches als Leeres Schlüsselbild in der ActionScript Ebene stellt wird. Hier wird der Zähler, der für die Positionsangabe im Textstring steht, um 1 erhöht (inkrementiert) und der Text vom Position 0, welches der erste Buchstabe ist, bis zur aktuellen Zählerposition als Kopie in die Variable Ausgabe geschrieben.

actionscript

++zaehler;
ausgabe = str.substring(0,zaehler);

Im 3. Schlüsselbild, welches wie das 2. als Leeres Schlüsselbild in der AS Ebene erstellt wird, wird nur eine Schleife zurück zum 2. Bild gelegt und falls der Text am Ende des Strings angekommen ist, hier gestopt wird.

actionscript

if (zaehler<=str.length-1) {
  gotoAndPlay(2);
 } else {
  stop();
 }

Damit der Text auch in den ganzen 3 Schlüsselbildern auf der Bühne angezeigt wird, muss in seiner Ebene noch im 3. Schlüsselbild sein Bild eingefügt werden.