Bonjour à tous,
Je souhaite réaliser un dégradé horizontal de couleurs arc-en-ciel (allant du rouge au rouge, en passant par le jaune, vert…). Ce dernier possède une largeur qui est choisie par l'utilisateur-final.
Pour ce faire j'aurais besoin de vos conseils, en effet :
-
Je parcours l'image, qui est vierge au début, pixel par pixel de haut en bas PUIS de gauche à droite (autrement dit je dessine une ligne verticale, puis je passe au pixel de droite et je redessine une ligne verticale, et ainsi de suite).
-
Or l'utilisateur-final peut choisir, à la création de cette image, la taille de cette dernière (et donc du dégradé, car le dégradé EST l'image).
-
Donc : la ligne verticale d'une couleur donnée (prenons le rouge de départ) n'aura pas juste une largeur de 1, mais de xxx pixels. Comment déterminer ces xxx pixels ? La solution suivante est impossible : connaissant la largeur du dégradé en pixels, et le nombre de couleurs, on peut connaître le nombre de pixels par couleurs. Elle est "impossible" car le nombre de couleurs n'est pas déterminable (enfin c'est évident, puisque c'est un dégradé…). Du coup je ne vois pas comment faire.
-
Enfin, j'ai remarqué qu'il n'y a qu'une seule composante à la fois qui est changée au fur et à mesure qu'un dégradé est fait : d'abord RED = 255, puis ensuite on modifie UNIQUEMENT GREEN (en l'augmentant), puis on modifie UNIQUEMENT RED (en le baissant), etc. Il faudrait que je trouve une fonction (une application plus précisément) qui associe au pixel-abscisse la bonne valeur à la bonne composante. Comment choisir cette composante ? Le choix de la "bonne valeur" me semble simple.
Par ailleurs, j'utilise le système RGB et le dégradé se limite aux couleurs saturées.
Voici ce que je voudrais obtenir : http://fr.flossmanuals.net/processing/les-couleurs/static/Processing-Couleurs-color_spectrum-tiff-fr-old.png
Merci beaucoup !
EDIT IMPORTANT :
Topic résolu ! Source :
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 | public void displayHorGraduation(String type) { double w = this.writable_image.getWidth(); double r = 0, g = 0, b = 0; for(int x = 0; x < this.writable_image.getWidth(); x++) { for (int y = 0; y < this.writable_image.getHeight(); y++) { if(type.equals("Blanc vers noir")) { this.writable_pixel_writer.setColor(x, y, Color.color(-x/w + 1, -x/w + 1, -x/w + 1)); } else if(type.equals("Noir vers blanc")) { this.writable_pixel_writer.setColor(x, y, Color.color(x/w, x/w, x/w)); } else if(type.equals("Polychrome")) { if(x >= 0 && x < w/6) { r = 255; g = 1530*x/w; } if(x >= 0 && x < 2*w/6) { b = 0; } if(x >= 2*w/6 && x < 3*w/6) { b = 1530*x/w - 510; } if(x >= 3*w/6 && x < 5*w/6) { b = 255; } if(x >= 5*w/6 && x <= w) { b = -1530*x/w + 1530; } if (x >= w/6 && x < 3*w/6) { g = 255; } if(x >= 3*w/6 && x < 4*w/6) { g = -1530*x/w + 1020; } if(x >= 4*w/6 && x <= w) { g = 0; } if(x >= w/6 && x < 2*w/6) { r = -1530*x/w + 510; } if(x >= 2*w/6 && x < 4*w/6) { r = 0; } if(x >= 4*w/6 && x < 5*w/6) { r = 1530*x/w - 1020; } if(x >= 5*w/6 && x <= w) { r = 255; } this.writable_pixel_writer.setColor(x, y, Color.color(r/255, g/255, b/255)); } } } } |
On trouve les équations par résolution de systèmes à deux équations. Un exemple : pour trouver l'équation 1530*x/w - 1020
, il a fallu résoudre le système suivant :
Première équation : r(4*w/6) = 0
Seconde équation : r(5*w/6) = 255
r
étant une fonction affine.
Les valeurs 0
, 255
, 4*w/6
, 5*w/6
et la nature affine de la fonction r
sont déduites de ce schéma :
https://zestedesavoir.com/forums/sujet/6688/degrade-de-couleurs/?page=2#p119928