Ãœbersicht: Coverflow-Effekt in Flash und Flex

iTunes

Der von Apple geprägte Coverflow-Effekt ist mittlerweile sehr populär. Im Folgenden ein knappes Dutzend Beispiele für Coverflow in Flash oder Flex. Größtenteils können die Quelldateien heruntergeladen werden.

DisplayShelf Component

Coverflow: Quietly Scheming

Eine ausgefeilte Komponente für Flex kommt von Ely Greenfield, Entwickler bei Adobe. Über Regler lassen sich der Winkel und die Entfernung der Bilder zum Betrachter einstellen. Die Sourcefiles können heruntergeladen werden.

„The DisplayShelf component demonstrates using a number of flex and flash concepts to provide a rich, templatable control to display a faux-3d view of a list of items. Its behavior is similar to the CoverFlow visualization added to iTunes in version 7.“

Link: Demo anschauen
Link: Tutorial: DisplayShelf Component

[ad]

Arno’s Toolbox

Coverflow: Arnos Toolbox Flash

Sehr interessantes Material gibt es bei „Arno’s Toolbox.“ Der Coverflow-Effekt ist für Flash und greift auf eine externe XML-Datei zu. Die Anwendung kann über Themes gestaltet werden. Die Quellcodes können heruntergeladen werden.

Link: Demo anschauen
Link: Effet Coverflow d’iTunes V0.2

Die nachfolgende Version (0.3) ist bereits in Arbeit, hier eine Vorschau:

Coverflow: Arnos Toolbox 0.3

Link: Demo anschauen
Link: Preview Moteur Coverflow 0.3

Weber Design Labs

Coverflow: Weber Design Labs

Ebenfalls mit XML-Support wartet das Flash-Coverflow von Weber Design Labs auf. Die Quelldateien für Flash CS3 und Flash 8 sind online.

Link: Demo anschauen
Link: Flash iTunes Cover Flow – Version 2

CoverFlow Flex Component

Coverflow Flex Component

Eine CoverFlow-Komponente zum kostenlos Download von Doug McCune für Flex.

„Here’s a Flex component (with source) that does that sweet looking CoverFlow thing (you know, the iTunes/iPhone thing to show cover art). It’s a Flex component, so you can drop it into any Flex app.“

Link: CoverFlow Flex Component
Link: Performance improvement, Flex Carousel Component, Vertical Cover Flow

Yet Another Coverflow Clone

Coverflow Flex Component

Ein weiterer Coverflow Clone heißt Yet Another Coverflow Clone“ (YACC). YACC ist in AS2 geschrieben, weshalb es bereits ab Flash Player 6 nutzbar ist. „It’s been built to be dimensions independent. That means you can use whatever size of pictures you want and embed the flash with whatever size you can think of.“ Die Assets werden über XML definiert.

Link: Yet Another Coverflow Clone

John Dyer

Coverflow: John Dyer

Ein Coverflow von John Dyer, erstellt mit Papervision 3D. Die Flashdateien für Flash CS3 können heruntergeladen werden.

„There are a million Apple Coverflow knockoffs and now there are a million and one. This one is made using Papervision3d and Tweener and includes keyboard and scrollwheel support.“

Link: Demo anschauen
Link: Yet Another Cover flow using Papervision

Flame – 3D music in ActionScript 3

Coverflow: Flame

Eine interessantse Experiment heißt Flame und verbindet den Coverflow-Effekt mit last.fm.

„So, what is it? When you start it, it asks for an artist. Type in something you like and flame will find similar artists, that you probably also will like. You can then browse the artists in a cool 3d interface using the arrow keys. „

Link: Demo anschauen
Link: Flame ActionScript 3 sources released

photoFlow

Coverflow: PhotoFlow

photoFlow ist eine kostenpflichtige Komponente für Flash. Die AS2-Version kostet $60, die AS2- und AS3-Version zusammen liegen bei 80$.

„The photoFlow Flash component displays multiple images with a stack effect, perspective and reflection. The images can be flipped by clicking on a specific image in the stack, using the supplied skinnable scrollbar, or scrolling the mousewheel. Images can be added or changed directly in the Component Inspector, through ActionScript or using an external XML file.“

Link: Demo anschauen
Link: photoFlow

Blitz Labs

Blitz Labs

Eine sehr schöne Coverflow-Animation kommt von Blitz Labs. Klickt man ein Bild an, dreht es sich auf die Rückseite und ein Video wird abspielt.

Link: Cover flow: iTunes User Interface in Papervision3D with Tweener

Werkvoll.de

Coverflow: Werkvoll

Auf werkvoll.de ist eine hübsche Coverflow-Galerie mit XML-Support von Philip Klich zu sehen.

Link: Demo anschauen
Link: Blogeintrag

32 Gedanken zu „Ãœbersicht: Coverflow-Effekt in Flash und Flex“

  6. Pingback: CoverFlow für Flash : SOLO-MEDIA.DE BLOG

  8. Ich würde gern ein CoverFlow-Tool benützen um mir PDF-Seiten anzeigen zu lassen. Dazu hätte ich dann aber gern die Möglichkeit in die ausgewählte Seite hinein zu zoomen. Kennt jemand so ein Tool?

  9. How can I add a video swf from youtube or dailymotion that automatically plays the video when image is in front?

  10. Pingback: hype.yeebase.com
  11. Pingback: Cover Flow Effekte

  12. ich habe folgendes iframe auf der foto seite:
    (java script mit weißem hintergrund! – ImageFlow)

    selig1.de/fotos.htm
    selig1.de/flow.htm

    hat leider relativ hohe ladezeiten (noch).

  14. Ja, du kannst ja einfach ein „HTML“-Contentelement in Typo3 anlegen. Dort kannst den entsprechenden Code zur Einbindung von Flash einfügen.

  15. Hallo,

    wie kann ich es machen, dass ich noch eine Grafik darüber setze und diese dann auch im Vordergrund bleibt.

    Mit Ebenen Verschieben, klappt das leider nicht.

  19. hallo,

    ich habe eine Frage an all jene, die sich mit dem Cover Flow Effect schon länger auseinander setzen.

    Ich persönlich verwende den ImageFlow von finnrudolph.de … funktioniert prächtigst. Was mir aber bei diesem (und auch bei anderen) Flow-Effekten abgeht ist irgendwie die Möglichkeit via „checkboxen“ zu definieren, welche Bilder angezeigt werden. Dass man z.B. via XML Bildern bestimmte Eigenschaften zuordnen kann (z.B. „Querformat“ und „Nachaufnahme“) und dann werden im Coverflow nur die Bilder angezeigt, die den gewählten Eigenschaften entsprechen.

    Weiß jemand von so einer Lösung?

    Vielen Dank und

    liebe Grüße aus Wien

    Andreas.

  22. Ist bei den hier gezeigten Beispielen eins dabei das die Möglichkeit bietet das Bilder nachgeladen werden, also das am Anfang beispielsweise 20 Bilder geladen werden und dann wenn die dargestellt sind nach und nach der Rest. Wenn man tatsächlich die iTunes Mediathek oder ein anderes umfangreiches Photoalbum veröffentlichen möchte kann man ja bei 1000 Bildern schon an die Grenzen geraten. Schön wäre auch wie bei einem Flashfilm in den Vollbildmodus wechseln zu können.

  23. @Herr Himbeer
    Wie sich die einzelnen Coverflows genau beim Laden verhalten, kann ich spontan nicht sagen.

    Der Vollbildmodus müsste, wenn nicht vorhanden, mit Flash programmiert werden. Ist keine große Sache, wenn man weiß wie (oder man schaut hier im Blog an entsprechender Stelle).

  24. Pingback: Fotos präsentieren in richtig schick - netztaucherbrille
  25. Pingback: Ãœbersicht der Coverflow Effekte in Flash und Flex | SEO Scout | Suchmaschinenoptimierung

  27. Hallo zusammen,
    weiss jemand wann diese Links wieder gehen
    Link: Demo anschauen
    Link: Effet Coverflow d’iTunes V0.2
    oder finde ich diese tools auch woanders

  28. Erstmal sehr schöne auswahl.

    Ich bin auch der suche nach einen Imageflow script was sich permernent dreht und wenn man mit der maus drüber geht bleibt es stehen.
    Kann mir da wer weiter helfen.

    DAnke

  30. "The last version of the coverflow was made several years ago and its still quite popular (over 700,000 downloads on just version 2). So I decided to make a new version, this new version takes advantage of the new Flash 10 3D capabilities, which is perfect for this particular use. It allows for the Flash to load faster (because its not using Papervision3D) and most important preform much faster. Now users can add a lot more items to the coverflow and still have very snappy performance."

    http://www.weberdesignlabs.com/blog/2009/12/flash-10-coverflow/

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert