Creating a graphic gradient

[NoCforMe]

OK, so the latest 30-minute obsession turned out to be how to create a gradient in a window. Came up with this li'l program to demonstrate. It shows two techniques for this: one is a y=1/x gradient, the other is just a linear one. Both are shown side by side.

Turns out I don't really like the way either one looks, so I'm open to suggestions for other methods. The 1/x one has a nice top, but it goes too quickly to all white. (If you want to play with the program, tweak the variable Scaler to change the look of this gradient (currently set at 1024 * 7). The larger this number, the longer the gradient stays black at the top.

One small challenge here is mapping whatever numbers the gradient method produces to the range [0 ... 255] required by the Win32 RGB quad color values. One small hiccup in my code is that the gradients don't always reach 255 (full white).

And of course it would be nice to introduce color here. Probably have to study up on that HSV--> RGB stuff to do that.

Anyhow, see whatcha think.

Oh, and BTW, the program uses a dialog created by my memory-template dialog creator, usually as an include file, but I put it inline to not have to mess with extra files here.

[jj2007]

Looks nice, and I would definitely go for the linear gradient.

On Win7-64, it crashes on exit. I can see the "postquit", the ret is performed ok, but somewhere later on it crashes

Code: [Select]

do_close:
INVOKE PostQuitMessage, NULL
print "postquit"
MOV EAX, TRUE
RET

[FORTRANS]

Hi,

Turns out I don't really like the way either one looks, so I'm open to suggestions for other methods.

   When I was playing around with gradients and gray scale images,
I found that gamma correction helped.  But it does seem to depend
on your display's characteristics.  Gamma values in the range of 1.95
to 2.5 were worth investigating when I tried using it.  I ended up with
a lot of funny looking patterns trying to test for a uniform gradient.

Cheers,

Steve N.

[NoCforMe]

On Win7-64, it crashes on exit. I can see the "postquit", the ret is performed ok, but somewhere later on it crashes

Code: [Select]

do_close:
INVOKE PostQuitMessage, NULL
print "postquit"
MOV EAX, TRUE
RET

Win7-64 here too. I'll look at it, see if I left something open or whatever. Could be the dialog code.

Aha! Found it. When I clipped out some logging stuff w/IFDEF ... ENDIF I wrongly clipped out this stuff too before exiting WinMain():

Code: [Select]

MOV EAX, msg.wParam
RET

That would explain it ... but it works fine for me?!??

[NoCforMe]

Hi,

Turns out I don't really like the way either one looks, so I'm open to suggestions for other methods.

   When I was playing around with gradients and gray scale images,
I found that gamma correction helped.  But it does seem to depend
on your display's characteristics.  Gamma values in the range of 1.95
to 2.5 were worth investigating when I tried using it.  I ended up with
a lot of funny looking patterns trying to test for a uniform gradient.

Is gamma correction something you'd do in the code that generates the gradient, or by adjusting your monitor?

It occurred to me that rather than reinventing the wheel, there must be some long-time standard algorithms for creating gradients. Further research required ...

[caballero]

Here an example

http://abreojosensamblador.epizy.com/?Tarea=5&SubTarea=1&Lang=1#DegradadoColor

[jj2007]

That would explain it ... but it works fine for me?!??

Works fine now

[FORTRANS]

Hi,

Is gamma correction something you'd do in the code that generates the gradient, or by adjusting your monitor?

   Well, it is both sort of.  You can change the characteristics of your monitor,
contrast and brightness.  And that can affect its gamma curve.  But mostly
those changes should be constrained.  To further correct a gray scale image
one would apply a gamma correction.  I used a look up table, such as the
following.

Code: [Select]

IF 0    ; Gamma = 2.0
; 4 April 2013
; See MORIE.WK1 for derivation.
               ; 0    1    2    3    4    5    6    7    8    9    A    B    C    D    E    F
Power   DB       0,  16,  23,  28,  32,  36,  39,  42,  45,  48,  50,  53,  55,  58,  60,  62 ; 0
        DB      64,  66,  68,  70,  71,  73,  75,  77,  78,  80,  81,  83,  84,  86,  87,  89 ; 1
        DB      90,  92,  93,  94,  96,  97,  98, 100, 101, 102, 103, 105, 106, 107, 108, 109 ; 2
        DB     111, 112, 113, 114, 115, 116, 117, 118, 119, 121, 122, 123, 124, 125, 126, 127 ; 3
        DB     128, 129, 130, 131, 132, 133, 134, 135, 135, 136, 137, 138, 139, 140, 141, 142 ; 4
        DB     143, 144, 145, 145, 146, 147, 148, 149, 150, 151, 151, 152, 153, 154, 155, 156 ; 5
        DB     156, 157, 158, 159, 160, 160, 161, 162, 163, 164, 164, 165, 166, 167, 167, 168 ; 6
        DB     169, 170, 170, 171, 172, 173, 173, 174, 175, 176, 176, 177, 178, 179, 179, 180 ; 7
        DB     181, 181, 182, 183, 183, 184, 185, 186, 186, 187, 188, 188, 189, 190, 190, 191 ; 8
        DB     192, 192, 193, 194, 194, 195, 196, 196, 197, 198, 198, 199, 199, 200, 201, 201 ; 9
        DB     202, 203, 203, 204, 204, 205, 206, 206, 207, 208, 208, 209, 209, 210, 211, 211 ; A
        DB     212, 212, 213, 214, 214, 215, 215, 216, 217, 217, 218, 218, 219, 220, 220, 221 ; B
        DB     221, 222, 222, 223, 224, 224, 225, 225, 226, 226, 227, 228, 228, 229, 229, 230 ; C
        DB     230, 231, 231, 232, 233, 233, 234, 234, 235, 235, 236, 236, 237, 237, 238, 238 ; D
        DB     239, 240, 240, 241, 241, 242, 242, 243, 243, 244, 244, 245, 245, 246, 246, 247 ; E
        DB     247, 248, 248, 249, 249, 250, 250, 251, 251, 252, 252, 253, 253, 254, 254, 255 ; F
ENDIF
   Just take the pixel value as an index into the array and use the table value
as a corrected pixel value to display.

   At the time, the best results depended on the computer being used, but were
between 2.0 and 2.5.  However my current display seems to want something
much smaller.  Maybe even not using a correction at all.  (May require further
investigation?  Drat.  And two other computers purchased since then as well.)

Regards,

Steve N.

[NoCforMe]

So how do you calculate gamma progammatically? In other words, how would you go about creating such a lookup table? (Yeah, I know there's lotsa stuff out there, but I'm too lazy at the moment to dig through it all.)

[FORTRANS]

Hi,

   It has been a while, but the formula is something along
the lines of:

  (Corrected Pixel) = Constant * (Input pixel) ^ (1/gamma)

   For the table displayed above:

 gamma = 2.0
 constant = 1.0 / 0.062622
 Pixels range 0 ... 255

   Apparent reference is "Jim Blinn's Corner: Dirty Pixels", 1998,
ISBN 1-55860-455-3.  Chapter Five, Dirty Pixels, July 1989.
The book is a collection of monthly magazine column articles.

   I will look around for another reference to quote from.

Cheers,

Steve

[FORTRANS]

Hi,

   I went and calculated curves for gamma values of 1/3,
1/2, 1.0, 2.0, and 3.0.  And then made gray gradient
images to show the differences.  If there is some interest,
I can post those.

Regards,

Steve N.