Mac OS like Dock

[Hoto]

So, jetzt mache ich doch noch mal ein Thread zu dem Thema auf. Hauptsächlich geht es hierbei um die Frage wie man sowas umsetzt.

http://eudock.jules.it/eudock2.0a/

Dies ist ein Beispiel mit JavaScript, mir geht es hier vor allem um die Darstellung, nicht um die Animationen oder Anordnung. Wie setzt man so etwas am schlausten mit PB unter Windows XP um, mit Alpha Transparenz für weiche Ränder und Schatten? Vor allem letzteres stellt für mich ein großer Stein dar, den ich nicht weggeräumt kriege. Zahlreiche Docks dieser Art zeigen aber, dass es möglich sein muss, nur wie? Mit GDI+ bin ich da bisher auch nicht weit gekommen.

[ZeHa]

Also das JavaScript-Beispiel macht auch nix mit weichen Rändern. Hier mal ein vergrößerter Screenshot:



Der Rand ist zwar weichgezeichnet, aber das hat keine Auswirkung mit der Mischungs des darunterliegenden Bildes (es gibt zwar schon einen komplett transparenten Bereich, aber keine weichen Übergänge). Das heißt, wenn Du es grafisch gesehen klug anstellst, kommst Du völlig ohne solche Dinge aus.

Ansonsten mußt Du halt schauen ob GDI+ das hergibt. Ich kenne es von früher noch so, daß man über S/W-Masken Bilder blitten konnte und somit halt eine simple Ganz-oder-gar-nicht-Transparenz hinkriegen konnte. Ob das auch gestuft geht (also mit einer Graustufen-Maske), keine Ahnung. Möglicherweise geht das genau auf die gleiche Art und Weise (da müßtest Du einfach mal ausprobieren, ob die Farbwerte korrekt miteinander verrechnet werden), oder Du mußt Dir was anderes suchen. Sprite3D in Verbindung mit PNGs wäre, sofern Du das einsetzen willst, evtl. auch noch 'ne Lösung.

[Hoto]

An der Stelle nicht, hier aber schon und das JS Beispiel sollte lediglich mein Problem verdeutlichen.

Das Problem ist, dass man mit GDI+ auch nur auf Fenstern zeichnen kann, also muss man auch erstmal das Fenster so durchsichtig kriegen, dass man mit richtiger Alpha Transparenz arbeiten kann. Ich hab lediglich eine Methode gefunden in denen das Fenster durch Einfarbtransparenz durchsichtig gemacht wird und wenn man dann mit GDI+ ein Image mit Alpha in das Fenster setzt, hat man leider das Ergebnis:



Das hab ich aber bereits im Allgemein Forum hier in einem anderen Thread gepostet. Hier gehts mir mehr darum mit welchen Mitteln man das überhaupt umsetzen sollte und ob GDI+ überhaupt die richtige Wahl dafür ist. Außerdem wollte ich meine Versuche eigentlich außen vor lassen um hier Niemanden zu sehr in eine Richtung zu lenken und dadurch andere Möglichkeiten prompt wieder untergehen.

Vielleicht hat ja Jemand anderes noch etwas mehr Kenntnisse auf dem Gebiet und weiß wie Andere sowas in anderen Programmiersprachen in Windows umgesetzt haben, denn es gibt ja schon zig solcher Docks. Leider konnte ich nichts Open Source mäßiges finden.

[Hoto]

So, ich hab soweit die Probleme beseitigt gekriegt, nun hab ich noch ein Problem bei dem ich wirklich keine Ahnung habe und zwar was die richtige Formel ist um sowas korrekt darzustellen:

http://www.dothack.com/gu/

Eine einfache Ellipse konnte ich mir von einem anderen Code abgucken, da die Objekte aber sich auch noch in der Tiefe bewegen (größer/kleiner werden) muss auch der Abstand zwischen den Elementen hinten mit dem der vorderen Elemente übereinstimmen, aktuell sieht bei mir nämlich so aus, extrem großer Abstand bei den hinteren Elementen:



Die Berechnung sieht wie folgt aus:

Code: Alles auswählen

crotation = #PI/2-0*2*#PI/IconAnz
rotationspeed = 5

Dies läuft in einer Schleife:

Code: Alles auswählen

  trotation = #PI/2-selitem*2*#PI/IconAnz
  While crotation - trotation > #PI
    crotation - #PI*2
  Wend
  While trotation - crotation > #PI
    crotation + #PI*2
  Wend
  crotation = (crotation*(rotationspeed-1)+trotation)/rotationspeed 

  For z = 0 To IconAnz-1
    y = (WHeight/4+Sin(z*2*#PI/IconAnz+crotation)*WWidth/6)+26
    x = ((WWidth/2)+Cos(z*2*#PI/IconAnz+crotation)*WWidth/2.3)-60
    
    GdipDrawImageRect(*gfx, Icon(z)\image, x-((60/260)*y/2)+30, y-((60/260)*y/2)+30, 60+((60/260)*y) , 60+((60/260)*y))
  Next

Standard Größe der Icons sind 120x120 und kleinste hinten 60x60. WWidth und WHeight sind jeweils die Masse des kompletten Fensters (800x400 aktuell).

Wäre super wenn mir da Jemand helfen könnte, würde das allein niemals hin kriegen.

[Sebastian]

Wie hast Du denn die Probleme in den Griff bekommen? Wie hast Du die Transparenz hinbekommen und die Schatten ohne Ränder?

[TomS]

@Sebastian: http://www.purebasic.fr/german/viewtopi ... highlight=

[Xaby]

@Sebastian

Auszug

Code: Alles auswählen

If OpenWindow(#MainWin,1300,200,100,200,"Maus",#PB_Window_BorderLess) And CreateGadgetList(WindowID(0))
   
  SetWindowLong_(WindowID(#MainWin),#GWL_EXSTYLE,GetWindowLong_(WindowID(#MainWin),#GWL_EXSTYLE)|524288) 
  SetLayeredWindowAttributes_(WindowID(#MainWin),RGB(255,0,255),255,1|#LWA_ALPHA) 
  StickyWindow(0,1)

Auf dieses Fenster kannst du nun ein ImageGadget packen.
Hier

Code: Alles auswählen

SetLayeredWindowAttributes_(WindowID(#MainWin),RGB(255,0,255),!!!,1|#LWA_ALPHA)

!!! = 0 bis 255 ist die Sichtbarkeit
RGB(255,0,255) gibt dieses Violett an, was nicht gezeigt werden soll.

[Hoto]

Auf die Art funktioniert aber die Alpha Transparenz nicht richtig. Damit geht nur Einfarbentransparenz.

Mit GDI+ geht das hingegen ganz gut: http://www.purebasic.fr/german/viewtopi ... 219#204219