Graphics Window Example

[GWS]

Hi folks,

Here's a basic graphics window that incorporates several features that a coder might find useful

It's the first LB program I've written in a while, so it took a lot of research to get things working as I wanted.

The first thing I wanted was a Shaded background, so I've included a simple routine to give a blue shading.

Then a needed to place a transparent text heading on the page - another subroutine achieves that.

Finally, I wanted a bit of flashy decoration, so I've used a number of coloured pixel areas to look pretty.

Anyway, here it is ..


nomainwin

WindowWidth = 800 : WindowHeight = 600
wW = WindowWidth : wH = WindowHeight                ' hate typing long variable names
Global wW,wH,pi                                        ' needed in subroutines

UpperLeftX = (DisplayWidth - wW) / 2                ' centre graphics window
UpperLeftY = (DisplayHeight - wH) / 2

pi = 4 * atn(1)                                     ' gives an accurate value of pi (3.14 .. )

button #win.quit, "Exit",[quit],UL,(wW - 60)/2, wH * 0.8, 60, 30

open " A Graphics Window" for graphics_nsb_nf as #win     ' open graphics window
#win "trapclose [quit]"                             ' capture window closed message

#win, "down"                                        ' prepare to draw

Call Gradient                                       ' draw a blue gradient fill

' create some coloured spots ...
for i = 1 to 10
   meanx = int(rnd(1)*(wW - 100))
   meany = int(rnd(1)*(wH - 200))
   sdev = 30                                       ' controls the spread of the pixels ...
   red = int(rnd(1)*200) + 55
   green = int(rnd(1)*200) + 55
   blue = int(rnd(1)*200) + 55

   #win, "color ";red;" ";green;" ";blue

   for j = 1 to 400
       x = splot() * sdev + meanx
       y = splot() * sdev + meany
       #win, "size ";int(rnd(1)*3)
       #win, "set ";x;" ";y
   next j
next i

' prepare for transparent text ..
Call Trans

text$ = "Liberty Basic"                             ' set heading text

' format the text ..
red = 50
green = 200
blue = 255
#win, "color ";red;" ";green;" ";blue
#win, "font arial 26 italic; backcolor 0 0 int(originY * cstep)"

tw = TextWidth(text$)                               ' function to get text width
textX = (wW - tw)/2: textY = 100
#win, "place "; textX; " "; textY                   ' position text
#win, "|"; text$                                    ' indicate graphics text "|" and display it

#win, "flush"                                       ' retain graphos if window resized


wait


[quit]
close #win
end


function TextWidth(t$)
   #win, "stringwidth? t$ twidth"
   TextWidth = twidth
end function

function splot()
' routine to generate random values from a normal distribution ..
' the Normal curve is bell-shaped, centred at the Mean, and extending
' 3 Standard deviations above and below the mean.
   x1 = rnd(1)
   x2 = rnd(1)
   if (x1 < 1e-5) then x1 = 1e-5                    ' catch very small values of x1 ..
   splot = sqr(-2 * log(x1)) * cos(2 * pi * x2)     ' the Normal curve value ..
end function

sub Gradient
   cstep = 0.75 * 255 / wH                           ' multiplier of 255 controls the gradient rate
   for i = 1 to wH
       x1 = 0 : y1 = i
       x2 = wW : y2 = i
       c = int(i * cstep)
       #win, "color 0 0"; " "; c                    ' set line colour
       #win, "line "; x1; " "; y1; " "; x2; " "; y2
   next i
end sub

sub Trans
' prepare for transparent text ..
hWin = hwnd(#win)                                   ' get graphics window handle

CallDLL #user32, "GetDC",_                          ' get device context handle of graphics window
   hWin As ulong,_                                 ' handle of graphics window
   gDC As ulong                                    ' device context

CallDLL #gdi32, "SetBkMode",_
   gDC As ulong,_                                  ' handle of graphics window
   _TRANSPARENT As long,_                          ' flag for transparent background
   result As long

callDLL #user32, "ReleaseDC",_
   hWin As ulong,_                                 ' graphics window handle
   gDC As ulong,_                                  ' device context
   result As long

end sub


all the best,

Graham

[tsh73]

Hello Graham
I run your program - it works - I went to look inside
Only thing I could say on code structure is that usually TRAPCLOSE is written just after window is open.
So if your program hits WAIT anywhere - TRAPCLOSE will work.

But the thing that puzzled me was your splot() function.
I made a table of function values and tried to plot it.
Your comment says 'random values from a normal distribution', but in what range?
I got somewhere between 0 and 3. Now the mean value would be about 1.5
What's the use of normal distribution with mean around 1.5?

So I tried to Google
found Wikipedia::Box–Muller transform
formula looks like yours
but it kind of says that mean should be 0 (and deviation 1).

So what's wrong?

It happened that "pi" value your formula uses is undefined.
Add "pi = acs(-1)" in the beginning of splot() function, and it will return
random values from a normal distribution with mean 0 and deviation 1.
(or you can made "pi" global and define it once).

OOPS but it changes your firework picture

[GWS]

Thanks for the comments tsh ..

I've modified the program accordingly.

I can see it makes more sense - particularly in a multi-window program, to have the 'trapclose' statement alongside each window.

I'd forgotten the 'pi' definition .. .   I usually make it global - I use 4 * atn(1) myself.
I wondered why the pixels didn't seem to be spread out as much as I'd expect.

The Normal curve is bell-shaped, centered at the Mean, and extending in practical terms, 3 Standard Deviations on either side.

In the program. I define variables 'meanx' and 'meany'  as the center focus of each 'splot' of pixels of a given color.
Then the points spread out according to the Normal distribution around the mean values on the 'x' and 'y' axes.

All seems to be well now.

best wishes,

Graham

[Larry]

This program is totally awesome. I am curious. What if your title was instead a whole paragraph say written using notepad? How would you get it to display using the "|" or "\" without it all showing up in a strait line and ending up past the right edge of the screen? Is there a way to wrap the text like it was in a texteditor control? Obviously it would have to be taken care of before I issued a flush command.

[tsh73]

sorry it wouldn't print "\" and "|" in same line.
nomainwin
open "word wrap" for graphics_nsb_nf as #gr
#gr "trapclose [quit]"
#gr "home; posxy cx cy"
width=cx*2

'word by word
read txt$
i = 0
word$="*"
aLine$=""
#gr "place 0 0"
#gr "\" 'new line
while word$<>""
   i=i+1
   word$ = word$(txt$, i)
   print i, word$
   newLine$=aLine$+space$(aLine$<>"")+word$    'space if there was somethng before
   #gr "stringwidth? newLine$ widthInPixels"
   if widthInPixels > width then   'print current line, start new one
       #gr "\"; aLine$
       aLine$= word$
   else
       aLine$=newLine$
   end if
wend
'print last line
#gr "\"; aLine$

#gr "flush"
wait

[quit]
   close #gr
   end

data "This program is totally awesome. I am curious. What if your title was instead a whole paragraph say written using notepad? How would you get it to display using the '|' or '\' without it all showing up in a strait line and ending up past the right edge of the screen? Is there a way to wrap the text like it was in a texteditor control? Obviously it would have to be taken care of before I issued a flush command."




[Larry]

Thanks that worked fine.I appreciate it.