LB Booster
Programming >> Liberty BASIC language >> Overlaying GRAPHICBOXES in window
http://lbb.conforums.com/index.cgi?board=lblang&action=display&num=1499104044
Overlaying GRAPHICBOXES in window
Post by flotulopex on Jul 3rd, 2017, 5:47pm

Hi,

Is there a way to overlay 2 or 3 GRAPHICBOXes in a window of "window" type?

Rog'
Re: Overlaying GRAPHICBOXES in window
Post by Richard Russell on Jul 3rd, 2017, 6:44pm

on Jul 3rd, 2017, 5:47pm, flotulopex wrote:
Is there a way to overlay 2 or 3 GRAPHICBOXes in a window of "window" type?

There should be no problem overlaying multiple controls, so long as only one of them is visible at any given time. So if you send the "show" command to that one and the "hide" command to the others it should work (see code below). Is that what you meant?

Richard.

Code:
    GRAPHICBOX #w.gb1, 20, 20, 260, 200
    GRAPHICBOX #w.gb2, 20, 20, 260, 200
    GRAPHICBOX #w.gb3, 20, 20, 260, 200
    BUTTON #w, "Box 1", [b1], UL, 20, 250
    BUTTON #w, "Box 2", [b2], UL, 120, 250
    BUTTON #w, "Box 3", [b3], UL, 220, 250
    OPEN "Overlaid graphicboxes" for WINDOW as #w
    #w.gb2 "hide"
    #w.gb3 "hide"
    #w.gb1 "down; fill red"
    #w.gb2 "down; fill green"
    #w.gb3 "down; fill blue"
    WAIT

[b1]
    #w.gb1 "show"
    #w.gb2 "hide"
    #w.gb3 "hide"
    WAIT
    
[b2]
    #w.gb1 "hide"
    #w.gb2 "show"
    #w.gb3 "hide"
    WAIT
   
[b3]
    #w.gb1 "hide"
    #w.gb2 "hide"
    #w.gb3 "show"
    WAIT

Re: Overlaying GRAPHICBOXES in window
Post by flotulopex on Jul 3rd, 2017, 7:58pm

Thank you Richard.

No, I meant to draw (or fill) a background (1st graphicbox) and then put (overlay) some text in a form of a bmp.image in a second smaller graphicbox centered over the background.
Re: Overlaying GRAPHICBOXES in window
Post by tsh73 on Jul 3rd, 2017, 8:00pm

Just say what are you hoping to get from that?
EDIT *got it aswered while I typed*

So you want second bitmap (with text) be transparently overlaid upon first?
Just happened on LB forums - transparentBlit
Re: Overlaying GRAPHICBOXES in window
Post by flotulopex on Jul 3rd, 2017, 8:09pm

I have a background, let's say it's red.

Then I make some other bmp image with white text on the same red text backcolor as the background.

Overlaping the text image over the backround should make the illusion.
Re: Overlaying GRAPHICBOXES in window
Post by Richard Russell on Jul 3rd, 2017, 9:05pm

on Jul 3rd, 2017, 8:09pm, flotulopex wrote:
Overlaping the text image over the backround should make the illusion.

I don't think I've yet fully understood what you are trying to achieve. If the 'text image' has the same background color as the graphicbox, why do you need a second graphicbox at all? Why can't you just DRAWBMP the text image in the correct place?

As Anatoly says, if you want to draw an image with a transparent background then you would need to use the Windows API, because LB/LBB doesn't support an 'alpha' channel (except with sprites, of course). But if you can arrange the text image to have the matching background color, as you suggest, I can't see why you would need a more complicated solution.

Richard.
Re: Overlaying GRAPHICBOXES in window
Post by flotulopex on Jul 4th, 2017, 06:57am

Thanks for the help.

I'll send you my "work" later on so you will see what I want to achieve.

Rog'
Re: Overlaying GRAPHICBOXES in window
Post by flotulopex on Jul 4th, 2017, 3:42pm

So, here's the link to download my program: http://home.citycable.ch/flotulopex/LBB/.

What's this program for? In a dance school, the teacher wants to announce the currently played dance and the upcoming one too (because some ladies need time to change shoes rolleyes ).

Once launched, drag the mouse on the right side of the screen and the dance list will open. The selected dance will appear in the bottom graphicbox "prochaine" or "next" in english; selecting a second dance will move the "next" dance up to the upper "maintenant" or "now" graphicbox and take place in the "next" graphicbox.

An info window can be opened by clicking the upper left screen's angle; to exit the program, click the lower left screen's angle.
Re: Overlaying GRAPHICBOXES in window
Post by flotulopex on Jul 4th, 2017, 3:54pm

Actually, the program works well. It is used with a 1920x1080 beamer.

But as you will see, the coding level is low embarassed. Since I couldn't find a better way to do it quickly, I had to go with this version.

Nevertheless, I hate hard coding things (dance displays on both backgrounds; makes it up to 60 3MB files!!!shocked) so I at least reached to get an external "config.ini" file for the dance list.

Next I would like to be able to draw the top "maintenant"/"now" and the bottom "prochaine"/"next" graphicboxes and write the selected dance on the top of them, adapting text color and size.

At best, all texts and backgrounds should be configurable within the program to make this one easy to adapt in case of changes.

So this is where I'm currently stuck - I can't make two graphicboxes overlap and/or drawing i.e. STATICTEXT and adjusting easily character back- and forecolor and size .

Does it look more clear for understanding the project now?
Re: Overlaying GRAPHICBOXES in window
Post by Richard Russell on Jul 4th, 2017, 6:54pm

on Jul 4th, 2017, 3:54pm, flotulopex wrote:
Does it look more clear for understanding the project now?

No, sorry, I just can't see why you need multiple overlaid controls. To the extent that I follow your description, it sounds like a perfectly straightforward application for a single GRAPHICBOX onto which you draw colored text. This gives you full control over the font, position, foreground and background colors etc. of the text, so what is it you can't do that way?

Richard.
Re: Overlaying GRAPHICBOXES in window
Post by flotulopex on Jul 5th, 2017, 06:28am

Richard,

I understand your shock grin and I know there is a simpler way to do it...but I didn't found it.

Would you please give me the "right" start in the way of an example?

What do I need to know?
1.- how do I fill the top half of the screen in one color and the bottom one in another color
2.- how do I place some different sized/colored text on this bicolor background
3,. something else important to start?

That would really help, I think.

BTW, I would be happy about further comments to improve my code. I would like to have as got as possible "at my level" wink
Re: Overlaying GRAPHICBOXES in window
Post by tsh73 on Jul 5th, 2017, 07:50am

Code:
nomainwin
open "test" for graphics_nsb_nf as #gr
#gr "trapclose [quit]"
#gr "down; home; posxy cx cy"
width = 2*cx
height = 2*cy
color1$="red"
color2$="255 168 0"'some orange
#gr "color ";color1$
#gr "backcolor ";color1$
'for drawing filled box we need border color match fill color
#gr "place 0 0" 'upper left corner
#gr "boxfilled ";width ;" ";height/2    'other corner
'now change font, set size, and bold
#gr "font times_new_roman 48 bold"
'change text color
#gr "color ";color2$
'type a text
#gr "place 80 ";height/2 - 20   'position by trial and error
#gr "\";"Hello"

'about the same for bottom part
#gr "backcolor ";color2$
'for drawing filled box we need border color match fill color
#gr "place 0 ";height/2
#gr "boxfilled ";width ;" ";height  'over corner, not size!
#gr "font courier_new 48 bold"  'another font
#gr "color ";color1$
'type a text
'now a bit less trial and error:
'get line height in current font
#gr "posxy dummy y0"
#gr "\" 'new line - invisible
#gr "posxy dummy y1"
lineHeight = y1-y0
'Let a line width in current font
txt$="there"
#gr "stringwidth? txt$ lineWidth"

#gr "place ";(width-lineWidth)/2;" ";height/2 + lineHeight  
#gr "\";txt$

#gr "flush"
wait

[quit]
    close #gr
    end


Quote:
I would be happy about further comments to improve my code.

Did you post the code?

EDIT added determining line height, line width in second part.
Re: Overlaying GRAPHICBOXES in window
Post by flotulopex on Jul 5th, 2017, 08:36am

Quote:
Did you post the code?

Sorry, I thought I added it in the exe file. I'll send it asap.
Re: Overlaying GRAPHICBOXES in window
Post by Rod on Jul 5th, 2017, 2:37pm

Not sure if this helps or not.

Code:
nomainwin
WindowWidth  = 200
WindowHeight = 200
UpperLeftX = (DisplayWidth-WindowWidth)/2
UpperLeftY = (DisplayHeight-WindowHeight)/2
open "Graphic" for graphics_nsb as #1
'get the handle of the window
hWD=hwnd(#1)
'get the handle of the DC in that window
CallDll #user32, "GetDC", hWD as ulong, hDC as ulong
'set text to render with transparent background
calldll #gdi32, "SetBkMode",hDC as ulong,_TRANSPARENT as long, re as long
#1 "trapclose [quit]"
#1 "down"
#1 "color red ; backcolor red"
#1 "place 0 0 ; boxfilled 200 100"
#1 "color blue ; backcolor blue"
#1 "place 0 100 ; boxfilled 200 200"

#1 "color yellow ; home ; circle 100"
#1 "font Consolas 40 ; place 30 110 ;\Text"
wait

[quit]
close #1
end
Re: Overlaying GRAPHICBOXES in window
Post by flotulopex on Jul 5th, 2017, 3:43pm

Here is my code.

Code:
' "K'elle Danse"

' For 1920x1080 display

PrgVersion$ = "0-0-1-1"

NOMAINWIN

FilenameNow$  = ""
FilenameNext$ = ""

' Load danse list from file "Config.ini"
DIM Dance$(31)
OPEN "Config.ini" FOR input AS #ConfigFile
DO
  INPUT #ConfigFile, Dance$
  Dance$(index) = Dance$
  index = index + 1
LOOP UNTIL index >= 31
CLOSE #ConfigFile

' Load background images
LOADBMP "Now",  DefaultDir$ + "\" + "_Now.bmp"
LOADBMP "Next", DefaultDir$ + "\" + "_Next.bmp"

GRAPHICBOX #Main.GBx1,0,0,1920,540     ' top "Now" image
 STYLEBITS #Main.GBx1,0,_WS_BORDER,0,0 'remove image's border

GRAPHICBOX #Main.GBx2,0,540,1920,540   ' bottom "Next" image
 STYLEBITS #Main.GBx2,0,_WS_BORDER,0,0 'remove image's border

GRAPHICBOX #SideMenu.GBx1,0,0,200,1080     ' "Menu" image
 STYLEBITS #SideMenu.GBx1,0,_WS_BORDER,0,0 'remove image's border

BackgroundColor$ = "darkred" ' this color setting MUST stay before the STATICTEXT!!!

STATICTEXT #SideMenu.STx0, "  " + Dance$(0) ,10,  20,200,20
STATICTEXT #SideMenu.STx1, "  " + Dance$(1) ,10,  50,200,20
STATICTEXT #SideMenu.STx2, "  " + Dance$(2) ,10,  80,200,20
STATICTEXT #SideMenu.STx3, "  " + Dance$(3) ,10, 110,200,20
STATICTEXT #SideMenu.STx4, "  " + Dance$(4) ,10, 140,200,20
STATICTEXT #SideMenu.STx5, "  " + Dance$(5) ,10, 170,200,20
STATICTEXT #SideMenu.STx6, "  " + Dance$(6) ,10, 200,200,20
STATICTEXT #SideMenu.STx7, "  " + Dance$(7) ,10, 230,200,20
STATICTEXT #SideMenu.STx8, "  " + Dance$(8) ,10, 260,200,20
STATICTEXT #SideMenu.STx9, "  " + Dance$(9) ,10, 290,200,20
STATICTEXT #SideMenu.STx10,"  " + Dance$(10),10, 320,200,20
STATICTEXT #SideMenu.STx11,"  " + Dance$(11),10, 350,200,20
STATICTEXT #SideMenu.STx12,"  " + Dance$(12),10, 380,200,20
STATICTEXT #SideMenu.STx13,"  " + Dance$(13),10, 410,200,20
STATICTEXT #SideMenu.STx14,"  " + Dance$(14),10, 440,200,20
STATICTEXT #SideMenu.STx15,"  " + Dance$(15),10, 470,200,20
STATICTEXT #SideMenu.STx16,"  " + Dance$(16),10, 500,200,20
STATICTEXT #SideMenu.STx17,"  " + Dance$(17),10, 530,200,20
STATICTEXT #SideMenu.STx18,"  " + Dance$(18),10, 560,200,20
STATICTEXT #SideMenu.STx19,"  " + Dance$(19),10, 590,200,20
STATICTEXT #SideMenu.STx20,"  " + Dance$(20),10, 620,200,20
STATICTEXT #SideMenu.STx21,"  " + Dance$(21),10, 650,200,20
STATICTEXT #SideMenu.STx22,"  " + Dance$(22),10, 680,200,20
STATICTEXT #SideMenu.STx23,"  " + Dance$(23),10, 710,200,20
STATICTEXT #SideMenu.STx24,"  " + Dance$(24),10, 740,200,20
STATICTEXT #SideMenu.STx25,"  " + Dance$(25),10, 770,200,20
STATICTEXT #SideMenu.STx26,"  " + Dance$(26),10, 800,200,20
STATICTEXT #SideMenu.STx27,"  " + Dance$(27),10, 830,200,20
STATICTEXT #SideMenu.STx28,"  " + Dance$(28),10, 860,200,20
STATICTEXT #SideMenu.STx29,"  " + Dance$(29),10, 890,200,20
STATICTEXT #SideMenu.STx30,"  " + Dance$(30),10,1000,200,20


[MAIN]
   ' Main window - background
   UpperLeftX   = 0
   UpperLeftY   = 0
   WindowWidth  = 1920
   WindowHeight = 1080
   OPEN "Now & Next" FOR window_popup AS #Main 'no title, not resizable
   #Main "TRAPCLOSE [QUIT]"

   #Main.GBx1 "down"
   #Main.GBx1 "drawbmp Now 0 0"
   #Main.GBx1 "when leftButtonDown [MouseLeftButton]"
   #Main.GBx1 "when mouseMove [MouseMove]"

   #Main.GBx2 "down"
   #Main.GBx2 "drawbmp Next 0 0"
   #Main.GBx2 "when leftButtonDown [MouseLeftButton]"
   #Main.GBx2 "when mouseMove [MouseMove]"

   ' Side menu - dance selector
   UpperLeftX   = 1720
   UpperLeftY   = 0
   WindowWidth  = 190
   WindowHeight = 1080
   ForegroundColor$ = "white"
   OPEN "Side Menu" FOR window_popup AS #SideMenu  'no title, not resizable
   STYLEBITS #SideMenu,0,_WS_VISIBLE,0,0 ' startup hidden (not visible)
   #SideMenu "font tahoma 12 bold"
   #SideMenu.GBx1 "down; fill darkred"
   #SideMenu.GBx1 "when LeftButtonDown [DanceSelection]"

   WAIT


[QUIT]
   CLOSE #SideMenu
   CLOSE #Main
   END

[REFRESH]
   UNLOADBMP "Now" 'free-up memory
   LOADBMP "Now", DefaultDir$+"\"+FilenameNow$+"_Now.bmp"
   #Main.GBx1 "down"
   #Main.GBx1 "drawbmp Now 0 0"
   UNLOADBMP "Next" 'free-up memory
   LOADBMP "Next", DefaultDir$+"\"+FilenameNext$+"_Next.bmp"
   #Main.GBx2 "down"
   #Main.GBx2 "drawbmp Next 0 0"
   WAIT

[MouseLeftButton]
   IF MouseX = 0 AND MouseY < 10 THEN [ABOUT] 'upper left screen edge "About..."
   IF MouseX = 0 AND MouseY > 530 THEN [QUIT] '"Quitter"
   WAIT

[MouseMove] 'get mouse's XY position - for programming purpose
   IF MouseX > 1720 AND MouseX < 1900 THEN #SideMenu "show"
   IF MouseX < 1720 THEN #SideMenu "hide"
   IF MouseX > 1910 THEN #SideMenu "hide"
   WAIT

[DanceSelection]
   FilenameNow$ = FilenameNext$
   IF MouseY < 45                    THEN FilenameNext$ = Dance$(0)  GOTO [REFRESH]
   IF MouseY >= 45  AND MouseY < 75  THEN FilenameNext$ = Dance$(1)  GOTO [REFRESH]
   IF MouseY >= 75  AND MouseY < 105 THEN FilenameNext$ = Dance$(2)  GOTO [REFRESH]
   IF MouseY >= 105 AND MouseY < 135 THEN FilenameNext$ = Dance$(3)  GOTO [REFRESH]
   IF MouseY >= 135 AND MouseY < 165 THEN FilenameNext$ = Dance$(4)  GOTO [REFRESH]
   IF MouseY >= 165 AND MouseY < 195 THEN FilenameNext$ = Dance$(5)  GOTO [REFRESH]
   IF MouseY >= 195 AND MouseY < 225 THEN FilenameNext$ = Dance$(6)  GOTO [REFRESH]
   IF MouseY >= 225 AND MouseY < 255 THEN FilenameNext$ = Dance$(7)  GOTO [REFRESH]
   IF MouseY >= 255 AND MouseY < 285 THEN FilenameNext$ = Dance$(8)  GOTO [REFRESH]
   IF MouseY >= 285 AND MouseY < 315 THEN FilenameNext$ = Dance$(9)  GOTO [REFRESH]
   IF MouseY >= 315 AND MouseY < 345 THEN FilenameNext$ = Dance$(10) GOTO [REFRESH]
   IF MouseY >= 345 AND MouseY < 375 THEN FilenameNext$ = Dance$(11) GOTO [REFRESH]
   IF MouseY >= 375 AND MouseY < 405 THEN FilenameNext$ = Dance$(12) GOTO [REFRESH]
   IF MouseY >= 405 AND MouseY < 435 THEN FilenameNext$ = Dance$(13) GOTO [REFRESH]
   IF MouseY >= 435 AND MouseY < 465 THEN FilenameNext$ = Dance$(14) GOTO [REFRESH]
   IF MouseY >= 465 AND MouseY < 495 THEN FilenameNext$ = Dance$(15) GOTO [REFRESH]
   IF MouseY >= 495 AND MouseY < 525 THEN FilenameNext$ = Dance$(16) GOTO [REFRESH]
   IF MouseY >= 525 AND MouseY < 555 THEN FilenameNext$ = Dance$(17) GOTO [REFRESH]
   IF MouseY >= 555 AND MouseY < 585 THEN FilenameNext$ = Dance$(18) GOTO [REFRESH]
   IF MouseY >= 585 AND MouseY < 615 THEN FilenameNext$ = Dance$(19) GOTO [REFRESH]
   IF MouseY >= 615 AND MouseY < 645 THEN FilenameNext$ = Dance$(20) GOTO [REFRESH]
   IF MouseY >= 645 AND MouseY < 675 THEN FilenameNext$ = Dance$(21) GOTO [REFRESH]
   IF MouseY >= 675 AND MouseY < 705 THEN FilenameNext$ = Dance$(22) GOTO [REFRESH]
   IF MouseY >= 705 AND MouseY < 735 THEN FilenameNext$ = Dance$(23) GOTO [REFRESH]
   IF MouseY >= 735 AND MouseY < 765 THEN FilenameNext$ = Dance$(24) GOTO [REFRESH]
   IF MouseY >= 765 AND MouseY < 795 THEN FilenameNext$ = Dance$(25) GOTO [REFRESH]
   IF MouseY >= 795 AND MouseY < 825 THEN FilenameNext$ = Dance$(26) GOTO [REFRESH]
   IF MouseY >= 825 AND MouseY < 855 THEN FilenameNext$ = Dance$(27) GOTO [REFRESH]
   IF MouseY >= 855 AND MouseY < 885 THEN FilenameNext$ = Dance$(28) GOTO [REFRESH]
   IF MouseY >= 885 AND MouseY < 915 THEN FilenameNext$ = Dance$(29) GOTO [REFRESH]
   IF MouseY >= 915                  THEN FilenameNext$ = ""         GOTO [REFRESH]
   WAIT

[ABOUT]
      NOTICE "à propos de..."+CHR$(13)+_
      "              --- K'elle Danse ---"+CHR$(13)+CHR$(13)+_
      "version "+PrgVersion$+" / résolution 1920x1080"+CHR$(13)+CHR$(13)
   WAIT
Re: Overlaying GRAPHICBOXES in window
Post by Richard Russell on Jul 5th, 2017, 4:18pm

on Jul 5th, 2017, 2:37pm, Rod wrote:
Not sure if this helps or not.

The same end result but achieved without any API calls (even works in Just BASIC):

Code:
nomainwin
WindowWidth  = 200
WindowHeight = 200
UpperLeftX = (DisplayWidth-WindowWidth)/2
UpperLeftY = (DisplayHeight-WindowHeight)/2
open "Graphic" for graphics_nsb as #1
#1 "trapclose [quit]"
#1 "down; fill blue; color yellow; backcolor blue"
#1 "font Consolas 40 ; place 30 110 ;\Text"
#1 "rule ";_R2_MASKNOTPEN
#1 "color blue; backcolor blue; place 0 0 ; boxfilled 200 100"
#1 "rule ";_R2_MERGEPEN
#1 "color red ; backcolor red; place 0 0 ; boxfilled 200 100"
wait 

[quit]
close #1
end

Richard.

Re: Overlaying GRAPHICBOXES in window
Post by tsh73 on Jul 5th, 2017, 5:41pm

Quote:
The same end result but achieved without any API calls (even works in Just BASIC):

LOL
The point is that Rod's code draws transparent text on any background.
Any fancy loaded bitmap.

Speaking of "without any API calls"
As far as I remember, LB/JB drawbmp is not affected with RULE command.
Does LBB drawbmp obeys RULE command?
It looks something is changing.
So may be where is a way to make text look transparent on bitmap background, using RULE command?

EDIT and it looks like printing text is not affected with RULE command...

EDIT
Quote:
Does LBB drawbmp obeys RULE command?
It looks something is changing.

Not? sad((
Re: Overlaying GRAPHICBOXES in window
Post by Rod on Jul 5th, 2017, 7:18pm

Uggg, not able to run the code too much missing info. It looks like you want to list dance routines and have the user click on one.

You seem to have a graphicbox set to do this with areas set for each dance routine. You will print text or draw graphics in each area that identifies the dance routine and the mouse will select them.

What are all the statictext commands for?

You could just have one single bmp with the selections pre drawn. So I am not understanding why it is getting so complex.

Why not forget the code for now and tell us in as many words as you can what the screen should look like and how the user should interact with it.
Re: Overlaying GRAPHICBOXES in window
Post by Richard Russell on Jul 5th, 2017, 8:15pm

on Jul 5th, 2017, 5:41pm, tsh73 wrote:
Does LBB drawbmp obeys RULE command?

Remember, in both LB and LBB (and JB) the graphics capabilities are simply 'thin wrappers' around the Windows API (GDI). In each case the 'heavy lifting' is done by Windows itself so, pretty much without exception, you can assume that they will work the same way.

Indeed, you can often ascertain how they will work by checking the documentation at MSDN. In this case, LB's rule command translates directly to the SetROP2 API. If you look up that function at MSDN you will find that it says "The SetROP2 function sets the current foreground mix mode. GDI uses the foreground mix mode to combine pens and interiors of filled objects with the colors already on the screen". So only "pens and interiors of filled objects" are affected by rule.

Richard.
Re: Overlaying GRAPHICBOXES in window
Post by flotulopex on Jul 5th, 2017, 8:15pm

Hi Rod,

I thought just running my code would be self explaining (...).

Quote:
not able to run the code too much missing info.
As far as I could test, anything is in the exe file I sent a link for in a previous post.
Re: Overlaying GRAPHICBOXES in window
Post by flotulopex on Jul 5th, 2017, 8:22pm

Quote:
What are all the statictext commands for?

I'm populating a list of dances that will appear in the side window and as you noticed, I'm detecting the mouse position to make the selection.

Quote:
You could just have one single bmp with the selections pre drawn. So I am not understanding why it is getting so complex.

I actually did this in my version 0-0-1-0. But then, again, this are hard coded and I hate this. It is here http://home.citycable.ch/flotulopex/LBB/Image%20Launcher.exe
Re: Overlaying GRAPHICBOXES in window
Post by flotulopex on Jul 5th, 2017, 8:26pm

Using a "graphics" type window, I cant get rid of the title bar.
Re: Overlaying GRAPHICBOXES in window
Post by Richard Russell on Jul 5th, 2017, 10:22pm

on Jul 5th, 2017, 8:26pm, flotulopex wrote:
Using a "graphics" type window, I cant get rid of the title bar.

As you say, there is no built-in window type that supports graphics but which has no title bar. You could presumably use STYLEBITS to create one, or alternatively use a window of type WINDOW_POPUP containing a GRAPHICBOX control, as the program you listed earlier does.

Richard.
Re: Overlaying GRAPHICBOXES in window
Post by flotulopex on Jul 7th, 2017, 07:57am

...so is there any solution to draw text over my background or not?
Re: Overlaying GRAPHICBOXES in window
Post by Richard Russell on Jul 7th, 2017, 08:30am

on Jul 7th, 2017, 07:57am, flotulopex wrote:
...so is there any solution to draw text over my background or not?

Both Anatoly (tsh73) and Rod have given you solutions with worked examples. What is stopping you adapting their code to suit your precise requirements? If you were hoping that somebody else would modify your program, I think you will find that most people prefer to give hints and pointers to encourage you to learn for yourself.

Richard.
Re: Overlaying GRAPHICBOXES in window
Post by Rod on Jul 7th, 2017, 11:44am

None of the links you provided us with actually lead to runnable code. Even the .exe does not run because of missing graphic resources. If you want us to help with your actual code you will need to zip the .bas file and all needed resources to a folder and share a link to that. Put everything in a new folder Right Click on it and choose Send To then choose zipped folder. Now put the .zip somewhere we can share.
Re: Overlaying GRAPHICBOXES in window
Post by tsh73 on Jul 7th, 2017, 11:50am

I did run the EXE (may be it was previous version) but alas my montor works only up to 1280x1024, so I cannot work with program written to 1900xsomething.
Re: Overlaying GRAPHICBOXES in window
Post by Richard Russell on Jul 7th, 2017, 12:45pm

on Jul 7th, 2017, 11:44am, Rod wrote:
If you want us to help with your actual code you will need to zip the .bas file and all needed resources to a folder and share a link to that.

Or use LBB's capability of embedding the resource files in the EXE (they are compressed when you do that)!

Richard.
Re: Overlaying GRAPHICBOXES in window
Post by flotulopex on Jul 7th, 2017, 2:03pm

Rod, I already posted my full code in previous post in this thread wink

Nevertheless, I have zipped all the files again and here is the link the this file: http://home.citycable.ch/flotulopex/LBB/ZIPped/

Thanks a lot for the already provided solutions. Unfortunately, I can't use "graphics" type window as I can't get rid of the title bar (or did I miss something?).

The resolution of 1920x1080 is due to the fact that this program is displaying via a beamer on a quite big screen (3m x 1m70). I already tested with lower resolution but the images look crap embarassed
Re: Overlaying GRAPHICBOXES in window
Post by Richard Russell on Jul 7th, 2017, 2:45pm

on Jul 7th, 2017, 2:03pm, flotulopex wrote:
Unfortunately, I can't use "graphics" type window as I can't get rid of the title bar (or did I miss something?).

Yes, you evidently missed my reply in which I stated that you can either use STYLEBITS to remove the title bar or alternatively use a WINDOW_POPUP containing a GRAPHICBOX control. There's not much to choose between these solutions.

I know that Conforums doesn't always reliably list all replies in the "10 most recent posts on this forum" summary, but if you go directly to the thread you should find them.

Quote:
The resolution of 1920x1080 is due to the fact that this program is displaying via a beamer on a quite big screen (3m x 1m70).

Ideally your program should adapt to the current DisplayWidth and DisplayHeight values, that way anybody will be able to run it. Even if the text and image quality is poor on smaller screen sizes, that way you are more likely to receive offers of help.

Richard.
Re: Overlaying GRAPHICBOXES in window
Post by flotulopex on Jul 7th, 2017, 2:54pm

Thanks Richard wink
Re: Overlaying GRAPHICBOXES in window
Post by Rod on Jul 8th, 2017, 09:06am

Ok, your code is still not showing me what's wrong because of the screen size. Can you put together a very simple demo of what the problem is using a small 800x600 screen. You don't need a bunch of code just enough to show us what it is about the statictexts and bmps and text rendering that isn't working for you.

Even try adapting my demo to show your problem.
Re: Overlaying GRAPHICBOXES in window
Post by flotulopex on Jul 9th, 2017, 11:38am

Hi Rod,

Thanks for helping wink

Here's the link to a minimized piece of code in a (for you) 800x600 pixels resolution of what I want to achieve.

http://home.citycable.ch/flotulopex/LBB/800x600.zip

For any reason I don't understand right now, it's working (!!!) meaning: I can now overlay a statictext over a bmp backround. I started to search my original code why it is not working there.

If you still want to test it, run it and left-click anywhere on the left side of your screen will make some text appear while left-clicking on the right will make it disappear.
Re: Overlaying GRAPHICBOXES in window
Post by Richard Russell on Jul 9th, 2017, 12:01pm

on Jul 9th, 2017, 11:38am, flotulopex wrote:
For any reason I don't understand right now, it's working (!!!) meaning: I can now overlay a statictext over a bmp backround.

I'm not enthusiastic about doing that. It is reliant on the window Z-order and on the correct use of the WS_CLIPCHILDREN stylebit, and whilst this should work it seems to be taking an unnecessary risk.

The LB 4 Help file specifically states "Some controls do not work properly when placed in graphicboxes or graphics windows. If there is a need for text display within a graphicbox or graphics window, use the graphics text capabilities rather than a statictext control". Although LBB makes no such stipulation, there is a danger that you may break compatibility with LB 4.

Also, in order to make the edge of the STATICTEXT control invisible you must precisely match its background color to the BMP 'behind', and whilst you can do this in LBB (because the BackgroundColor$ variable can take an RGB parameter) in LB 4 you can't.

Obviously I don't think retaining LB 4 compatibility is that important, but neither do I encourage unnecessarily breaking it.

Richard.
Re: Overlaying GRAPHICBOXES in window
Post by flotulopex on Jul 9th, 2017, 12:03pm

The simple version just posted a few minutes ago works well because it is ultra-simple...but I can't use it.

I'm now trying to display both texts in different colors and trouble begins.

Let's try to solve problems one-by-one. Here is another piece of code, still 800x600 pixels where I display now 2 texts.

http://home.citycable.ch/flotulopex/LBB/800x600_colors.bas

How do I do this?
Overlaying GRAPHICBOXES in window
Post by flotulopex on Jul 9th, 2017, 12:11pm

on Jul 9th, 2017, 12:01pm, Richard Russell wrote:
The LB 4 Help file specifically states "[i]Some controls do not work properly when placed in graphicboxes or graphics windows.

I will not be able to use a graphics type window anyway since I can't get rid of the title bar embarassed
Re: Overlaying GRAPHICBOXES in window
Post by Richard Russell on Jul 9th, 2017, 2:37pm

on Jul 9th, 2017, 12:11pm, flotulopex wrote:
I will not be able to use a graphics type window anyway since I can't get rid of the title bar :-[

Please stop saying that! I have twice told you how to remove the title bar; the second time you even thanked me for the information. I have even given you two different methods, which work in both LB 4 and LBB (example program below).

Richard.

Code:
    UpperLeftX = 100 : UpperLeftY = 100
    stylebits #w1, _WS_POPUP, _WS_CAPTION + _WS_THICKFRAME, 0, 0
    open "" for graphics_nsb as #w1
    #w1 "down; fill blue; backcolor blue; color yellow"
    #w1 "place 80 140"
    #w1 "\Graphics with no title bar"
    #w1 "place 120 160"
    #w1 "\(method one)"

    UpperLeftX = 500 : UpperLeftY = 100
    graphicbox #w2.gb, 0, 0, WindowWidth, WindowHeight
    open "" for window_popup as #w2
    #w2.gb "down; fill blue; backcolor blue; color yellow"
    #w2.gb "place 80 140"
    #w2.gb "\Graphics with no title bar"
    #w2.gb "place 120 160"
    #w2.gb "\(method two)"

    wait
Re: Overlaying GRAPHICBOXES in window
Post by flotulopex on Jul 9th, 2017, 8:20pm

Quote:
I have twice told you how to remove the title bar
You're right. I thanked you for helping and so I went searching again about the stylebits for hours but couldn't find any working solution. Even if I would have found the correct stylebits, I probably wouldn't have been successful anyway since I wouldn't have had the idea to put it before the OPEN command.

I still don't understand the logic of the semantic in LB/LBB* - I need more time to get this.

Method 2 (window_popup type) is the one I already use in all the code I made up to now.

*I'm used to program microcontrollers. The code making is really straight forward.
Re: Overlaying GRAPHICBOXES in window
Post by Richard Russell on Jul 9th, 2017, 9:25pm

on Jul 9th, 2017, 8:20pm, flotulopex wrote:
Even if I would have found the correct stylebits, I probably wouldn't have been successful anyway since I wouldn't have had the idea to put it before the OPEN command.

From the LB 4.5.0 Help documentation: "The STYLEBITS command must be issued before the command to open the window".

You would have to ask Carl why he chose that approach, rather than the (perhaps) more natural one of making the style a parameter of the OPEN statement. My guess would be because it was an addition to the language, and using that method meant that the OPEN statement could be left unchanged.

Quote:
I still don't understand the logic of the semantic in LB/LBB* - I need more time to get this.

One of the nice things about writing a clone of a language is not having to justify the way it works! grin

Richard.
Re: Overlaying GRAPHICBOXES in window
Post by Rod on Jul 10th, 2017, 10:15am

Only had time to look at the code today. As Richard says you should not be attempting to combine statictext and graphicboxes. It is perfectly possible to do everything you want inside the graphicbox. You can lay out the text precisely and you can have the mouse react to clicks on ir inside the text area. So forget statictext and practice some of the graphics commands.


Code:
    ' 800x600

    NOMAINWIN

    UpperLeftX   = 0
    UpperLeftY   = 0
    WindowWidth  = 800
    WindowHeight = 600
    GRAPHICBOX #Main.GBx1,0,0,800,600
    STYLEBITS #Main.GBx1,0,_WS_BORDER,0,0 'remove image's border
    OPEN "800x600" FOR window_popup AS #Main
    'get the handle of the graphicbox
    hWD=hwnd(#Main.GBx1)
    'get the handle of the DC
    CallDll #user32, "GetDC", hWD as ulong, hDC as ulong
    'set text to render with transparent background
    calldll #gdi32, "SetBkMode",hDC as ulong,_TRANSPARENT as long, re as long

[MAIN]
   #Main.GBx1 "font tahoma 100 bold"
   #Main.GBx1 "down; fill darkred ; flush bak"
   #Main.GBx1 "when leftButtonDown [MouseLeftButton]"
   WAIT

[QUIT]
   CLOSE #Main
   END

[MouseLeftButton]
   IF MouseX < 100 THEN #Main.GBx1 "discard ; redraw bak"
   IF MouseX > 100 THEN
        #Main.GBx1 "discard ; redraw bak"
        #Main.GBx1 "color green ; place 100 300 ;\TEXT"
        #Main.GBx1 "color red ; place 100 400 ;\TEXT"
   end if
   IF MouseX > 750 and MouseY < 50 then close #Main : end
   WAIT
Re: Overlaying GRAPHICBOXES in window
Post by Rod on Jul 10th, 2017, 11:29am

This lists the dances, it scrolls and you can select a dance. It could be smoother and fancier. But it is kinda doing what you want.


Code:
dim dance$(23)
dance$(1)="Bachata"
dance$(2)="Cha-cha-cha"
dance$(3)="Cha-cha-cha latino"
dance$(4)="Disco-Fox"
dance$(5)="Jive"
dance$(6)="Kizomba"
dance$(7)="Lindy Hop"
dance$(8)="Mambo"
dance$(9)="Merengue"
dance$(10)="Paso-Doble"
dance$(11)="Quickstep"
dance$(12)="Rock'n Roll"
dance$(13)="Rumba"
dance$(14)="Salsa cubaine"
dance$(15)="Salsa portoricaine"
dance$(16)="Samba"
dance$(17)="Semba"
dance$(18)="Slow-Fox"
dance$(19)="Tango"
dance$(20)="Tango argentin"
dance$(21)="Valse anglaise"
dance$(22)="Valse viennoise"
dance$(23)="West Coast Swing"



    ' 800x600

    NOMAINWIN

    UpperLeftX   = 0
    UpperLeftY   = 0
    WindowWidth  = 800
    WindowHeight = 600
    GRAPHICBOX #Main.GBx1,0,0,800,600
    STYLEBITS #Main.GBx1,0,_WS_BORDER,0,0 'remove image's border
    OPEN "800x600" FOR window_popup AS #Main
    'get the handle of the graphicbox
    hWD=hwnd(#Main.GBx1)
    'get the handle of the DC
    CallDll #user32, "GetDC", hWD as ulong, hDC as ulong
    'set text to render with transparent background
    calldll #gdi32, "SetBkMode",hDC as ulong,_TRANSPARENT as long, re as long

[MAIN]
   #Main.GBx1 "font tahoma 40 bold"
   #Main.GBx1 "down; fill darkred ;color red ;place 750 50 ;\X"
   #Main.GBx1 "place 350 40 ; color yellow ;\up"
   #Main.GBx1 "place 300 600 ; color yellow ;\down"
   [sphere]
    xS =200
    yS =200
    for radius =150 to 0 step -1
        level$ =str$( int( 256 -256 *radius /150))
        c$ =level$ +" " +level$ +" " +level$ 
        #Main.GBx1 "color ";     c$
        #Main.GBx1 "backcolor "; c$
        #Main.GBx1 "place "; xS; " "; yS
        xS =xS -0.5
        yS =yS -0.2
        #Main.GBx1 "circlefilled "; radius
        for n= 1 to 360
            x=xS-(radius*sin(n/57.29577951))
            y=yS-(radius*cos(n/57.29577951))
            #Main.GBx1 "set ";x;" ";y
        next n
    next radius
   #Main.GBx1 "getbmp bak 0 0 800 600 ; discard ; drawbmp bak 0 0 ; flush bak"
   #Main.GBx1 "when leftButtonDown [MouseLeftButton]"
   pos=1
   WAIT


[MouseLeftButton]
   IF MouseX < 100 THEN #Main.GBx1 "discard ; redraw bak"
   IF MouseX > 100 THEN
        if MouseY<50 then pos=pos-(pos>1)*3
        if MouseY>550 then pos=pos+(pos<13)*3
        #Main.GBx1 "discard ; redraw bak"
        for n= 0 to 9
        if MouseY>50+n*50 and MouseY<100+n*50 then #Main.GBx1 "color green"
        #Main.GBx1 "place 250 ";100+n*50;";\";dance$(pos+n)
        #Main.GBx1 "color red"
        next

   end if
   IF MouseX > 750 and MouseY < 50 then close #Main : end
   WAIT
Overlaying GRAPHICBOXES in window
Post by flotulopex on Jul 11th, 2017, 4:44pm

Thanks a lot Rod,

Your example looks very good smiley

I will try to change my code according to your suggestions.