Antworten zum Thema „Google Earth Effekt im Miniaturformat - Ideen?“

richterskala · 06.06.2011

tachschön,

neu wie ich ja bin in flash, hab ich auch gleich große ideen aber man wächst ja an seinen aufgaben

ich würde gern eine homepage erstellen, die aus einer einzigen großen seite besteht. auf dieser seite sind die contents wie "home", "über uns" usw. wie inseln über den gesamten bereich verteilt. nach laden der seite sieht man mittig im browser texte und illustrierungen zu "home". über ein textmenu darunter clickt man sich z.b. zu "über uns".

und nun hakts bei mir: die seite soll ja jetzt nicht wechseln, sondern content "home" zoomt so 15% aus und an einem unsichtbaren pfad gleitet man zum content "über uns" der sich dann wieder einzoomt. dort gibts dann wieder das identische textmenu um einen nächsten beliebigen content anzusteuern.

das ganze soll natürlich von jeden menupunkt zu jedem menupunkt funktionieren.

ich dachte mir nun, das über x-y-koordinaten zu realisieren. ich vermute aber mal, daß ich ohne AS da nicht weit kommen werde oder?

falls ihr eine idee habt, bitte für mich dummie in simplen worten halten (vollständige sätze sind aber ok

)

wie ichs mir vorstelle sieht man in der grafik anbei....

vielen dank und schöntach
ralph

behemoth65 · 06.06.2011

AW: Google Earth Effekt im Miniaturformat - Ideen?

Die idee ist klar, aber ohne AS meiner meinung nicht realisierbar. Du musst ja immer die Reihenfolge "Auslöser-->Aktion-->>Ergebnis" einhalten und Flsh ohne AS ist halt "nur" ein Animationsprogramm.
Aber AS ist ja nicht sooooo schwierig, wenn man sich schon mal mit den Grundlagen von Programmierung beschäftigt hat. Erfahrungen z.B. in Javascript sind sehr hilfreich um das "Funktionieren" der Sprache zu verinnerlichen.
Rein theoretisch könntest Du das vielleicht auch "zusammenklicken" mit ganz vielen Movieclips und Tweens aber das würde wohl ziemlich unübersichtlich am Ende und wohl auch nicht genau das was Dir vorschwebt.

richterskala · 06.06.2011

AW: Google Earth Effekt im Miniaturformat - Ideen?

leider sind mir auch die grundlagen der programmierung nicht so wirklich geläufig... ich bin halt mehr gestalter als programmierer

in nichtprogrammiererdeutsch stelle ich mir das so vor:
on click "über uns" go über pfad 1 to koordinate x / y und stop

so in der art jedenfalls

ad86 · 06.06.2011

AW: Google Earth Effekt im Miniaturformat - Ideen?

Hi,

ich versuche mal eine Lösung Dir aufzuzeigen. Die macht aber viel Arbeit.

Du erstellst Deine drei Menüpunkte (Home, About, Contact, (ich mach es in englisch, ist weniger zu schreiben).

Jeder Menüpunkt sollte ein eigener MC und auf einer eigenen Ebene sein.
Jeder der Menüpunkte hat MCs oder Btns mit den Namen home, about, contact.
In der Hauptzeitleiste im ersten Frame arrangierst Du die Menüpunkte so, dass Home sichtbar ist. Gib dem Home-MC den Namen home_mc, About-MC about_mc, Contact-MC contact_mc:
Frame 1: Erstes Schlüsselbild und home_mc sollte sichtbar sein
10 Frames weiter (10): Neues Schlüsselbild und about_mc sollte sichtbar sein.
10 Frames weiter(20): Neues Schlüsselbild und contact_mc sollte sichtbar sein.
10 Frames weiter(30): Neues Schlüsselbild und home_mc sollte sichtbar sein.
10 Frames weiter(40): Neues Schlüsselbild und contact_mc sollte sichtbar sein.
10 Frames weiter(50): Neues Schlüsselbild und about_mc sollte sichtbar sein.
10 Frames weiter(60): Neues Schlüsselbild und home_mc sollte sichtbar sein.

Hinweis: Die Menüpunkte sind doppelt, da es eine Hin-Animation und eine Weg-Animation gibt:
Home (1) -> About(10) ->Contact (20) -> Home (30) -> Contact (40) -> About (50) ->Home (60)

Zwischen den Frames klickst Du auf die einzelnen Ebenen und wählst Tween aus. Müsste glaub ich Form-Tween sein. (Ich hab gerade kein Flash). Somit hast Du schonmal eine (geradlinige) Animation.
Z.b. bei Frame 5 kannst Du ein Schlüsselbild im Tween erstellen und den MC etwas verschieben, so bekommst Du dann auch eine Kurve.

Nun zum Scripten:
Erstelle eine neue Ebene as3. An jedem der oben genannten Frames erstellst Du ein neues Schlüsselbild und schreibst:

Code:

stop(); //steht in jedem Frame
home_mc.about.addEventListener(MouseEvent.CLICK, gotoAbout);//Abhaengig vom Menupunkt (home_mc, about_mc, contact_mc)
home_mc.contact.addEventListener(MouseEvent.CLICK, gotoContact);//Abhaengig vom Menupunkt (home_mc, about_mc, contact_mc)

function gotoAbout(e:MouseEvent):void{
gotoAndPlay(1); //Abhängig von welchem Punkt
} 
function gotoContact(e:MouseEvent):void{
gotoAndPlay(30); //Abhängig von welchem Punkt
}

Die Funktionen gotoAbout, gotoContact, gotoHome ändern sich natürlich immer (es sind immer 2 auf einem Frame der as3-Ebene)
Frame1 (Home): (siehe Code oben) gotoAbout, gotoContact
Frame 10 (About): gotoHome, gotoContact
Frame 20 (Contact): gotoHome, gotoAbout
Frame 30 (Home): gotoAbout, gotoContact
Frame 40 (Contact): gotoHome, gotoAbout
Frame 50 (About): gotoHome,gotoContact
Frame 60 (Home): gotoAbout, gotoContact

ACHTUNG: Überleg Dir gut, wie lange die Animationen zwischen den Menüpunkten sein sollen. Ich hab 10 genommen, nur weil es einfach ist. Es hängt natürlich auch von deiner Framerate ab. Die Länge der Animation zu ändern ist Arbeit, die man sich ersparen kann.

Ich hoffe, Du hast verstanden was ich mit dem Text meinte und ich konnte Dir helfen. Solltest Du mehr als drei Menüpunkte haben: Vergiss diese Methode. Das ist dann zu viel Arbeit.

EDIT: Das mit dem Zoomen müsste auch per Tween gehen, z.B. für Home->About
Frame 1: Normale Größe
Frame 3: Kleinere Ansicht
Frame 8: Kleinere Ansicht aber verschoben
Frame 10: Normale Größe

Mfg ad86

richterskala · 06.06.2011

AW: Google Earth Effekt im Miniaturformat - Ideen?

wow vielen dank für deine detaillierte beschreibung *verbeug*

stimmt, sieht nach ein wenig arbeit aus und ja, es gibt schon noch ein paar menupunkte mehr aber ich versuch das einfach mal. ne quick and dirty methode gibts da sicher sowieso nicht.

falls sie aber jemand in der schublade hat, gern her damit

ich bin dann mal an der werkbank bis auf weiteres ^^

ralph

ad86 · 06.06.2011

AW: Google Earth Effekt im Miniaturformat - Ideen?

Hi,

es gibt noch eine Möglichkeit (mir gerade eingefallen), da nutze ich aber keine krummen Pfade, sondern geradlinige, und es ist ein bisschen Frickelarbeit.

Du positionierst Deine Menupünkte auf der Bühne (auf der gesamten Arbeitsfläche, nicht nur den sichtbaren Bereich. Markierst alles und konvertierst es in einen ganz großen MC (namentlich main_mc)

Nimm Stift + Zettel.
Positioniere den großen MC immer so, dass ein Menüpunkt sichtbar ist. Notier Dir x und y Position und den Menüpunkt. Gehe dann zum nächsten Menüpunkt.

Zum Script (Es gibt nur einen Frame) und ich nutze Dein Beispiel mit den drei
Menüpunkten.

Code:

stop();
var zoomXTween:Tween;
var zoomYTween:Tween;//Kann sein das unten scale reicht (und nicht scaleX, scaleY), dann würde ein zoomTween reichen
var moveXTween:Tween;
var moveYTween:Tween;
var timer:Timer;
//Fuer alle Deine Links in den einzelen Menupunkten:
main_mc.home_mc.about.addEventListener (MouseEvent.CLICK, gotoAbout);
main_mc.home_mc.contact.addEventListener (MouseEvent.CLICK, gotoContact);

main_mc.about_mc.home.addEventListener (MouseEvent.CLICK, gotoHome);
main_mc.about_mc.contact.addEventListener (MouseEvent.CLICK, gotoContact);

main_mc.contact_mc.about.addEventListener (MouseEvent.CLICK, gotoAbout);
main_mc.contact_mc.home.addEventListener (MouseEvent.CLICK, gotoHome);

function gotoAbout(e:MouseEvent):void{
//Wenn zum Menupunkt About, nutze die aufgeschriebenen pX und pY
createTween(100, 100);
}

function gotoHome(e:MouseEvent):void{
//Wenn zum Menupunkt Home, nutze die aufgeschriebenen pX und pY
createTween(110, 110);
}

function gotoContact(e:MouseEvent):void{
//Wenn zum Menupunkt Contact, nutze die aufgeschriebenen pX und pY
createTween(120, 120);
}

function createTween(pX:Number, pY:Number):void{
//0.4 Sekunden wenn true: True bedeutete nutze Sekunden, sonst Frames
zoomXTween= new Tween(main_mc, "scaleX", None.easeInOut, main_mc.scaleX, 0.7, 0.4, true);
zoomYTween= new Tween(main_mc, "scaleY", None.easeInOut, main_mc.scaleY, 0.7, 0.4, true);
moveXTween= new Tween(main_mc, "x", None.easeInOut, main_mc.x, pX, 2, true);
moveXTween= new Tween(main_mc, "y", None.easeInOut, main_mc.y, pY, 2, true);
timer = new Timer(1500, 1);//Timer in 1500 Millisekunden, Aufruf einmal
timer.addEventListener (TimerEvent.TIMER, zoomInHandler);
timer.start();
}

//Zoom in
function zoomInHandler(e:TimerEvent):void{
zoomXTween= new Tween(main_mc, "scaleX", None.easeInOut, main_mc.scaleX, 1, 0.4, true);
zoomYTween= new Tween(main_mc, "scaleY", None.easeInOut, main_mc.scaleY, 1, 0.4, true);
}

Solte auch funktionieren. Falls import-Anweisungen fehlen:
import flash.utils.Timer;
import fl.transitions.Tween;
import fl.transition.easing.None;

Ich hoffe, es funktioniert so, denn ich hab dies nicht getestet.

Nebenbei, Deine Internetseite in der Signatur: Klicke ich auf der Seite einen Menüpunkt an z.B. Vita, verschwinden alle Menüpunkte, und ich sehe nichts passendes zum angeklickten Menüpunkt. Sollte wohl nicht so sein. Getestet mit Safari und Chrome.

MFG ad86

richterskala · 06.06.2011

AW: Google Earth Effekt im Miniaturformat - Ideen?

hey das zweite beispiel ist ja noch viel schlanker, super. probier ich mal dieses zuerst. 1000 dank nochmals für deine mühe, ich bin schon sehr gespannt auf das ergebnis

und was meine seite angeht.... genau deshalb bin ich ja jetzt dran, endlich mal was neues zu basteln.... die ist von 2004 wie man ja sieht. war damals javascript und html, daß ich mir aus lauter schnipseln ausm netz gesucht habe (da war ich verdammt stolz drauf als nichtprogrammierer

). auf firefox und explorer gings/gehts. chrome gabs damals noch gar nicht und safari... bin ich mir nicht sicher ob der da schon existierte ^^

das ding ist so alt, das benutzt noch framesets..... die interessiert chrome & co. wohl nicht so wirklich :lol:

beste grüße
ralph