Page 1 of 1
Textwriter like on Github
Posted: Sun Feb 11, 2024 2:21 pm
by StarWarsFan
Hey friends!
Has anybody seen an example code of a textwriter such as it is appearing on
https://github.com/signup?source=login
This reminds me so much of good old C64 times that I would like to play with that a little.
Thanks for your input.
Re: Textwriter like on Github
Posted: Tue Feb 13, 2024 12:34 pm
by matalog
Do you want something to enter text into an input field in that manner, as if it were being typed on a keyboard, or do you just want it to appear on your program screen moving like that?
Re: Textwriter like on Github
Posted: Tue Feb 13, 2024 1:14 pm
by NicTheQuick
I don't get what you mean. You only linked the main page of Github.
Re: Textwriter like on Github
Posted: Tue Feb 13, 2024 2:12 pm
by matalog
Something like this:
Code: Select all
If OpenWindow(0, 0, 0, 200, 200, "2DDrawing Example", #PB_Window_SystemMenu | #PB_Window_ScreenCentered)
If CreateImage(0, 200, 200)
StartDrawing(ImageOutput(0))
Box(0, 0, 200, 200, RGB(255, 255, 255))
DrawingMode(#PB_2DDrawing_Transparent)
StopDrawing()
ImageGadget(0, 0, 0, 200, 200, ImageID(0))
message.s ="Hello World!"
ot=0
For i = 1 To 30
For L=1 To Len(message)
StartDrawing(ImageOutput(0))
DrawingMode(#PB_2DDrawing_Transparent)
ot=DrawText(ot,50,Mid(message,L,1) , RGB(Random(255), Random(255), Random(255)))
Delay(300);
StopDrawing()
ImageGadget(0, 0, 0, 200, 200, ImageID(0))
Next
Next i
EndIf
Repeat
Event = WaitWindowEvent()
Until Event = #PB_Event_CloseWindow
EndIf
Re: Textwriter like on Github
Posted: Fri Feb 16, 2024 11:47 pm
by StarWarsFan
matalog wrote: Tue Feb 13, 2024 12:34 pm
Do you want something to enter text into an input field in that manner, as if it were being typed on a keyboard, or do you just want it to appear on your program screen moving like that?
Just look!
https://github.com/signup?source=login
You code looks A BIT like that, but the flashing cursor is the thing that makes is look like in the movies.
Re: Textwriter like on Github
Posted: Sat Feb 17, 2024 7:14 am
by PBJim
Hi StarWarsFan, I also very much appreciate the style of input that you link to. It's a lot easier for me to read than modern Windows GUI inputs with squashed-up and low-contrast text. The closest I've seen in PureBasic, is HeX0R's terminal here, which might be reduced down to a single input line, if HeX0R wouldn't mind.
https://www.purebasic.fr/english/viewto ... al#p479795
It has a background image, but I was able to remove that just now, by commenting-out line 950. The other aspect is that the vertical cursor in the Github example provides a more striking visual effect and I was able to achieve that by commenting-out line 322 and then replacing line 325 with the below. Best, Jim.
Re: Textwriter like on Github
Posted: Sat Feb 17, 2024 10:36 am
by matalog
This is a little better with flashing cursor.
If you want to implement this, it shows you how at least.
Code: Select all
OpenWindow(0, 0, 0, 400, 200, "Typing Text Example", #PB_Window_SystemMenu | #PB_Window_ScreenCentered)
AddWindowTimer(0,1,240)
AddWindowTimer(0,2,50)
CreateImage(0, 400, 200)
StartDrawing(ImageOutput(0))
Box(0, 0, 400, 200, RGB(255, 255, 255))
DrawingMode(#PB_2DDrawing_Transparent)
StopDrawing()
ImageGadget(0, 0, 0, 400, 200, ImageID(0))
Global message.s ="Letters being typed to screen with a cursor following."
Global ot=0
Global L=0
Global col=0
Global ot=0
Procedure type()
L=L+1
StartDrawing(ImageOutput(0))
DrawingMode(#PB_2DDrawing_Transparent)
Line(ot,52,1,12,#White)
ot=DrawText(ot,50,Mid(message,L,1) , RGB(Random(255), Random(255), Random(255)))
StopDrawing()
ImageGadget(0, 0, 0, 200, 200, ImageID(0))
EndProcedure
Procedure flipcursor()
If L & 1
col = #White
Else
col = #Black
EndIf
StartDrawing(ImageOutput(0))
Line(ot,52,1,12,col)
StopDrawing()
ImageGadget(0, 0, 0, 200, 200, ImageID(0))
EndProcedure
Repeat
Repeat
Event = WaitWindowEvent()
If Event = #PB_Event_Timer And EventTimer() = 1
type()
EndIf
If Event = #PB_Event_Timer And EventTimer() = 2
flipcursor()
EndIf
Until L=Len(message) Or #PB_Event_CloseWindow
Until Event = #PB_Event_CloseWindow
Re: Textwriter like on Github
Posted: Sat Feb 17, 2024 2:47 pm
by matalog
One more version:
Code: Select all
OpenWindow(0, 0, 0, 400, 200, "Typing Text Example", #PB_Window_SystemMenu | #PB_Window_ScreenCentered)
InitSprite()
InitKeyboard()
OpenWindowedScreen(WindowID(0),0,0,400,200)
AddWindowTimer(0,2,50)
CreateImage(0, 400, 200)
StartDrawing(ScreenOutput())
Box(0, 0, 400, 200, RGB(218, 155, 125))
DrawingMode(#PB_2DDrawing_Transparent)
StopDrawing()
FlipBuffers()
StartDrawing(ScreenOutput())
Box(0, 0, 400, 200, RGB(218, 155, 125))
DrawingMode(#PB_2DDrawing_Transparent)
StopDrawing()
Global message.s ="Letters being typed to screen with a cursor following."
Global ot=0
Global L=0
Global col=0
Global ot=0,box=0,sw=1
Global now=ElapsedMilliseconds()
Procedure type()
If ElapsedMilliseconds() > now+70
L=L+1
now= ElapsedMilliseconds()
EndIf
ot=0
StartDrawing(ScreenOutput())
Box(0, 0, 400, 200, RGB(218, 155, 125))
DrawingMode(#PB_2DDrawing_Transparent)
Line(ot,52,1,12,RGB(218, 155, 125))
For f=1 To L
ot=DrawText(ot,50,Mid(message,f,1) ,RGB(0,0,255))
Next
StopDrawing()
If L>=Len(message) And sw=1
box=1
sw=0
EndIf
EndProcedure
Procedure flipcursor()
If L & 1
col =RGB(218, 155, 125)
Else
col = #Black
EndIf
StartDrawing(ScreenOutput())
Line(ot,52,1,12,col)
StopDrawing()
EndProcedure
Repeat
ExamineKeyboard()
Repeat
Event = WaitWindowEvent()
If box<1
If Event = #PB_Event_Timer And EventTimer() = 2
type()
flipcursor()
FlipBuffers()
EndIf
EndIf
If box=1
; Debug box
StringGadget(0, 8, 70, 306, 20, "")
SetActiveGadget(0)
box=2
; Debug box
EndIf
Until L=Len(message) Or #PB_Event_CloseWindow Or KeyboardPushed(#PB_Key_Escape)
Until Event = #PB_Event_CloseWindow Or KeyboardPushed(#PB_Key_Escape)
Re: Textwriter like on Github
Posted: Sat Feb 17, 2024 3:37 pm
by Piero
Re: Textwriter like on Github
Posted: Fri Feb 23, 2024 5:15 pm
by StarWarsFan
@matalog:
I tried out your first version. That post you can delete, your second version is much better with the flashing cursor that you added. Thanks!
@Piero:
That sound is awesome! Thanks!
@PBJim:
HeX0R's terminal looks very much like it. Thanks!
@all above
Thank you fellows, much to play with for the weekend

I am thinking of an underscore cursor and then adding sound, too.