IonicWind Software

IWBasic => The Roundtable => Topic started by: GWS on November 30, 2006, 02:33:56 PM

Title: Background Color Gradient
Post by: GWS on November 30, 2006, 02:33:56 PM
Hi,

Here's one method of setting a window color gradient.ÂÃ,  Not sure who wrote the original code - I've tweaked it a bit:


' one way of setting a background color gradient
' converted from original IBP code - author unknown
' It's essentially filling rectangles with each shade of blue
' one at a time - hence the smooth flow ..
' (modified to allow the gradient rate to be exponentially changed).
' GWS - November 2006

type rectangle
int left
int top
int right
int bottom
endtype

rectangle rcfill
int x,y,hdc,hbrush

Declare import,FillRect(hdc:int, lpRect:rectangle, hBrush:int),int
Declare import,SetRect(pRect:rectangle, X1:int, Y1:int, X2:int, Y2:int),int
Declare import,CreateSolidBrush(crColor:int),int
Declare import,DeleteObject(hObject:int),int

window win

GetScreenSize x,y
openwindow win,0,0,x,y,@caption,0,"Gradient Fill",&main

DrawGradient()

Waituntil win=0
END

sub main
Select @Class
Case @IDclosewindow
CloseWindow win
EndSelect

return
endsub


sub DrawGradient
int band
float pstep

pstep = y / 256.0
hdc = gethdc(win)

for band = 0 to 255
SetRect(rcfill,0,int(band*pstep),x+1,int((Band+1)*pstep))
' the exponential term can be varied to adjust the rate of change of the gradient ..
hbrush=CreateSolidBrush(rgb(0,0,(255 - Band)*exp(-band/500)))
' or as a linear fill ..
' hbrush=CreateSolidBrush(rgb(0,0,(255 - Band)*exp(-0.3)))
FillRect(hdc,rcfill,hbrush)
next band

releasehdc win,hdc
DeleteObject(hbrush)

return
endsub


all the best, :)

Graham

Title: Re: Background Color Gradient
Post by: GWS on December 01, 2006, 01:44:32 AM
Oops, I must have been sleepy when I posted last night.

The example I gave was an intermediate experiment to get a non-linear gradient - but of course exp(-0.5) is just a constant (0.74), so it gave a linear fill.ÂÃ,  What I meant to post was exp(-band/somevalue) which gives an exponential fill ..ÂÃ,  :)

I've modified the listing above ..

all the best,

Graham
Title: Re: Background Color Gradient
Post by: GWS on December 01, 2006, 02:32:07 AM
Here's another method that doesn't require API calls:


' Simple Routine to fill a window with a gradient ..
' GWS - November 2006
' Emergence Code

window win
int i,c,run

openwindow win,0,0,800,600,@SIZE|@MINBOX|@MAXBOX,0,"Gradient",&mainwin

setlinestyle win, @lssolid,2

For i = 1 To 600
if i%3 then c = c - 1
if i%15 then c = c + 1
ÂÃ,  LINE win, 0, i, 800, i,RGB(0,0,c)
Next i

run = 1

waituntil run = 0
closewindow win
END

SUB mainwin
select @CLASS
ÂÃ,  case @IDCLOSEWINDOW
ÂÃ,  ÂÃ,  run = 0
endselect
return
endsub


There are probably lots of ways of making a smooth gradient .. I wonder what the neatest way would be .. :)

The modulus values are nothing special - they just alter the shade of blue and the rate of change of the gradient.
You can play about with them to get different effects.

Graham
Title: Re: Background Color Gradient
Post by: Andrew on December 02, 2006, 01:25:41 AM
Here's one I prepared earlier ;) This will blend two colours of your choice.

window win
int run
Uint fcol,bcol

OPENWINDOW win, 10, 1, 106, 400, @caption, 0, "Vignette", &main
CONTROL win,@BUTTON,"Top",0,0,100,22,0x50000000,1
CONTROL win,@BUTTON,"Bottom",0,353,100,22,0x50000000,2
CenterWindow win

run=1

fcol=RGB(255,0,0)
bcol=RGB(0,0,255)
Vignette(win,0,22,100,330,fcol,bcol)

WaitUntil run=0
end

Sub main
SELECT @CLASS
  CASE @IDCLOSEWINDOW
    run = 0
  CASE @IDCONTROL
   SELECT @CONTROLID
      case 1
         fcol=ColorRequest(win)
      case 2
         bcol=ColorRequest(win)
   EndSelect
   Vignette(win,0,22,100,330,fcol,bcol)
ENDSELECT
RETURN
EndSub

Sub Vignette(wn as Window, x as int, y as int, w as int, h as int, fc as Uint, bc as UInt)
   'linear vignette from top to bottom, fc to bc
   float col[3],scol[3]
   int i,j
   'Split the RGBColour into its components
   col[0]=fc%256 :'Red
   col[1]=(fc%65536)/256 :'Green
   col[2]=fc/65536 :'Blue
   'Work out the difference between the forecolour and the backcolour
   scol[0]=((bc%256)-col[0])/h :'Red
   scol[1]=(((bc%65536)/256)-col[1])/h :'Green
   scol[2]=((bc/65536)-col[2])/h :'Blue
   'Do the vignette
   for i=0 to h
      Line wn,x,y+i,x+w,y+i,RGB(int(col[0]),int(col[1]),int(col[2]))
      'Adjust the base colour
      for j=0 to 2
         col[j]+=scol[j]
      next j
   next i
   return
EndSub


Cheers,
Andrew.
Title: Re: Background Color Gradient
Post by: GWS on December 02, 2006, 12:26:03 PM
That's very nice Andrew - super color choice .. :)

I'm sure the method will be useful.

Graham