Author Topic: Gradients!  (Read 3312 times)

0 Members and 1 Guest are viewing this topic.

Offline loudar

  • Newbie
  • Posts: 73
  • improve it bit by bit.
    • View Profile
Gradients!
« on: August 13, 2020, 06:55:20 am »
Hey folks, wrote a little program to make some cool gradients:

Code: QB64: [Select]
  1. 'GRADIENTS
  2. 'by Loudar
  3. DIM SHARED maxgradients
  4. DIM SHARED maxcolors
  5. maxgradients = 20
  6. maxcolors = 20 'per gradient
  7. DIM SHARED gcol&(maxgradients, maxcolors) 'saves color in gradient
  8. DIM SHARED gpos(maxgradients, maxcolors) 'saves position of color in gradient
  9. DIM SHARED maxgcol&(maxgradients) 'saves maximum amount of colors in gradients
  10.  
  11. SCREEN _NEWIMAGE(500, 500, 32)
  12.  
  13. 'test gradient 1
  14. newgcolor 1, 1, 0, colour&("white")
  15. newgcolor 1, 2, 20, colour&("red")
  16. newgcolor 1, 3, 100, colour&("blue")
  17. newgradient 1, 3
  18. drawgradient 1, 0, 500, 0, 50, "h"
  19.  
  20. 'test gradient 2
  21. newgcolor 2, 1, 0, colour&("green")
  22. newgcolor 2, 2, 20, _RGBA(249, 105, 255, 255)
  23. newgcolor 2, 3, 40, _RGBA(127, 255, 127, 255)
  24. newgcolor 2, 4, 60, _RGBA(194, 0, 188, 255)
  25. newgcolor 2, 5, 80, _RGBA(0, 255, 255, 255)
  26. newgcolor 2, 6, 100, colour&("white")
  27. newgradient 2, 6
  28. drawgradient 2, 0, 500, 50, 100, "h"
  29.  
  30. 'test gradient 3
  31. newgcolor 3, 1, 0, _RGBA(255, 172, 0, 255)
  32. newgcolor 3, 2, 50, _RGBA(255, 44, 83, 255)
  33. newgcolor 3, 3, 100, _RGBA(100, 155, 255, 255)
  34. newgradient 3, 3
  35. drawgradient 3, 0, 500, 100, 150, "v"
  36.  
  37.  
  38. '--------------------------------------------------------------------------------------------
  39.  
  40. SUB newgcolor (gradient, gcolor, gpos, col&)
  41.     IF gcolor > 0 AND gcolor <= maxcolors THEN
  42.         gcol&(gradient, gcolor) = col&
  43.         gpos(gradient, gcolor) = gpos
  44.     END IF
  45.  
  46. SUB newgradient (gradient, maxgrcolors)
  47.     IF gradient > 0 AND gradient <= maxgradients AND maxgrcolors > 0 AND maxgrcolors <= maxcolors THEN
  48.         maxgcol&(gradient) = maxgrcolors
  49.     END IF
  50.  
  51. FUNCTION gradientcolor& (gradient, grposition)
  52.     IF maxgcol&(gradient) > 0 THEN
  53.         grcolor = 0: DO: grcolor = grcolor + 1
  54.             IF grposition = gpos(gradient, grcolor) THEN
  55.                 gradientcolor& = gcol&(gradient, grcolor)
  56.             ELSE
  57.                 IF grcolor < maxgcol&(gradient) THEN
  58.                     IF grposition > gpos(gradient, grcolor) AND grposition < gpos(gradient, grcolor + 1) THEN
  59.                         r1 = _RED(gcol&(gradient, grcolor))
  60.                         g1 = _GREEN(gcol&(gradient, grcolor))
  61.                         b1 = _BLUE(gcol&(gradient, grcolor))
  62.                         a1 = _ALPHA(gcol&(gradient, grcolor))
  63.                         r2 = _RED(gcol&(gradient, grcolor + 1))
  64.                         g2 = _GREEN(gcol&(gradient, grcolor + 1))
  65.                         b2 = _BLUE(gcol&(gradient, grcolor + 1))
  66.                         a2 = _ALPHA(gcol&(gradient, grcolor + 1))
  67.                         p1 = gpos(gradient, grcolor)
  68.                         p2 = gpos(gradient, grcolor + 1)
  69.                         f = (grposition - p1) / (p2 - p1)
  70.                         IF r1 > r2 THEN
  71.                             r = r1 - ((r1 - r2) * f)
  72.                         ELSEIF r1 = r2 THEN
  73.                             r = r1
  74.                         ELSE
  75.                             r = r1 + ((r2 - r1) * f)
  76.                         END IF
  77.                         IF g1 > g2 THEN
  78.                             g = g1 - ((g1 - g2) * f)
  79.                         ELSEIF g1 = g2 THEN
  80.                             g = g1
  81.                         ELSE
  82.                             g = g1 + ((g2 - g1) * f)
  83.                         END IF
  84.                         IF b1 > b2 THEN
  85.                             b = b1 - ((b1 - b2) * f)
  86.                         ELSEIF b1 = b2 THEN
  87.                             b = b1
  88.                         ELSE
  89.                             b = b1 + ((b2 - b1) * f)
  90.                         END IF
  91.                         IF a1 > a2 THEN
  92.                             a = a1 - ((a1 - a2) * f)
  93.                         ELSEIF a1 = a2 THEN
  94.                             a = a1
  95.                         ELSE
  96.                             a = a1 + ((a2 - a1) * f)
  97.                         END IF
  98.                         gradientcolor& = _RGBA(INT(r), INT(g), INT(b), INT(a))
  99.                     END IF
  100.                 END IF
  101.             END IF
  102.         LOOP UNTIL grcolor = maxgcol&(gradient)
  103.     ELSE
  104.         gradientcolor& = _RGBA(0, 0, 0, 0)
  105.     END IF
  106.  
  107. SUB drawgradient (gradient, lx, ux, ly, uy, orientation$)
  108.     SELECT CASE orientation$
  109.         CASE "h"
  110.             IF ux - lx > 0 THEN
  111.                 rx = 0: DO: rx = rx + 1
  112.                     LINE (lx + rx, ly)-(lx + rx, uy), gradientcolor&(gradient, rx / (ux - lx) * 100)
  113.                 LOOP UNTIL rx >= ux - lx
  114.             END IF
  115.         CASE "v"
  116.             IF uy - ly > 0 THEN
  117.                 ry = 0: DO: ry = ry + 1
  118.                     LINE (lx, ly + ry)-(ux, ly + ry), gradientcolor&(gradient, ry / (uy - ly) * 100)
  119.                 LOOP UNTIL ry >= uy - ly
  120.             END IF
  121.     END SELECT
  122.  
  123. FUNCTION colour& (color$)
  124.         CASE "white"
  125.             colour& = _RGBA(255, 255, 255, 255)
  126.         CASE "black"
  127.             colour& = _RGBA(15, 15, 15, 255)
  128.         CASE "red"
  129.             colour& = _RGBA(255, 30, 30, 255)
  130.         CASE "yellow"
  131.             colour& = _RGBA(249, 194, 0, 255)
  132.         CASE "green"
  133.             colour& = _RGBA(94, 233, 61, 255)
  134.         CASE "blue"
  135.             colour& = _RGBA(6, 150, 255, 255)
  136.         CASE "dark grey"
  137.             colour& = _RGBA(50, 50, 50, 255)
  138.         CASE "light grey"
  139.             colour& = _RGBA(170, 170, 170, 255)
  140.         CASE "transparent"
  141.             colour& = _RGBA(0, 0, 0, 0)
  142.     END SELECT

 
Anmerkung 2020-08-13 125438.png
« Last Edit: August 13, 2020, 07:32:49 am by loudar »
Check out what I do besides coding: http://loudar.myportfolio.com/

Offline bplus

  • Global Moderator
  • Forum Resident
  • Posts: 8053
  • b = b + ...
    • View Profile
Re: Gradients!
« Reply #1 on: August 13, 2020, 12:44:48 pm »
@loudar

Beautiful color mixing, I never really mastered mixing more than 2 colors as gradient and am curious how you would fill a circle with more than 2 color bases as I do here with 2 color bases?

Code: QB64: [Select]
  1. _TITLE "MidInk test with circle" 'b+ 2020-08-13
  2.  
  3. CONST xmax = 500, ymax = 500, xc = 400, yc = 300
  4. SCREEN _NEWIMAGE(xmax, ymax, 32)
  5. _DELAY .1 'need time for screen to load before attempting to move it.
  6. DIM r, r1, r2, g1, g2, b1, b2
  7.     r1 = RND * 255: r2 = RND * 255: g1 = RND * 255: g2 = RND * 255: b1 = RND * 255: b2 = RND * 255
  8.     FOR r = 200 TO 0 STEP -1
  9.         fcirc 250, 250, r, midInk~&(r1, g1, b1, r2, g2, b2, r / 250)
  10.     NEXT
  11.     _DISPLAY
  12.     _LIMIT 1 ' slow down to avoid too much color flash
  13.  
  14. 'often I need it as Function as opposed color setting SUB,
  15. ' fr## is a fraction (0-1) towards the 2nd color you want
  16. FUNCTION midInk~& (r1%, g1%, b1%, r2%, g2%, b2%, fr##)
  17.     midInk~& = _RGB32(r1% + (r2% - r1%) * fr##, g1% + (g2% - g1%) * fr##, b1% + (b2% - b1%) * fr##)
  18.  
  19. 'from Steve Gold standard
  20. SUB fcirc (CX AS INTEGER, CY AS INTEGER, R AS INTEGER, C AS _UNSIGNED LONG)
  21.     DIM Radius AS INTEGER, RadiusError AS INTEGER
  22.     DIM X AS INTEGER, Y AS INTEGER
  23.     Radius = ABS(R): RadiusError = -Radius: X = Radius: Y = 0
  24.     IF Radius = 0 THEN PSET (CX, CY), C: EXIT SUB
  25.     LINE (CX - X, CY)-(CX + X, CY), C, BF
  26.     WHILE X > Y
  27.         RadiusError = RadiusError + Y * 2 + 1
  28.         IF RadiusError >= 0 THEN
  29.             IF X <> Y + 1 THEN
  30.                 LINE (CX - Y, CY - X)-(CX + Y, CY - X), C, BF
  31.                 LINE (CX - Y, CY + X)-(CX + Y, CY + X), C, BF
  32.             END IF
  33.             X = X - 1
  34.             RadiusError = RadiusError - X * 2
  35.         END IF
  36.         Y = Y + 1
  37.         LINE (CX - X, CY - Y)-(CX + X, CY - Y), C, BF
  38.         LINE (CX - X, CY + Y)-(CX + X, CY + Y), C, BF
  39.     WEND
  40.  
  41.  


Offline loudar

  • Newbie
  • Posts: 73
  • improve it bit by bit.
    • View Profile
Re: Gradients!
« Reply #2 on: August 13, 2020, 02:08:32 pm »
Oh this is nice! I like it a lot :D I thought about being able to make it circular too, but I'd have to whip out some of the sin/cos code I wrote...will do that in the following days!
Check out what I do besides coding: http://loudar.myportfolio.com/

Offline bplus

  • Global Moderator
  • Forum Resident
  • Posts: 8053
  • b = b + ...
    • View Profile
Re: Gradients!
« Reply #3 on: August 13, 2020, 03:02:44 pm »
Keybone did a nice one for diagonal:
Code: QB64: [Select]
  1. 'diagonal gradient by keybone 2018-08-03
  2. SCREEN _NEWIMAGE(800, 600, 32)
  3.  
  4. gradientDiagonal 0, 0, _WIDTH, _HEIGHT, _RGB(255, 255, 0), _RGB(255, 0, 255), 255
  5.  
  6. SUB gradientDiagonal (x0, y0, w, h, c1 AS _UNSIGNED LONG, c2 AS _UNSIGNED LONG, a AS _UNSIGNED _BYTE)
  7.     DIM mr AS DOUBLE, mg AS DOUBLE, mb AS DOUBLE
  8.     dw = w + h
  9.     mr = (_RED(c2) - _RED(c1)) / dw
  10.     mg = (_GREEN(c2) - _GREEN(c1)) / dw
  11.     mb = (_BLUE(c2) - _BLUE(c1)) / dw
  12.     FOR d = 0 TO dw - 1
  13.         r = _RED(c2) + (d - dw) * mr
  14.         g = _GREEN(c2) + (d - dw) * mg
  15.         b = _BLUE(c2) + (d - dw) * mb
  16.         IF d <= h - 1 THEN
  17.             LINE (x0 + d, y0)-(x0, y0 + d), _RGBA32(r, g, b, a)
  18.         ELSEIF d >= h AND d <= w - 1 THEN
  19.             LINE (x0 + d, y0)-(x0 + (d - h), y0 + h), _RGBA32(r, g, b, a)
  20.         ELSEIF d >= w AND d <= dw - 1 THEN
  21.             LINE (x0 + w, y0 + (d - w))-(x0 + (d - h), y0 + h), _RGBA32(r, g, b, a)
  22.         END IF
  23.     NEXT d
  24.  
  25.