String Objekt - Typewriter & Newsticker

[sebastian]

Hi Leute,

ich hab mich gefragt, warum nicht auch mal ein Nicht-Moderator ein Tutorial für das Flashforum
schreiben soll. Es ist nichts neues, wie alles hier, aber es soll mal eine Zusammenfassung mit
Erläuterung usw. sein.

In diesem Tutorial möchte ich erklären, wie ihr einen Newsticker und einen Typewriter bastelt.
Dazu werden verschiedene Funktionen des String Objekts benötigt.



Fangen wir mit dem Typewriter an.

Dazu arbeiten wir mit einem MC und enterFrame. Zunächst muss ein mehrzeiliges dynamisches
Textfeld mit der Variable 'anzeige' z.b. erstellt werden.
Dieses Textfeld stellen wir in den erwähnten MC (Einfügen >> In Symbol konvertieren [F8]).
Ein Instanzname muss nicht vergeben werden.

Zu den Aktionen dieses MovieClips (Rechte Maustaste >> Aktionen):
Wir möchten eine Aktion erstellen, die nach und nach einen definierten Text niederschreibt.
Dazu arbeiten wir mit String.substr - diese Aktion gibt die Zeichen eines bestimmten Bereiches
der Zeichenfolge an; Beispiel:

PHP-Code:

text.substr(0, 45); // Das wären die ersten 45 Zeichen von Text 


Da wir die Zeichenlänge dynamisch haben wollen, vergeben wir eine Variable.
Die Variable Text wird unser Text, den wir auch gleich definieren:

PHP-Code:

text="Dies ist der Schreibmaschinen-Effekt. Der Text kann bequem per AS festgelegt werden";
text.substr(0, zeichen); 


Da wir einen Movie Clip haben definieren wir Text & die Variable zeichen im Event-Handler 'load'.
(zeichen=1

Die substr-Aktion verwenden wir im enterFrame Teil, da die Aktion bei jedem Betreten aufgerufen werden
soll. Und da wir den Bereich der Anzeige immer erweitern wollen, erweitern wir 'zeichen' um 1.

Da das jetzt niemand verstanden hat, die Aktionen in der Zusammenfassung:

PHP-Code:

onClipEvent (load) {
    text="Dies ist der Schreibmaschinen-Effekt. Der Text kann bequem per AS festgelegt werden";
    zeichen=1;
}
onClipEvent (enterFrame) {
    anzeige = text.substr(0,zeichen);
    zeichen++;
} 


Für diejenigen, die es immer noch nicht verstehen: Im Anhang ist eine Beispiel Datei!

Fertig ist der Typewriter
Garnicht so schwer, oder?




Dann gehen wir die Sache mit dem Newsticker an.

Dazu erstellen wir wiederum ein dynamisches Textfeld - diesmal einzeilig.
Als Variable vergeben wir 'news'. Auch dieses Textfeld stellen wir in einen
MovieClip [F8].

Man lernt aus der Erfahrung Diesmal definieren wir zuerst den Text, in diesem Beispiel
mit der Variable 'news':

PHP-Code:

onClipEvent (load) {
    news=" +++Dies ist der Newsticker +++ Hier könnten irgendwelche News stehen  +++ Der Text kann bequem per ActionScript eingefügt werden  +++ Der Newsticker wird durch verschiedene Funktionen des String-Objekts erzeugt  +++ Wenn Sie keine farbigen Zeichen haben möchten, genügt eine Aktion ";
} 


Mehr ist diesmal auch nicht zu definieren.

Wir stellen uns wieder die Frage:
Was wollen wir eigentlich machen?

Wir wollen den ersten Buchstaben extrahieren und hinten dranhängen.

Um das erste Zeichen zu ermitteln, arbeiten wir mit
String.charAt

Konkret:

PHP-Code:

String.charAt(index); // index gibt die Position des Zeichens an, das ermittelt werden soll
// in unserem Beispiel das erste, also 0. Man kann die Klammer dafür aber auch leer lassen. 


Jetzt müssten wir dieses Zeichen extrahieren. Wir machen es aber anders. Wir definieren
news bei jedem Betreten des Frames neu, indem wir zuerst das 1. Zeichen bestimmen, den Rest
mit String.slice ermittlen und das 1. Zeichen hintendran hängen.

PHP-Code:

// erster=news.charAt();
news=news.slice(erster.length,news.length) + erster; 


Mit dieser Aktion wird der restliche Text extrahiert, der 'alte' erste Buchstabe wieder drangehängt
und das ganze als 'news' definiert.


Am Ende sollte folgende Aktionen stehen:

PHP-Code:

onClipEvent (load) {
    news=" +++Dies ist der Newsticker +++ Hier könnten irgendwelche News stehen  +++ Der Text kann bequem per ActionScript eingefügt werden  +++ Der Newsticker wird durch verschiedene Funktionen des String-Objekts erzeugt  +++ Wenn Sie keine farbigen Zeichen haben möchten, genügt eine Aktion ";
}
onClipEvent (enterFrame) {   
    erster=news.charAt();   
    news=news.slice(erster.length,news.length) + erster;
} 


Wer noch etwas Farbe in den News haben möchte. Die Aktionen müssten sich mittlerweile
von selbst erklären. Ihr müsst nur aufpassen, dass du '<' nicht verwendest

PHP-Code:

onClipEvent (load) {
    news=" <font color='#ffcc00'>+</font><font color='#ffcc00'>+</font><font color='#ffcc00'>+</font>Dies ist der Newsticker  <font color='#ffcc00'>+</font><font color='#ffcc00'>+</font><font color='#ffcc00'>+</font> Hier könnten irgendwelche News stehen  <font color='#ffcc00'>+</font><font color='#ffcc00'>+</font><font color='#ffcc00'>+</font> Der Text kann bequem per ActionScript eingefügt werden  <font color='#ffcc00'>+</font><font color='#ffcc00'>+</font><font color='#ffcc00'>+</font> Der Newsticker wird durch verschiedene Funktionen des String-Objekts erzeugt  <font color='#ffcc00'>+</font><font color='#ffcc00'>+</font><font color='#ffcc00'>+</font> Wenn Sie keine farbigen Zeichen haben möchten, genügt eine Aktion ";
}
onClipEvent (enterFrame) {
    if (news.charAt() !="<") {
        erster=news.charAt();
    } else {
        erster="<font color='#ffcc00'>+</font>";
    }
    news=news.slice(erster.length,news.length) + erster;
} 


Viel Spaß
Sebastian

p.s.: vergebt mir meine Fehler ist heute morgen in einer Stunde entstanden !

[dassoud]

coole sache & klasse erklärt!

muß auch unbedingt im faqs/tutorials-forum erwähnt werden!!!

weiter so & grüße, dassoud

[sebastian]

Hoi mein Freund

Ist schon passiert.

Sebastian

[Live2]

ja echt cool ((; so einen newsticker hab ich auch schon gebastelt ((:

zu betrachten auf http://kulturwerkstatt-wolfurt.com

die text lade ich aus einer Textdatei ((:

alles per as *fg*

mfg Live2

[Julian Graw]

Echt cool!

[Madokan]

Sauber - einwandfrei !

mfg
Matze K.

[zungenbrecher]

frage zu dem newsticker:

ist es egal, wieviele zeichen der text hat, der angezeigt wird?
d.h. wenn das dynamische textfeld ein update über einen swift generator erfährt, läuft der text dann in der gleichen gescwindigkeit ab? und passt sich der textlänge an, oder muss ich das immer manuell noch mal ändern?

[sebastian]

Textlänge usw. ist egal. Sollte jedoch nicht zu lang sein, weil das unter Umständen auf die Performance gehen könnte.

Sebastian

[sebastian]

Noch ein bisschen was für die Leute, die mehr Farbe möchten. Ein Colortypewriter! (Anhang)
Der Text wird mit Zufallsfarben niedergeschrieben.

Dazu habe ich noch eine kleine Abwandlung von Matzes Color Script für Hex-Codes.
Die kann wie in den Beispielen für Textfelder usw. sinnvoll sein.

PHP-Code:

movieclip.prototype.hexzufall =function () {
    color = new Array("0","1","2","3","4","5","6","7","8","9","A","B","C","D","E","F");
    cc="";
    // Zufalls Hex-Code wird erzeugt
    for (i=1; i<7; i++) {
        zufallc = random(15);
        cc+=color[zufallc];
    }
    trace (cc);
}

Aufruf mit 
hexzufall(); 


Wird in diesem Beispiel aber nur per trace ausgegeben.


Vielleicht kann ja der eine oder andere etwas damit anfangen.


Sebastian

p.s.: Bei Beispiel 2 sieht es schon schlecht mit der Performance aus.

[zungenbrecher]

hi sebastian,
die beispiele sind wirklich gut, habe bisher umständlicher versucht einen variablen, scriptgesteuerten ticker zu basteln. was mir aber aufgefallen ist, wird der inhalt des dyn. texfeldes mit der variable "news" nicht direkt im script definiert, sondern soll der inhalt etwa über ein .txt-file integirert werden, funktioniert es irgendwie nicht. vielleicht muss ich mir noch mehr mühe geben, kann sein, dass ich irgendwo einen fehler gemacht habe. was mich besonders interessiert (und das ist noch etwas unsicherer) ob der ticker funktioniert, wenn das textfeld per swift-generator gefüllt wird. leider habe ich nen mac und den generator nicht, deshalb kann ich das nicht testen. gibt es hier im forum nen experten, der so was beantworten kann?

Geschrieben von Sebastian W.
Textlänge usw. ist egal. Sollte jedoch nicht zu lang sein, weil das unter Umständen auf die Performance gehen könnte.

Sebastian

[Madokan]

Also per Generator das ganze zu füllen stellt kein Problem dar dem Textfeld ist die Quelle der Information egal.

Von daher kann ich dir grünes Licht geben.

mfg
Matze K.

[sebastian]

Da hattest du deinen Experten

Zur Frage mit dem Textfile:
Da dürfte es überhaupt keine Probleme geben. Ich denke, dass du
evtl. die Variable auf die Hauptzeitleiste geladen hast, obwohl
sie im mc verfügbar sein muss.
Versuch es mal, wenn das Script die Variable _root.news nutzt oder
ändere die variable im textfile oder möglichkeit 3:

PHP-Code:

onClipEvent(load){
news=_root.news;
} 


Das war, denke ich, das Problem. Ansonten bitte ich um Rückmeldung *gg*


Viel Spaß,

Sebastian

[zungenbrecher]

ja, habe in die hauptzeitleiste geladen. ich versuche mal deine vorschläge. wenn ich noch etwas ergänzendes herausfinde oder fragen habe, melde ich mich erneut.

zungenbrecher

[sebastian]

Text-Farbverlauf per String Objekt im Anhang; mehr gibt es hier:
Schriftfarbe


Sebastian

[zungenbrecher]

so, habe nun alles noch mal ausprobiert. mit dem laden externer inhalte aus einem txt-dokument funktioniert es nun. mit dem typewriter bin ich sehr zufrieden, mit dem newsticker nicht ganz. entgegen den befürchtungen leidet die performance nicht, wenn größere textmengen geladen werden, ich habe ien anders problem. wenn der ticker lesbar bleiben soll, muss eine framerate von 6-12 eingestellt werden, dann ist das ruckeln aber sehr deutlich (besonders bei großen schriften natürlich), da ja immer ein zeichen pro bild ausgewechselt wird. das ist noch fast verkraftbat und mit dieser methode wohl auch nicht zu ändern. was aber störender ist, ist dass andere animationen auf 20-25 fps laufen müssen, um flüssig zu bleiben. binde ich nun aber den ticker mit 10 fps in einen hauptfilm mit 25 fps, läuft der ticker natürlich auch schnellet. ich hoffte, dass man das ersetzen des ersten zeichens so einstellen könnte, dass es nur alle 2 oder 3 frames ersetzt wird, habe es aber nicht hinbekommen. hat jemand ne idee, wie man das problem beheben kann?

meine ticker-idee wäre, einfach ein großes texfeld in der maximalen breite aufzuziehen (2880 px), dort text reinzuladen, das ding per tween oder _x=+ (bzw. -) n zu bewegen und alle etwa 50 frames die texmenge des textfeldes abzufragen, um den film dann entsprechend zu steuern. hat aber bisher auch nicht so toll geklappt. v.a. ist so die textmenge im feld begrenzt. kann ja mal das script reinsetzen, falls es jemand interessiert oder verbesserungsvorschläge da wären. würde mich auf jeden fall über die verbesserung des scripts von sebastian freuen, da ich noch immer kein brauchbares tickerergebnis erreicht habe