[Stuff] AdvancedTooltip-Klasse (die zweite Version)

[Vampire's Party]

Nachdem sich Version 1 zunehmender Beliebtheit erfreut, habe ich mich nochmal rangesetzt und eine zweite Version aufgesetzt.

Anschauen: hier (Server spinnt in letzter Zeit öfters rum. wenns nicht geht unteren Link benutzen)
oder: hier

Downloaden: hier (gleiches Problem wie oben)
oder: hier

Dokumentiert ist die ganze Choose in der beiligenden fla. Wem die veröffentlichte Datei zu groß ist, der kann einfach die Transitions-Methoden aus der Klasse sowie die entsprechenden imports am Anfang entfernen. Es dürften keine Fehler auftreten

PS: über Feedback freue ich mich immer besonders
PS2: Modifikationen und Erweiterungen freuen mich noch mehr


Edit: Hier nochmal das Script aus der Fla. Ich glaube so kann man sich einen besseren Überblick verschaffen...

/*
    Hinweise zum Tooltip:
    
        Allgemein:
            In dieser Datei werden nicht alle Möglichkeiten der Klasse gezeigt.
            Modifikationen sind erlaubt und erwünscht. Besonders neue Transitions.
            Jedoch muss der Copyrighthinweis oben in der Klasse erhalten werden.
            
            Bereits vorhanden Tooltips können durch Verwendung der gleichen
            NamensID überschrieben werden
            
        Weitere Möglichkeiten zum Anzeigen und Ausblenden eines TTs:
            
            Anzeigen ohne EventDispatcher:
            - AdvancedTooltip.show(nameID:String):Void
    
            Ausblenden ohne EventDispatcher:
            - AdvancedTooltip.hide(nameID:String):Void
        Weitere Möglichkeiten zur Verwaltung der Sprachen:
            
            Eine Sprache samt Inhalten löschen:
            - AdvancedTooltip.removeLanguage(language:String):Void
            Inhalt einer Sprache ausgeben:
            - AdvancedTooltip.getLanguageContent(language:String):Object
        
        Die Standardwerte des AdvancedTooltip:
            
            waitTime        : new Number(500)         // Verzögerung vom Auslösen des Events zum Anzeigen des TT
            language        : new String("def")   // Standardsprache
            lineThickness   : new Number(0)                // Dicke der äußeren Umrisslinie
            lineColor      : new Number(0x666666)  // Farbe der äußeren Umrisslinie
            lineAlpha      : new Number(50)         // Alphawert der äußeren Umrisslinie
            background    : new String("draw")    // Typ des Hintergrunds. Bei "draw" wird der Tooltip
                                                           einfarbig mit backgroundColor gefüllt. Ein anderer Wert
                                                           stellt eine Bibliotheksinstanz dar, die mit BitmapData
                                                           zum füllen verwendet wird. In dieser Datei ist "pattern"
                                                           ein verknüpfter Hintergrund
            backgroundColor : new Number(0xFFFFFF)      // Hintergrundfarbe
            textFont        : new String("_sans")      // Zu verwendende Schriftart. Die Transitions werden bloß
                                                           bei eingebetteten Schriftarten korrekt angezeigt.
                                                           Allerdings haben dann die Eigenschaften textBold und 
                                                           textItalic keine Wirkung mehr
            textSize        : new Number(10)            // Schriftgröße
            textHtml        : false      // soll der Text als HTML-Text angezeigt werden?
            textBold        : false      // Fettschrift
            textItalic    : false                  // Kursivschrift
            textColor      : new Number(0x333333)  // Schriftfarbe
            cornerRadius    : new Number(6)    // Radius der abgerundeten Ecken
            transition    : new String("none")    // Standard-Transition
            transitionDur   : new Number(1)                // Dauer der Transition
            dragOnTransitionFinish  : true                // Soll der Tooltip gedraggt werden, wenn die
                                                           Transition beendet ist?
        Bekannte Bugs:
            - manchmal ist ein Tooltip kurz am Mauszeiger zu sehen, wenn eine Transition gestartet
              oder beendet wird. Leider kann ich diesen Fehler nicht nachvollziehen.
*/
 
import org.tools.AdvancedTooltip;
 
// Konstruktor
// Syntax: new AdvancedTooltip(target:MovieClip [, initObj:Object])
// Anmerkung: initObj wie bei AdvancedTooltip.setDefaults(initObj:Object)
var myTooltip:AdvancedTooltip = new AdvancedTooltip(this, {textFont:"MeineSchriftart"});
 
// Sprache hinzufügen
// Syntax: AdvancedTooltip.addLanguage(language:String):Boolean
// Anmerkung: man muss keine Sprache einstellen[*]
myTooltip.addLanguage("de");
myTooltip.addLanguage("en");
 
// Standardeinstellungen ändern
// Syntax: AdvancedTooltip.setDefaults(initObj:Object):Void
myTooltip.setDefaults({language:"de"});
 
// Einen Tooltip hinzufügen
// Syntax: AdvancedTooltip.addTooltip(nameID:String, text:String [, language:String]):Void
//[*] wenn man bis jetzt noch keine Sprache eingestellt hat, muss man das letzte Argument leer lassen
myTooltip.addTooltip ("welcome", "Willkommen.\nIch bin ein normaler Tooltip", "de");
myTooltip.addTooltip ("welcome", "Welcome.\nI'm a simple Tooltip", "en");
 
myTooltip.addTooltip ("canfly", "Ich bin ein fliegender Tooltip", "de");
myTooltip.addTooltip ("canfly", "I'm a flying tooltip", "en");
 
// Transition eines einzelnen Tooltips ändern
// Syntax: AdvancedTooltip.setTransition(nameID:String, transition:String):Void
// Anmerkung: wird dies nicht gemacht, so wird die Standardeinstellung verwendet (s.o.: "welcome")
myTooltip.setTransition("canfly", "fly");
 
myTooltip.addTooltip ("imflipping", "Ich drehe mich.\nMit ein paar\nZeilenumbrüchen werde\nich noch höher", "de");
myTooltip.addTooltip ("imflipping", "I'm flipping.\nInsert some new lines\nto make me\nmuch higher", "en");
myTooltip.setTransition("imflipping", "flip");
 
myTooltip.addTooltip ("beamer", "Beam mich hoch,\nScotty", "de");
myTooltip.addTooltip ("beamer", "Beam me up,\nScotty", "en");
myTooltip.setTransition("beamer", "beam");
 
myTooltip.addTooltip ("imaflag", "Ich verhalte mich wie eine Flagge.\nMan kann übrigens auch meinen\nHintergrund ändern. Einfach ein\nBitmapbild oder eine Hintergrundfarbe\nauswählen und meine\nEinstellungen ändern", "de");
myTooltip.addTooltip ("imaflag", "I'm like a flag.\nBtw: you can easily change\nmy background. Just choose a background color\nor a bitmap file and set me up.", "en");
myTooltip.setTransition("imaflag", "flag");
 
 
// Event zum zeigen eines TT hinzufügen
// Syntax: AdvancedTooltip.addShowEvent(nameID:String, eventObject:MovieClip, event:String):Void
// Anmerkung: das evt. bestehende Event wird überschrieben
myTooltip.addShowEvent ("welcome", this.norm_btn, "onRollOver");
 
// Event zum ausblenden eines TT hinzufügen
// Syntax: AdvancedTooltip.addHideEvent(nameID:String, eventObject:MovieClip, event:String):Void
// Anmerkung: das evt. bestehende Event wird überschrieben
myTooltip.addHideEvent ("welcome", this.norm_btn, "onRollOut");
myTooltip.addHideEvent ("welcome", this.norm_btn, "onDragOut");
myTooltip.addHideEvent ("welcome", this.norm_btn, "onRelease");
 
myTooltip.addShowEvent ("canfly", this.fly_btn, "onRollOver");
myTooltip.addHideEvent ("canfly", this.fly_btn, "onRollOut");
myTooltip.addHideEvent ("canfly", this.fly_btn, "onDragOut");
myTooltip.addHideEvent ("canfly", this.fly_btn, "onRelease");
 
myTooltip.addShowEvent ("imflipping", this.flip_btn, "onRollOver");
myTooltip.addHideEvent ("imflipping", this.flip_btn, "onRollOut");
myTooltip.addHideEvent ("imflipping", this.flip_btn, "onDragOut");
myTooltip.addHideEvent ("imflipping", this.flip_btn, "onRelease");
 
myTooltip.addShowEvent ("beamer", this.beam_btn, "onRollOver");
myTooltip.addHideEvent ("beamer", this.beam_btn, "onRollOut");
myTooltip.addHideEvent ("beamer", this.beam_btn, "onDragOut");
myTooltip.addHideEvent ("beamer", this.beam_btn, "onRelease");
 
myTooltip.addShowEvent ("imaflag", this.flag_btn, "onRollOver");
myTooltip.addHideEvent ("imaflag", this.flag_btn, "onRollOut");
myTooltip.addHideEvent ("imaflag", this.flag_btn, "onDragOut");
myTooltip.addHideEvent ("imaflag", this.flag_btn, "onRelease");
 
lang_de_btn.onRelease = function ():Void
{
    myTooltip.setDefaults({language:"de"});
}
lang_en_btn.onRelease = function ():Void
{
    myTooltip.setDefaults({language:"en"});
}
bkg_white_btn.onRelease = function ():Void
{
    myTooltip.setDefaults({background:"draw", backgroundColor:0xFFFFFF});
}
bkg_green_btn.onRelease = function ():Void
{
    myTooltip.setDefaults({background:"draw", backgroundColor:0x97FF97});
}
bkg_bitmap_btn.onRelease = function ():Void
{
    myTooltip.setDefaults({background:"pattern"});
} 

Edit2: Sorry für mein schlechtes Englisch

[b.asile]

Endlich mal wieder ein [Stuff]-Thread

Habs mal gezogen, schnupper die Tage mal rein und dann gibts richtiges Feedback!
Auf den ersten Blick sehr schön anzusehen.

Danggeschön!

[ricobeck]

erstmal danke und vom optischen her wird der drehende mein favourite werden. obwohl da irgendwie gerade ein kleiner fehler aufgetaucht ist. dummerweise kann ich ihn nicht reproduzieren.

[sagte ich schon danke? ]

[shikamoo]

respekt, sieht echt fein aus...
gesaugt und danke auch, kann man bestimmt mal brauchen sowas

bugbericht kommt erst später.... falls denn dann halt.

[Vampire's Party]

Zitat von ricobeck

obwohl da irgendwie gerade ein kleiner fehler aufgetaucht ist. dummerweise kann ich ihn nicht reproduzieren.

Ist der Tooltip so stehengeblieben und wurde nicht entfernt? Ich hab' ja schon unter Bugs erwähnt, dass da irgendwas nicht stimmt. Ist allerdings nur schwer reproduzierbar - man müsste rauskriegen unter welchen Bedingungen er auftaucht. Wenn der Fehler nur in der flip-Transitions auftaucht, dann ist es ein Fehler in der Methode _transitionFlipOut oder _removeTooltip ansonsten muss er bei der Methode hide liegen.

Zitat von ricobeck

erstmal danke und vom optischen her wird der drehende mein favourite werden.

Vielleicht auch nicht. Die Klasse ist so ausgelegt, dass neue Transitions einfach hinzuzufügen sind. Vielleicht (oder bestimmt) machts jemand besser als ich.

Zitat von b.asile

Habs mal gezogen, schnupper die Tage mal rein und dann gibts richtiges Feedback!
Auf den ersten Blick sehr schön anzusehen.

Danggeschön!

Danke und bitte

Zitat von shikamoo

bugbericht kommt erst später.... falls denn dann halt.

Den letzten Teil versteh ich nicht. Ist wohl schon zu spät

[guz3l]

Moin,

und erstmal vielen Dank für diese Super TTs

Ich bin leider nicht so der AS Freak, zähle mich eher zun den AS Murkeln, ich bin halt mehr so der DesignerTyp *duck*

Ich wollte nun einen deiner tollen TTs benutzen und für meine Buttons nehmen. Mein Problem ist nun folgendes:
Meine Buttons sind alle animiert, per RollOver gehen sie raus und per RollOut wieder rein.
Wenn ich nun dein Script in den Frame auf der Zeitleiste reintue, erscheint zwar der TT, aber meine Animation der Buttons geht nicht mehr. Habe da auch versucht was zu werkeln, allerdings ohne Erfolg.

Mein ButtonScript auf der Zeitleiste:

PHP-Code:

stop();
btn1.hitArea = btn1hit;
btn1.onRelease = function() {
    trace("hit! "+this._name);
};
btn2.hitArea = btn2hit;
btn2.onRelease = function() {
    trace("hit! "+this._name);
};
btn3.hitArea = btn3hit;
btn3.onRelease = function() {
    trace("hit! "+this._name);
};
btn1hit._visible = false;
btn2hit._visible = false;
btn3hit._visible = false;

MovieClip.prototype.mcRollOver = function() {
    this.onEnterFrame = function() {
        this._currentframe == this._totalframes ? delete this.onEnterFrame : this.nextFrame();
    };
};
MovieClip.prototype.mcRollOut = function() {
    this.onEnterFrame = function() {
        this._currentframe == 1 ? delete this.onEnterFrame : this.prevFrame();
    };
};

btn1.onRollOver = function() {
    this.mcRollOver();
};
btn1.onRollOut = function() {
    this.mcRollOut();
};
btn2.onRollOver = function() {
    this.mcRollOver();
};
btn2.onRollOut = function() {
    this.mcRollOut();
};
btn3.onRollOver = function() {
    this.mcRollOver();
};
btn3.onRollOut = function() {
    this.mcRollOut();
}; 


Ich wäre Dir sehr dankbar oder jedem anderen, der mir bei der Lösung meines Problemchens behilflich sein könnte.

Danke

[guz3l]

kann denn keiner helfen bitte? Schaffe es leider alleine echt nicht

[Vampire's Party]

Dann zeig dochmal bitte das Script, mit dem du die Tooltip-Klasse erstellst und initalisierst.

Vermutlich wird dein Event von der Klasse einfach überschrieben. Davor hatte ich aber gewarnt

Weitere Möglichkeiten zum Anzeigen und Ausblenden eines TTs:

Anzeigen ohne EventDispatcher:
- AdvancedTooltip.show(nameID:String):Void

Ausblenden ohne EventDispatcher:
- AdvancedTooltip.hide(nameID:String):Void

benutz doch mal diese Methoden zum Anzeigen und Ausblenden (in deinen Prototype einfügen). Dann sollte es klappen

[guz3l]

Danke Vampy schon einmal fürs Antworten, ich werde deine Idee gleich einmal versuchen, kann nur im Moment nicht Flash aufmachen, da ich gerade was rendere, Flash und 3dsMax schafft meine Ruckelkiste nicht
Melde mich aber sowie ich das probiert habe.

Danke nochmals für die Antwort.

[guz3l]

uff, wie eingangs schon erwähnt zähle ich mich zu den AS-Idis, daher hab ich gerade schwere Probleme das ganze umzufriemeln also mit AdvancedTooltip.Wenn ich das ganze so umbaue, dann bekomme ich Fehlermeldungen:

PHP-Code:

**Fehler** Szene=Szene 1, Ebene=actions, Bild=85:Zeile 70: Die Eigenschaft, auf die verwiesen wird, verfügt nicht über das Attribut 'Static'.
     AdvancedTooltip.show("history", this.btn1, "onRollOver"); 


Bitte hab Gedult und Mitleid mit mir hehe...

Die TTs wollte ich so reinstellen als Test:

PHP-Code:

import org.tools.AdvancedTooltip;
var myTooltip:AdvancedTooltip = new AdvancedTooltip(this, {textFont:"MeineSchriftart"});
myTooltip.addLanguage("de");
myTooltip.setDefaults({language:"de"});
myTooltip.addTooltip ("history", "History", "de");
myTooltip.addTooltip ("canfly", "Ich bin ein fliegender Tooltip", "de");
myTooltip.addTooltip ("beamer", "Beam mich hoch,\nScotty", "de");
myTooltip.addTooltip ("beamer", "Beam me up,\nScotty", "en");
myTooltip.setTransition("beamer", "beam");
AdvancedTooltip.show("history", this.btn1, "onRollOver");
AdvancedTooltip.hide("history", this.btn1, "onRollOut");
AdvancedTooltip.hide("history", this.btn1, "onDragOut");
AdvancedTooltip.hide("history", this.btn1, "onRelease"); 


und auf meinem Button mit dem ich das ganze teste hab ich folgendes AS:

PHP-Code:

btn1.onRollOver = function() {
    this.mcRollOver();
};
btn1.onRollOut = function() {
    this.mcRollOut();
    this.tooltip.removeTextField();
}; 


Hoffe, ich hab mich nicht allzu sehr blamiert

[Vampire's Party]

Probier es mal so:

PHP-Code:

import org.tools.AdvancedTooltip; 
var myTooltip:AdvancedTooltip = new AdvancedTooltip(this, {textFont:"MeineSchriftart"}); 
myTooltip.addLanguage("de"); 
myTooltip.setDefaults({language:"de"}); 
myTooltip.addTooltip ("history", "History", "de"); 
myTooltip.addTooltip ("canfly", "Ich bin ein fliegender Tooltip", "de"); 
myTooltip.addTooltip ("beamer", "Beam mich hoch,\nScotty", "de"); 
myTooltip.addTooltip ("beamer", "Beam me up,\nScotty", "en"); 
myTooltip.setTransition("beamer", "beam"); 


Buttons:

PHP-Code:

btn1.onRollOver = function() { 
    this.mcRollOver();
    myTooltip.show("history");
}; 
btn1.onRollOut = function() { 
    this.mcRollOut(); 
    myTooltip.hide("history");
}; 


Das sollte klappen!

[guz3l]

jepper! Funktioniert endlich ! *sichfreu*

aber Du sagtest doch, ich solle AdvancedTooltip.show(nameID:String):Void verwenden, naja, egal, es funktioniert ja jetzt.

Vielen vielen Dank für deine Mühe und Zeit!

Cheers!

*Edit*
Hab es gerade verstanden was du verändert hast, das ist ja das wichtigste hehehe
Nochmals Danke dir !

[janlukas]

Hallo allerseits,

ein sehr schöner TOOLTIP, sogar ich mit meinen eher anfängermäßig orientierten Flash-Kenntnissen kann mit ein bisschen Spucke und Geduld das Teil modifizieren.
Trotzdem hab ich ein Problem oder besser eine Frage. Auf der Suche durch das Forum wurde ich leider nicht fündig. Darum hier und jetzt meine Frage: Kann man in einen TT auch grundsätzlich ein Bild mit einladen und hat jemand einen TIP für mich, wenn ja, wie das geht oder wo ich nachschauen kann wie das geht?

Ich würde mich über eine Antwort riesig freuen.

Man dankt !

[janlukas]

Keiner einen Tip?

[Vampire's Party]

Hi,

kommt darauf an, was du für ein Bild meinst: Hintergrund oder im Text?

Lösung für Hintergrund:

myTooltip.setDefaults({background:"pattern"}); 

Wobei der String eine Verknüpfung in der Bibliothek sein muss. In diesem Fall wäre es "pattern".

Wenn du ein Bild im Text haben möchtest:

// Initalisieren
myTooltip.setDefaults({textHtml:true});
 
// Tooltip erstellen
myTooltip.addTooltip ("welcome", "<img src='http://link.zum/bild.jpg'> Links neben mir erscheint ein Bild");
myTooltip.show("welcome"); 

Ist ungetestet, sollte aber so funktionieren.

Gruß,
Vampire's Party