Algorithmus für die Farbauswahl

Question

Ich suche den grundlegenden Algorithmus hinter einem Farbwähler so zu verstehen:

Ich mag würde implementieren so etwas wie dieses von Grund auf, wollen aber die Basis-Algorithmus verstehen zuerst.

Answer 1

Ich glaube, dass dies dem Farbton-Sättigungs-Helligkeits-Modell folgen soll (oder ähnlichem wie dem Farbton-Sättigungs-Wert).

Mit HSB ist es normalerweise am einfachsten, Farben als Zylinder zu denken. Der Farbton repräsentiert eine Rotation um den Kreis. Sättigung ist die Position entlang der Achse des Zylinders und Helligkeit ist die Entfernung von der Mitte nach außen.

Wenn man die Dinge auf diese Weise betrachtet, stellt das Band auf der rechten Seite den Farbton dar, also wenn wir es bewegen, wählen wir eine Rotation um den Zylinder.

Der Platz auf der linken Seite ist ein Stück dieses Zylinders von der Mitte nach außen. Die Y-Achse dieses Quadrats repräsentiert Helligkeit/Helligkeit. Bei 0 Helligkeit (unten) werden wir schwarz, egal woanders.

Die X-Achse des Quadrats steht für die Sättigung. Ganz links ist 0 Sättigung, also ganz am Rand haben wir nur ein Band von reinen Grautönen, die von reinem Schwarz an der Unterseite zu reinem Weiß an der Spitze gehen. Wenn wir uns nach rechts bewegen, nimmt die Sättigung zu, bis wir auf die rechte Seite kommen, wo wir reine (in diesem Fall) Rottöne haben, die von minimaler Helligkeit unten zu maximaler Helligkeit an der Spitze variieren.

Beachten Sie, dass diese (im Wesentlichen alle zylindrischen Farbmodelle) einige ... Besonderheiten haben, wie sie Farbe darstellen. Beispiel: Bei einer Helligkeit von 0 werden die anderen beiden Eingaben (Farbton und Sättigung) bedeutungslos, da Sie unabhängig von ihnen reines Schwarz erhalten. Bei maximaler Helligkeit erhalten Sie reines Weiß, unabhängig von den Werten der anderen beiden.

Wenn Sie dies von Grund auf neu kodieren, würde ich persönlich in Betracht ziehen, ein bikonisches Modell zu implementieren. Statt eines Zylinders werden Farben als Doppelkegel mit einem Radius von 0 an jedem Ende und einem maximalen Radius in der Mitte behandelt. Bei minimaler oder maximaler Helligkeit haben wir einen Radius von 0, was genau die Tatsache widerspiegelt, dass reines Schwarz oder reines Weiß keine Farbkomponente hat. Ungefähr auf halbem Wege zwischen diesen beiden Extremen haben wir die Möglichkeit für maximale Sättigung.

Der Hauptunterschied zu einem bikonischen Modell wäre, dass auf der linken Seite anstelle eines Quadrats ein Dreieck entsteht. Ähnlich wie das Quadrat hätte die linke Seite reine Grautöne, die von reinem Schwarz an der Unterseite bis zu reinem Weiß an der Spitze reichen. Wenn wir nach rechts gehen, haben wir bei dieser Helligkeit unterschiedliche Sättigungsgrade, wobei die maximale Sättigung genau in der Mitte zwischen den beiden liegt. Bei niedrigeren und höheren Helligkeitsstufen wäre immer weniger Sättigung verfügbar, bis wir zu den Extremen kommen, wo die Sättigung immer Null wäre.

Am Boden haben wir eine Helligkeit von Null, so dass die einzige Farbe, die Sie auswählen können, schwarz ist. Ganz oben ist die einzige Farbe, die Sie auswählen können, weiß. Auf halbem Weg zwischen den beiden können Sie die gesättigtste Farbe in dem gewählten Winkel auswählen (in diesem speziellen Fall rein rot). Wenn Sie näher an den oberen/unteren Rand kommen, können Sie eine höhere/niedrigere Helligkeit erzielen und die maximal verfügbare Sättigung wird reduziert.

Genau wie die zylindrischen Modelle, müssen Sie auch eine Möglichkeit, den Farbton zu wählen. Persönlich würde ich es auf der linken Seite anstelle der rechten setzen, aber vielleicht bin ich es nur. Ich zeichne es auch als einen Kreis, der die zusammengemischten Farben zeigt und eine Linie hat, die der Benutzer zu einem gewählten Winkel auf dem Kreis zieht. Zumindest meiner Meinung nach wäre dies weniger verwirrend. Die Schwäche besteht darin, dass ein Kreis offensichtlich mehr Platz auf dem Bildschirm einnimmt als ein Rechteck (aber seien wir ehrlich: 640x480-Displays sind nicht mehr allzu häufig, also ist das kein großes Problem).