[Projekt] CoverFlow mit Gr32

[alleinherrscher]

Guten Abend @ all!

Hab so zum Scherz neben dem Fussball Spiel ein kleines CoverFlow Programm geschrieben, das auf der GR32 Library basiert. Ist ziemlich einfach zusammengeschustert, aber ich wollte einfach mal gucken, ob es in einer halbwegs akzeptablen Geschwindigkeit auch ohne OpenGL machbar ist.

Vielleicht hat ja wer Interesse an dem Projekt, deswegen lade ichs mal hoch... Mal sehen, ob ich noch Reflexionen einbaue... Wenn ihr wollt, könnt ihr aber auch gerne weiter dran rumschreiben und das ergebnis hier posten.

Viele Grüße und schönen Abend,
Euer Alleinherrscher

//edit: Screenshot angehängt

[toms]

Hallo, schaut gut aus! :thumb:

[alleinherrscher]

So, habe mal Reflextionen eingebaut...

[Larsi]

Hi,

kann mir jemand sagen wie ich mehrere Bilder laden kann? Eins wird auf die Dauer ziemlich langweilig^^.

[alleinherrscher]

Also bis jetzt besteht das Programm nur aus einer procedure, die ein Bild perspektivisch richtig darstellt:

Delphi-Quellcode:

procedure PaintCover(DestBitmap:TBitmap32;
                     x,y,width,height:integer;
                     perspectiv:single;
                     angle:integer;
                     Reflextion:single;
                     Alpha:integer;
                     picture:TBitmap);

Dieser Procedure kannst du ein beliebiges TBitmap übergeben, was du vorher aus einer Datei eingeladen hast.
Weiter hab ich das Projekt leider noch nicht programmiert, da ich grade aufgrund des Studiums nicht sehr viel Zeit habe.

//edit hier noch eine Version, mit meheren Covers (man müsste nur noch verschiedene Bilder einladen), wo man sieht, wie es einmal werden soll...

[Mikescher]

Zitat:

0,4 ist kein gültiger Gleitkommawert

Cooles Programm aber änderer das bitte :zwinker:

Gruß Mikescher

Edit:

Bei Winkel steht 0-90, aber gib mal 90 ein :zwinker:

[alleinherrscher]

Hey, Mikescher danke für die Infos! Aber das ist doch nur ein Testprogramm um ein bisschen dran zu spielen. Mit meinen Windowseinstellungen muss da 0,4 stehen, wenn du andere einstellungen verwendest, setz einfach ein 0.4 hier. Und bei 90 Grad gibts ne Division durch null (cos=0)...aber das sind doch nur Kleinigkeiten. Beide Einstellungen (0,4 und 90 Grad werden später einmal vom Programm fest definiert (siehe iTunes) weshalb hier keine Benutzereingabe erforderlich ist...

[Mikescher]

Sollte ja auch keine große Kritik werden

--> Nur ein kleiner Hinweis.

Aber ich bin von deinem Coverflow-Programm echt beindruckt, sieht echt schon gut aus :thumb:

[alleinherrscher]

Danke, das freut mich sehr... übrigens, wenn du 90 Grad als Winkel eingibst, stehen die Cover ja praktisch genau senkrecht zur Betrachterebene, d.h. du kannst einfach folgende PaintCover Procedure verwenden, dann gibts keine Division durch null mehr:

Delphi-Quellcode:

procedure PaintCover(DestBitmap:TBitmap32; x,y,width,height:integer; perspectiv:single;angle:integer; Abdunklung:integer;Alpha:integer; picture:TBitmap32);
var lo,lu,ro,ru:TPoint;
    mo,mu:extended;
    i,j:integer;
    dummy:integer;
    color:tcolor32;
    reflextionlength:integer;
    Points:TArrayOfFixedPoint;
    poly:tPolygon32;
begin


//vier Eckpunkte des Covers berechnen:

lo.x:=x;
lo.Y:=y;
lu.X:=x;
lu.Y:=y+height;
ru.x:=round(lu.x+width*cos(abs(angle)/360*2*Pi));
ru.y:=round(lu.y-perspectiv*height/2*sin(abs(angle)/360*2*Pi));
ro.X:=ru.x;
ro.Y:=round(ru.y-height+perspectiv*height*sin(abs(angle)/360*2*Pi));

if angle<0 then
begin
  dummy:=ro.y;
  ro.y:=lo.y;
  lo.y:=dummy;
  dummy:=ru.y;
  ru.y:=lu.y;
  lu.y:=dummy;
  dummy:=(width-(ro.x-lo.x));
  lo.x:=lo.x+dummy;
  lu.x:=lu.X+dummy;
  ro.x:=ro.X+dummy;
  ru.x:=ru.x+dummy;
end;

//Steigung der oberen und unteren Kante berechnen:


if ((ro.x-lo.X)=0) or ((ru.x-lu.x)=0)  then exit; //Cover stehen senkrecht zum Betrachter

  mo:=-(ro.Y-lo.Y)/(ro.x-lo.X);
  mu:=-(ru.Y-lu.Y)/(ru.x-lu.x);


//Bild perspektivisch zeichnen:
DestBitmap.BeginUpdate;

for i:=0 to (ro.X-lo.x) do
 for j:=round(-i*mo) to round((lu.Y-lo.y)+i*mo) do
   begin
     if not (lo.x+i>DestBitmap.Width-1) and not (lo.y+j>DestBitmap.Height-1) then
       if not (lo.x+i<0) and not (lo.y+j<0) then
         begin
          color:=picture.Pixels[round(picture.Width/(ro.x-lo.X)*i), round(picture.Height/((lu.Y-lo.y)+2*i*mo)*(j+i*mo))];
          TColor32Entry(color).A := alpha;
          DestBitmap.SetPixelT(lo.X+i,lo.Y+j,color);
         end;
   end;
  
 //Reflextion berechnen:

for i:=0 to (ro.X-lo.x) do
 begin
  ReflextionLength:=round(((lu.y-lo.y)+(mo*i)));
  if ReflextionLength>0 then
     for j:= 0 to ReflextionLength do
       begin
        if not (lo.x+i>DestBitmap.Width-1) and not (lu.Y+round(mo*i)+j>DestBitmap.Height-1) then
         if not (lo.x+i<0) and not (lu.Y+round(mo*i)+j<0) then
           begin
             color:=DestBitmap.Pixel[lo.X+i,lu.Y+round(mo*i)-j];
             color:=GR32_Blend.Lighten(color,round(-Abdunklung)); //Reflextion ist verdunkeltes und gespiegeltes Original
             //TColor32Entry(color).A := round(alpha*(1-1/ReflextionLength*j)); //Transparente Reflextionen mit AlphaBlending
             DestBitmap.SetPixelT(lo.X+i,lu.Y+round(mo*i)+j,color); 
           end;
       end;
 end;



//Rechteck zeichnen:

  poly:=TPolygon32.create;
  poly.Add(fixedpoint(lo.x,lo.Y));
  poly.Add(fixedpoint(lu.x,lu.y));
  poly.Add(fixedpoint(ru.x,ru.y));
  poly.Add(fixedpoint(ro.x,ro.y));
  poly.AntialiasMode:=am32times;  //32faches Antialiasing bremst die Darstellung und kann auch deaktiviert werden
  poly.Antialiased:=true;
  poly.Closed:=true;
  poly.DrawEdge(DestBitmap,Color32(20,20,20,255));

  freeandnil(poly);



DestBitmap.EndUpdate;

end;

Wenn jemand lust hat, ein bisschen weiter dran zu schreiben, fänd ich das sehr cool!

Grüße und schönes Fussball WE,

Euer Alleinherrscher

[edit=Matze]Leerzeichen eingefügt, da ein horizontaler Scrollbalken erzeugt wurde. MfG, Matze[/edit]

[dominikkv]

na, wie findet ihr das...

[alleinherrscher]

Sieht sehr sehr geil aus,dominikkv!


Ich hab ja vor, dass man da eine kleine Komponente draus macht, das man sowas hat wie

Coverflow.AddCover(TBitmap, Index);
Coverflow.ScrollNext;
Coverflow.ScrollPrev;
Coverflow.Goto(Index);

usw...


Kannst du den Source mitposten, das wäre echt super ;)

Viele Grüße,
Michael

PS: Die Cover, die ihren Winkel nicht ändern, während sie sich bewegen, zeichnest du die auch mit der PaintCover Procedure? Wenn ja, könnte man da die Geschwindigkeit verbessern, falls man diese Cover nur einmal mit PaintCover erstellt und dann zwischenspeichert, damit nicht jedesmal so viele Pixel einzeln berechnet werden, das bremst ungemein...

[dominikkv]

Zitat:

Zitat von alleinherrscher

Sieht sehr sehr geil aus,dominikkv!

thx :mrgreen:
aber das meiste hast ja du gemacht

Zitat:

Zitat von alleinherrscher

Ich hab ja vor, dass man da eine kleine Komponente draus macht, das man sowas hat wie

Coverflow.AddCover(TBitmap, Index);
Coverflow.ScrollNext;
Coverflow.ScrollPrev;
Coverflow.Goto(Index);

usw...

hab ich schon mal angefangen, kannst gerne weitermachen :cheers:

Zitat:

Zitat von alleinherrscher

Kannst du den Source mitposten, das wäre echt super ;)

ok, ist eigentlich nur ne Unit. Benutzen kannst du die Klasse so:

Delphi-Quellcode:

  
var
  CoverFlow: TCoverflow;

// ----

  Coverflow := TCoverflow.Create(MyImage32);
  Coverflow.AddCover('6m.bmp');
  Coverflow.AddCover('3m.bmp');
  // usw
  Coverflow.Init;

// ----

  Coverflow.Next; 

// ----

  Coverflow.Previous;

AddCover ist überladen und erwartet entweder ein Bitmap32 oder ein Pfad zum nen .bmp oder .jpg

[alleinherrscher]

Super!!! Danke dir!!!

Ich werde es mir am Wochenende mal genau ansehen und evtl etwas weiterschreiben, wäre doch gelacht wenn wir Apple keine Konkurrenz machen könnten ;)

//edit ich konne es nicht lassen und habs mir direkt angesehen :D Richtig professionell und nicht so rumgedoktort wie meins! Großes Lob!

[Florian H]

Was jetzt eigentlich nur noch fehlt ist eine schnell-Blätter-Funktion, wie sie Apple auch hat: wenn ich ganz schnell durchblättere, soll er nicht mehr jedes Cover anzeigen sondern direkt nur noch durch den Stappel scollen ...

[FBrust]

Hallo,

sieht wirklich sehr gut aus, eine Frage habe ich: Muss man alle Cover vor dem Init laden oder geht das dynamisch, d. h. dass Cover, die nicht angezeigt werden, wieder entladen werden können?


Gruß
Frank

[alleinherrscher]

Zitat:

Zitat von FBrust

Hallo,

sieht wirklich sehr gut aus, eine Frage habe ich: Muss man alle Cover vor dem Init laden oder geht das dynamisch, d. h. dass Cover, die nicht angezeigt werden, wieder entladen werden können?


Gruß
Frank

Momentan müssen alle Cover zunächst geladen werden. Dies stellt ein Problem dar, wenn man beispielsweise Cover für 4000 Songs läd. Hier muss noch ein bisschen optimiert werden. Die Frage ist, wie man das am besten anstellt, da die Cover ja später einmal aus den mp3 Dateien gelanden werden sollen. D.h. man müsste evtl die Mp3 files in AddCover übergeben, oder hat jemand ne bessere Idee?

Zitat:

Zitat von Florian H

Was jetzt eigentlich nur noch fehlt ist eine schnell-Blätter-Funktion, wie sie Apple auch hat: wenn ich ganz schnell durchblättere, soll er nicht mehr jedes Cover anzeigen sondern direkt nur noch durch den Stappel scollen ...

Jo, stimmt. Zunächst müssen wir aber die Geschwindigkeit etwas optimieren. Zur Zeit werden alle sichtbaren Cover pixelweise in jedem animationsschritt neu erzeugt. Cover, die ihren Winkel zum betrachter nicht ändern, sollten aber am besten nur einmal berechnet und dann zwischengespeichert werden, um Rechenzeit zu sparen. Anschließend würde auch die schnell-Blätter funktion besser aussehen (aufgrund von höherer Geschwindigkeit)!

(Allein die Zeit fehlt momentan)

Grüße, Michael

//edit: Schon bemerkt? Wir bekommen Konkurrenz hier im Forum ;) : http://www.delphipraxis.net/internal...t.php?t=137742

[FBrust]

Hi,

also bisher finde ich die Lösung, dass die Cover aus den entsprechenden Bild-Dateien geladen werden, nicht schlecht.

Nur mal ins Blaue hineingedacht: Könnte man eine Eigenschaft "MaxCovers" hinterlegen, die angibt, wieviele Cover im Speicher gehalten werden sollen?

Weiter: Könnte man die Coverpfade in eine Art Liste laden, die bei Next und Previous verwaltet wird, d. h. bei Next wird ein Cover ans Ende der Liste nachgeladen, während das erste Cover in der Liste aus dem speicher entfernt wird und das zweite Cover an dessen Stelle rückt, bei Previous wäre es dann genau umgekehrt.


Hoffe, ich hab nicht allzu wirr dahergeredet :)


Gruß
Frank

[axellang]

Hallo,

nachdem ich mir die beide CoverFlow's angesehen habe, ergo die hier und auch die TPatternMotion, möchte ich euch eine andere Variante vorstellen und zwar "FlyingCow". Geschrieben wurde es von Matías Andrés Moreno und wurde von mir für D2007 angepasst. Diese CoverFlow Implementierung, erlaubt das anzeigen von Bildern, Ordnern, abspielen von Videos, PDF's und vieles mehr. Dass viele mehr, muss selbst implementiert werden. Lädt sehr schnell und ist extrem gut erweiterbar.

Einen weitere CoverFlow App. auf der Basis von FlyingCow gibt es hier: coverflow-example-using-delphi.


Die PDF Binaries habe ich aus dem Paket (RAR) entfernt, können aber von der Projektseite, siehe readme.txt, heruntergeladen werden.

Im Anhang ist der Source + Binaries, ein MusicPlayer und ein universal Viewer mit CoverFlow. Also viel Spaß beim testen.

Grüsse

Axel Lang

[alleinherrscher]

Zitat:

Zitat von FBrust

Hi,

also bisher finde ich die Lösung, dass die Cover aus den entsprechenden Bild-Dateien geladen werden, nicht schlecht.

Nur mal ins Blaue hineingedacht: Könnte man eine Eigenschaft "MaxCovers" hinterlegen, die angibt, wieviele Cover im Speicher gehalten werden sollen?

Weiter: Könnte man die Coverpfade in eine Art Liste laden, die bei Next und Previous verwaltet wird, d. h. bei Next wird ein Cover ans Ende der Liste nachgeladen, während das erste Cover in der Liste aus dem speicher entfernt wird und das zweite Cover an dessen Stelle rückt, bei Previous wäre es dann genau umgekehrt.


Hoffe, ich hab nicht allzu wirr dahergeredet :)


Gruß
Frank

Jup, das is schon genau richtig, nur was ich oben meinte ist: wir müssen bedenken, dass die Cover ja nicht als Bilddatei auf der Festplatte vorliegen, sondern in den mp3's gespeichert sind. Aber gut, dann macht man halt ne variante dass die mp3 anstatt die bmp oder jpg Dateien mit Pfad übergeben werden. Sollte nicht das Problem sein. Habe irgendwo noch nen Codeschnipsel rumliegen, wie man die Cover aus einem mp3 laden kann...

[Larsi]

Also ganz großes Lob erstmal. Darf ich das auch in meinem eigenen Programm (natrülich mit Verweis auf euch/dich) verwenden?

[alleinherrscher]

@Larsi: Also falls du unsere Unit meinst...das Programm darf natürlich jeder verwenden...Über Namensnennung und evtl. fertiges Programm würd ich mich sehr freuen. Realname gibts per PN.

Grüße an alle!!!

PS: Aber wie gesagt: Die Coverdarstellung muss noch ein bisschen geschwindigkeitsoptimiert werden...kümmere mich bald mal darum, so in den nächsten 2-3 Wochen.

[Larsi]

Also irgendwie kann ich das ganze nicht richtig verwenden. Wenn ich über ein Package die Unit UCoverflow.pas installier kommt eine Meldung dass irgendein Package installiert ist. Wenn ich jetzt aber:

Delphi-Quellcode:

CoverFlow: TCoverflow;

Bei den Variablen oben in der Form eingebe kommt folgende Fehlermeldung:

Zitat:

[DCC Fehler] Unit16.pas(22): E2003 Undefinierter Bezeichner: 'TCoverflow'

Was muss ich denn noch tun damit die komponente verwendet wird. Soll die eigentlich auch irgendwo in der Kompo Leiste sein? Benutzte Delphi 2007 Pro.

MFG Lars Wiltfang

[alleinherrscher]

Puh, ka...warum bindest du die Unit nicht einfach über uses ein, ohne ein package zu machen???

[Larsi]

Ka. So gehts :)

[Larsi]

Gibts ne möglichkeit die Größe der Bilder zu verändern?

[alleinherrscher]

das sind momentan konstanten am Anfang der Unit, aber das sollte ja kein Problem sein, ne kurze procedure zu schreiben, um die CoverWidth und CoverHeight einzustellen...

Delphi-Quellcode:

const
  MaxWinkel = 75;
  Breitenunterschied = 90;
  CoverWidht = 200;
  CoverHeight = 200;
  Epsilon = 0.1;

[Larsi]

Ich habe nochmal ne Frage: Wie kann ich zum Beispiel zu Bild 13 gehen?

[alleinherrscher]

Was genau meinst du? Mehrere Bilder "überspringen"? Momentan noch überhaupt nicht, soweit ich weiß. Wie gesagt, die Unit ist noch nicht fertig ;)

[Larsi]

Also nicht überspringen sondern bei zwanzig Bilder halt das 13. anzeigen ohne irgendeinen Effekt oder so. Kannst du mir bitte eine Funktion schreiben, die die Größe ändert, hab keine Ahung wie ich das in ne prozedure reinkrieg.