Custom BUTTONS for BBC Basic !! Stages...
Post by michael on Mar 14th, 2016, 09:51am
Soon you will see a full blown graphics interface library.
I think BBC does deserve real super easy to use interactive buttons, radio buttons, and of course custom graphics text boxes.
( am aware of the windows commands and I am not at that level yet)
Each button will have reactivity to the mouse and will change when clicked...
Its really easy guys!!
All of this can be done within the graphics display!!
This is just the custom buttons that I made in 5 min.. I plan to compact the program and make a library.
This is STAGE 1.. The design and idea.
Code:
REM SET MODE TO 8 USING VDU
VDU 22,8
REM SET LINE THICKNESS TO 3
VDU 23,23,3|
OFF
GCOL 1
PROC_button(500,500,20,25,190,200,190,50)
PROC_button(600,500,10,15,100,200,100,60)
PROC_button(650,500,10,15,100,200,200,60)
END
DEF PROC_button(H,V,BEGIN,SIZE,X,C,A,DI)
R=X
G=C
B=A
P=SIZE-BEGIN
P=P/2
P=BEGIN+P
FOR Y=P TO SIZE
COLOUR 1,X,C,A
LINE H-Y,V-Y,H+Y,V-Y
LINE H+Y,V-Y,H+Y,V+Y
LINE H+Y,V+Y,H-Y,V+Y
LINE H-Y,V+Y,H-Y,V-Y
X=X-DI
C=C-DI
A=A-DI
IF X<2 THEN X=2
IF C<2 THEN C=2
IF A<2 THEN A=2
NEXT Y
P=SIZE-BEGIN
P=P/2
P=BEGIN+P
FOR Y=BEGIN TO P
COLOUR 1,X,C,A
LINE H-Y,V-Y,H+Y,V-Y
LINE H+Y,V-Y,H+Y,V+Y
LINE H+Y,V+Y,H-Y,V+Y
LINE H-Y,V+Y,H-Y,V-Y
X=X+DI
C=C+DI
A=A+DI
NEXT Y
COLOUR 1,R,G,B
FILL H,V
ENDPROC
STAGE 2 IS HERE
And this next step proves the function of the button area can be monitored efficiently:
Copy and Paste the Next program in the editor and run.
Left Click on the buttons with your mouse and you will see they are unique in their own space!! This is excellent!!
AND the button identification is known in IDX and IDY !!
Technically I only need one of the values as the DIM arrays are only for holding the button location and they share the same button number.
(that is quite something if you can make 2 single Arrays technically be responsible for holding 3 types of values .. That saved me some code)
(now to make them flash when they are clicked....)
Code: DIM Buttx(10)
DIM Butty(10)
REM SET MODE TO 8 USING VDU
VDU 22,8
REM SET LINE THICKNESS TO 3
VDU 23,23,3|
REM OFF
GCOL 1
PROC_button(500,500,20,25,190,200,190,50,1)
PROC_button(600,500,10,15,100,200,100,60,2)
PROC_button(650,500,10,15,100,200,200,60,3)
(mou)
MOUSE xx,yy,b
IF b=4 THEN GOTO (CHECKBUTTONS)
GOTO (mou)
END
(CHECKBUTTONS)
FOR BCOUNT=1 TO 10
IF xx>Buttx(BCOUNT)-15 AND xx<Buttx(BCOUNT)+15 AND yy>Butty(BCOUNT)-15 AND yy<Butty(BCOUNT)+15 THEN
X=RND(100)
Y=RND(100)
CC=RND(200)
COLOUR 1,X+Y,CC,Y+X
LINE X,Y,X,Y
IDX=BCOUNT:IDY=BCOUNT REM Technically I only need one of these to identify the button clicked
ENDIF
NEXT BCOUNT
GOTO (mou)
DEF PROC_button(H,V,BEGIN,SIZE,X,C,A,DI,butnu)
Buttx(butnu)=H
Butty(butnu)=V
R=X
G=C
B=A
P=SIZE-BEGIN
P=P/2
P=BEGIN+P
FOR Y=P TO SIZE
COLOUR 1,X,C,A
LINE H-Y,V-Y,H+Y,V-Y
LINE H+Y,V-Y,H+Y,V+Y
LINE H+Y,V+Y,H-Y,V+Y
LINE H-Y,V+Y,H-Y,V-Y
X=X-DI
C=C-DI
A=A-DI
IF X<2 THEN X=2
IF C<2 THEN C=2
IF A<2 THEN A=2
NEXT Y
P=SIZE-BEGIN
P=P/2
P=BEGIN+P
FOR Y=BEGIN TO P
COLOUR 1,X,C,A
LINE H-Y,V-Y,H+Y,V-Y
LINE H+Y,V-Y,H+Y,V+Y
LINE H+Y,V+Y,H-Y,V+Y
LINE H-Y,V+Y,H-Y,V-Y
X=X+DI
C=C+DI
A=A+DI
NEXT Y
COLOUR 1,R,G,B
FILL H,V
ENDPROC
Re: Custom BUTTONS for BBC Basic !! Stages...
Post by DDRM on Mar 14th, 2016, 2:04pm
Hi Michael,
It's great that you are so keen to "roll your own", and I note your tagline that you like to reinvent the wheel, but if you are aiming your comments at beginners it's maybe worth pointing out that this is already pretty easy (and more consistent with normal Windows practice), using the libraries.
Code: MODE 8
INSTALL @lib$+"WINLIB5"
b1%=FN_button("Add one to a%",10,10,150,30,101,0)
b2%=FN_button("Subtract one from a%",170,10,150,30,102,0)
b3%=FN_button("I've had enough now",370,300,150,30,103,0)
ON SYS PROCDoButtons(@wparam%):RETURN
a%=0
finished%=FALSE
REPEAT
WAIT 1
PRINT TAB(10,10),a%;" "
REM Your program could be doing something interesting in here!
UNTIL finished%
PROC_closewindow(b1%)
PROC_closewindow(b2%)
PROC_closewindow(b3%)
END
:
DEFPROCDoButtons(w%)
CASE w% OF
WHEN 101: a%+=1
WHEN 102:a%-=1
WHEN 103:finished%=TRUE
ENDCASE
ENDPROC
Best wishes,
D
Re: Custom BUTTONS for BBC Basic !! Stages...
Post by michael on Mar 14th, 2016, 2:17pm
Thanks for that. I guess Ill study your example.
Yes, it has been a habit of mine to try my own reinvented version of things. Thinking I could make a custom wheel that worked better for some people including me.
Re: Custom BUTTONS for BBC Basic !! Stages...
Post by sveinioslo on Mar 14th, 2016, 10:29pm
Hi Michael
You have an eye for design, i really like your work. Keep it up :) !
Like DDRM says, there are libraries for things like buttons.
But their design are so boring. !
This thread gave me an idea:
What if one combine your nice buttons with the existing ones ?
The example program does just that, i have only made minor modifications to your code, and added some, of course.
Makes me wonder if/how one can improve other elements too.
Svein
Code: LR_LOADFROMFILE = 16
BM_SETIMAGE = 247
BS_BITMAP = &80
ON CLOSE : PROCclose : QUIT
INSTALL @lib$+"winlib5"
REM SET MODE TO 8 USING VDU
VDU 22,8
REM SET LINE THICKNESS TO 3
VDU 23,23,3|
REM OFF
GCOL 1
REM create and save button images------------------------------------
PROC_button(500,500,20,25,190,200,190,50,1)
file1$=@usr$+"butt1.bmp"
pos1$="470,470,60,60"
OSCLI "SCREENSAVE "+file1$+" "+pos1$
PROC_button(600,500,10,15,100,200,100,60,2)
file2$=@usr$+"butt2.bmp"
pos2$="580,480,40,40"
OSCLI "SCREENSAVE "+file2$+" "+pos2$
PROC_button(650,500,10,15,200,100,200,60,3)
file3$=@usr$+"butt3.bmp"
pos3$="630,480,40,40"
OSCLI "SCREENSAVE "+file3$+" "+pos3$
CLS
REM -----------------------------------------------------------------
REM create buttons --------------------------------------------------
butnu1=FN_button("",300,195,30,30,FN_setproc(PROCbutnu1),BS_BITMAP)
butnu2=FN_button("",350,200,20,20,FN_setproc(PROCbutnu2),BS_BITMAP)
butnu3=FN_button("",375,200,20,20,FN_setproc(PROCbutnu3),BS_BITMAP)
REM -----------------------------------------------------------------
REM assign images to buttons----------------------------------------
SYS "LoadImage", 0, file1$, 0, 30, 30, LR_LOADFROMFILE TO hbitmap1
SYS "SendMessage", butnu1, BM_SETIMAGE, 0, hbitmap1
SYS "LoadImage", 0, file2$, 0, 20, 20, LR_LOADFROMFILE TO hbitmap2
SYS "SendMessage", butnu2, BM_SETIMAGE, 0, hbitmap2
SYS "LoadImage", 0, file3$, 0, 20, 20, LR_LOADFROMFILE TO hbitmap3
SYS "SendMessage", butnu3, BM_SETIMAGE, 0, hbitmap3
REM -----------------------------------------------------------------
REM MAIN --------------------------------
(mou)
WAIT 0 : REM just wait, nothing to do !
GOTO (mou)
REM -------------------------------------
REM clicking buttons will jump here automatically -------------------
DEF PROCbutnu1 : PRINTTAB(0,27);"Button 1"
DEF PROCbutnu2 : PRINTTAB(0,27);"Button 2"
DEF PROCbutnu3 : PRINTTAB(0,27);"Button 3"
LOCAL X,Y,CC,I%
FOR I%=1 TO 20000
X=RND(100)
Y=RND(100)
CC=RND(200)
COLOUR 1,X+Y,CC,Y+X
LINE X,Y,X,Y
NEXT I%
ENDPROC
REM -----------------------------------------------------------------
DEF PROC_button(H,V,BEGIN,SIZE,X,C,A,DI,butnu)
R=X
G=C
B=A
P=SIZE-BEGIN
P=P/2
P=BEGIN+P
FOR Y=P TO SIZE
COLOUR 1,X,C,A
LINE H-Y,V-Y,H+Y,V-Y
LINE H+Y,V-Y,H+Y,V+Y
LINE H+Y,V+Y,H-Y,V+Y
LINE H-Y,V+Y,H-Y,V-Y
X=X-DI
C=C-DI
A=A-DI
IF X<2 THEN X=2
IF C<2 THEN C=2
IF A<2 THEN A=2
NEXT Y
FOR Y=BEGIN TO P
COLOUR 1,X,C,A
LINE H-Y,V-Y,H+Y,V-Y
LINE H+Y,V-Y,H+Y,V+Y
LINE H+Y,V+Y,H-Y,V+Y
LINE H-Y,V+Y,H-Y,V-Y
X=X+DI
C=C+DI
A=A+DI
NEXT Y
COLOUR 1,R,G,B
FILL H,V
ENDPROC
REM delete the stuff we made
DEF PROCclose
SYS "DeleteObject", hbitmap1
SYS "DeleteObject", hbitmap2
SYS "DeleteObject", hbitmap3
PROC_closewindow(butnu1)
PROC_closewindow(butnu2)
PROC_closewindow(butnu3)
ENDPROC
Re: Custom BUTTONS for BBC Basic !! Stages...
Post by michael on Mar 14th, 2016, 10:37pm
You are on the same track I was on..
I wanted to make buttons that were novice friendly and completely customizable.
AND extremely compact and use ultra low processor time.
Of course novice friendly can be that way for the person that created it and not so novice friendly to those that didn't.
Also in your modification you helped me learn how the text would be put on the screen properly. I like it to look professional..
You did what I wanted it to do.. Now it just needs a small flash.. A button flash must be extremely compact and efficient code. I really am trying to keep the complexity to a minimum.
Maybe the flash could be done with a momentary sprite overlay... hmmmm
NAH! I have a better solution...
Re: Custom BUTTONS for BBC Basic !! Stages...
Post by sveinioslo on Mar 15th, 2016, 12:58am
It would be helpful if you could write a program to demonstrate the flash effect you have in mind.
In the meantime, i have added some relatively simple flash examples.
Button 1: momentarily change the image to a brighter version
Button 2: momentarily hide the button
Button 3: momentarily nudge the button
Svein
Code: SWP_HIDEWINDOW = &80
SWP_NOMOVE = 2
SWP_NOSIZE = 1
SWP_NOZORDER = 4
SWP_SHOWWINDOW = 64
LR_LOADFROMFILE = 16
BM_SETIMAGE = 247
BS_BITMAP = &80
ON CLOSE : PROCclose : QUIT
INSTALL @lib$+"winlib5"
INSTALL @lib$+"timerlib"
REM SET MODE TO 8 USING VDU
VDU 22,8
REM SET LINE THICKNESS TO 3
VDU 23,23,3|
REM OFF
GCOL 1
REM create and save button images------------------------------------
PROC_button(500,500,20,25,190,200,190,50,1)
file1$=@usr$+"butt1.bmp"
pos1$="470,470,60,60"
OSCLI "SCREENSAVE "+file1$+" "+pos1$
PROC_button(600,500,10,15,100,200,100,60,2)
file2$=@usr$+"butt2.bmp"
pos2$="580,480,40,40"
OSCLI "SCREENSAVE "+file2$+" "+pos2$
PROC_button(650,500,10,15,200,100,200,60,3)
file3$=@usr$+"butt3.bmp"
pos3$="630,480,40,40"
OSCLI "SCREENSAVE "+file3$+" "+pos3$
CLS
PROC_button(500,500,20,25,190+50,200+50,190+50,50,1)
file1b$=@usr$+"butt1b.bmp"
pos1b$="470,470,60,60"
OSCLI "SCREENSAVE "+file1b$+" "+pos1b$
CLS
REM -----------------------------------------------------------------
REM create buttons --------------------------------------------------
butnu1=FN_button("",300,195,30,30,FN_setproc(PROCbutnu1),BS_BITMAP)
butnu2=FN_button("",350,200,20,20,FN_setproc(PROCbutnu2),BS_BITMAP)
butnu3=FN_button("",375,200,20,20,FN_setproc(PROCbutnu3),BS_BITMAP)
REM -----------------------------------------------------------------
REM assign images to buttons----------------------------------------
SYS "LoadImage", 0, file1$, 0, 30, 30, LR_LOADFROMFILE TO hbitmap1
SYS "SendMessage", butnu1, BM_SETIMAGE, 0, hbitmap1
SYS "LoadImage", 0, file2$, 0, 20, 20, LR_LOADFROMFILE TO hbitmap2
SYS "SendMessage", butnu2, BM_SETIMAGE, 0, hbitmap2
SYS "LoadImage", 0, file3$, 0, 20, 20, LR_LOADFROMFILE TO hbitmap3
SYS "SendMessage", butnu3, BM_SETIMAGE, 0, hbitmap3
SYS "LoadImage", 0, file1b$, 0, 26, 26, LR_LOADFROMFILE TO hbitmap1b
REM -----------------------------------------------------------------
REM MAIN --------------------------------
(mou)
WAIT 0 : REM just wait, nothing to do !
GOTO (mou)
REM -------------------------------------
REM clicking buttons will jump here automatically -------------------
DEF PROCbutnu1 : PRINTTAB(0,27);"Button 1" : PROCflash1
DEF PROCbutnu2 : PRINTTAB(0,27);"Button 2" : PROCflash2
DEF PROCbutnu3 : PRINTTAB(0,27);"Button 3" : PROCflash3
LOCAL X,Y,CC,I%
FOR I%=1 TO 20000
X=RND(100)
Y=RND(100)
CC=RND(200)
COLOUR 1,X+Y,CC,Y+X
LINE X,Y,X,Y
NEXT I%
ENDPROC
REM -----------------------------------------------------------------
DEF PROCflash1 : LOCAL A%
SYS "SendMessage", butnu1, BM_SETIMAGE, 0, hbitmap1b
A%=FN_ontimer(100,PROCflash1off,0)
ENDPROC
DEF PROCflash1off
SYS "SendMessage", butnu1, BM_SETIMAGE, 0, hbitmap1
ENDPROC
DEF PROCflash2 : LOCAL A%
SYS "SetWindowPos", butnu2, 0, 0, 0, 0, 0, SWP_NOMOVE+SWP_NOZORDER+SWP_NOSIZE+SWP_HIDEWINDOW
A%=FN_ontimer(100,PROCflash2off,0)
ENDPROC
DEF PROCflash2off
SYS "SetWindowPos", butnu2, 0, 0, 0, 0, 0, SWP_NOMOVE+SWP_NOZORDER+SWP_NOSIZE+SWP_SHOWWINDOW
ENDPROC
DEF PROCflash3 : LOCAL A%
SYS "SetWindowPos", butnu3, 0, 0, 0, 15, 15, SWP_NOMOVE+SWP_NOZORDER
A%=FN_ontimer(100,PROCflash3off,0)
ENDPROC
DEF PROCflash3off
SYS "SetWindowPos", butnu3, 0, 0, 0, 20, 20, SWP_NOMOVE+SWP_NOZORDER
ENDPROC
DEF PROC_button(H,V,BEGIN,SIZE,X,C,A,DI,butnu)
R=X
G=C
B=A
P=SIZE-BEGIN
P=P/2
P=BEGIN+P
FOR Y=P TO SIZE
COLOUR 1,X,C,A
LINE H-Y,V-Y,H+Y,V-Y
LINE H+Y,V-Y,H+Y,V+Y
LINE H+Y,V+Y,H-Y,V+Y
LINE H-Y,V+Y,H-Y,V-Y
X=X-DI
C=C-DI
A=A-DI
IF X<2 THEN X=2
IF C<2 THEN C=2
IF A<2 THEN A=2
NEXT Y
FOR Y=BEGIN TO P
COLOUR 1,X,C,A
LINE H-Y,V-Y,H+Y,V-Y
LINE H+Y,V-Y,H+Y,V+Y
LINE H+Y,V+Y,H-Y,V+Y
LINE H-Y,V+Y,H-Y,V-Y
X=X+DI
C=C+DI
A=A+DI
NEXT Y
COLOUR 1,R,G,B
FILL H,V
ENDPROC
REM delete the stuff we made
DEF PROCclose
SYS "DeleteObject", hbitmap1
SYS "DeleteObject", hbitmap2
SYS "DeleteObject", hbitmap3
SYS "DeleteObject", hbitmap1b
PROC_closewindow(butnu1)
PROC_closewindow(butnu2)
PROC_closewindow(butnu3)
ENDPROC
Re: Custom BUTTONS for BBC Basic !! Stages...
Post by michael on Mar 15th, 2016, 01:13am
As with anything new, I will need to first sample and modify the code offered and attempt to put it into my RGB COLOR MIXER UTILITY I am translating.
I probably could just use the mouse to click on colored areas to make it happen with less code, but then I would be avoiding the real subject of button use.
Bear with me..