Text Only | Text with Attachments

QB64.org Forum

Active Forums => Programs => Topic started by: Dav on June 02, 2021, 09:23:59 pm

Title: Dav's Doodle Dandy - animated image drawing.
Post by: Dav on June 02, 2021, 09:23:59 pm
This is an animated image drawing doodler thing (work in progress)  You can draw images with the doodle make program, it saves it as a special image file.  Then you can play it back later with the doodle player program. When playing back the saved file it will draw the image on the screen with a hand, like it's drawing the image live, like a video animation.  Got the idea watching youtube vids yesterday made with a doodler program.  Wondered how easy it could be to make in QB64. 

To see what it can do, run the DOODLE-PLAY.BAS program and it will load/run the DOODLE.DAG image animation.  Just half a days work so far, lots of improvements to be made still. There is a glitch when changing colors, trying to figure that out.

You could make small presentations/intros with this I suppose...

- Dav

EDIT: Fixed glitch...redownload please...

  (93k)

 

Title: Re: Dav's Doodle Dandy - animated image drawing.
Post by: OldsCool on June 02, 2021, 09:58:43 pm
very COOL and smooth! I created something similar to this in Qbasic some time ago (minus the hand image) that saved the screen data from individual computer generated images(low Res) to play back later as a motion video with an independent motion player I created. in the motion file it only saved the 'Differences' in each consecutive frame (Image) thereby acting as 'compression' increasing the playback speed (slow Qbasic and computer back then) and making for much smaller play-back files.
I enjoyed your demo !  thank goodness we have QB64 and thank you to the QB64 development team!
Title: Re: Dav's Doodle Dandy - animated image drawing.
Post by: Dav on June 02, 2021, 10:42:12 pm
Thanks, @OldsCool.  Thanks for trying it out.  Interesting about your Qbasic project.  Sounds like you made something like the FLIC format animation files used.  I think the challenge of getting by Qbasic's limitations only made it more fun!

I fixed the glitch - the jumping hand now and then.  I just posted a fixed version.  Had to re-record the drawing.  Redownload for the fixed programs.

- Dav   
Title: Re: Dav's Doodle Dandy - animated image drawing.
Post by: Dav on June 04, 2021, 09:10:59 am
I have been working on this some more, but want to put it in more of a finished product before posting.  Not sure when that will be because my gigs are picking up good again and my free programming time is reduced.  So here's a preview... 

It's using SPAINT routine now by @Petr that he wrote for my QuadDraw (https://www.qb64.org/forum/index.php?topic=2467.0) program last year (Thanks for the cool routine, Petr!).  Also trying to incorporate Petr's way or drawing the line so there are no gaps when drawing fast.  I'm adding pausing and wipe screen clear commands so you can do message kind of animations.  Playing around with an eraser pic to do the wiping.  And different hand position images now and then.  I'm adding the capability for custom screen sizes, and giving the image file a header to hold info.  Also doing a rewrite of the doodle-make program putting everything in a right click menu (color select is there too).  Adding a file browser to the player program, and also accept COMMAND$ to play on startup, and playback controls.

If anyone has any suggestions to add, please do.  Thanks. 

- Dav
Title: Re: Dav's Doodle Dandy - animated image drawing.
Post by: bplus on June 04, 2021, 11:21:32 am
I like how you will be able to make fun presentations hopefully.

Are you thinking soundly?
Title: Re: Dav's Doodle Dandy - animated image drawing.
Post by: Dav on June 04, 2021, 11:56:35 am
Quote from: bplus on June 04, 2021, 11:21:32 am
I like how you will be able to make fun presentations hopefully.

Are you thinking soundly?

Thanks for reminding me. It would be great to have optional background music.  And perhaps combining the sound and image data into one file. Image data can be tacked onto the end of an audio file, and QB64 will still be able to open and play the sound files with the extra data on the end (that’s how the .qbv video format thing last year worked). I’d like to keep the presentations as one file.

-Dav
Title: Re: Dav's Doodle Dandy - animated image drawing.
Post by: Petr on June 05, 2021, 10:26:30 am
Nice work, Dav! For a combination of audio and video, for the simplest work, a custom format would probably be the simplest - basically you can determine how long it takes to draw one frame according to the number of steps used (in your .DAG format). If you have the number of steps of one animation and the number of frames in the file (in the new type of binary file you specify the number of DAG files), you have the total video time. All you have to do is add information to the file about which frames belong together (for example, that the first animation has four frames (in the current state as if 4 .DAG files) and here you can insert a change of the soundtrack (up to this time). video and audio transition), for example by numbering. Subsequently, the binary file would describe the video, for example, as follows: (this is just a suggestion from my head)

Number of DAG files in the file - LONG - 4 bytes
Number of audio files - LONG - 4 bytes

Lengths of individual DAG files in seconds (repeated according to the number of DAG files in the file) - LONG - 4 bytes * number of DAG files

Binary sizes of individual DAG files - LONG - 4 bytes * number of DAG files

Offsets on which individual DAG files start - LONG - 4 bytes * number of DAG files

Offsets where music files start - LONG - 4 bytes * number of audio files

Playback description: (let's say we have 10 DAG files and 3 music files)

1 (plays the first DAG video), 1 (plays the first audio file), 5 (the effect number for the video when switching from one DAG file to another DAG file), 7 (the effect number for the sound when changing the audio), 2 (plays the second DAG video), 1 (plays the first audio file) .......
Title: Re: Dav's Doodle Dandy - animated image drawing.
Post by: Dav on June 06, 2021, 09:16:04 am
Petr, thank you for the great suggestions.  I think I should re-do how I'm recording the animation to sync sound.  Right now I'm just recording mouse movements and clicks in steps, outside of a timeline.   The way you describe doing the header is good, I'm thinking along that way too.  Thanks.

- Dav
Title: Re: Dav's Doodle Dandy - animated image drawing.
Post by: TempodiBasic on June 08, 2021, 04:25:33 am
@Dav
Hi, I find your work very good. 
A little set of questions to understand the goal of application
1.  no UNDO?
2. Is it in the feature that Fill clears the whole canvas into a single color?
3.  What do you think about an option to fill only background color with the new choosen color?
4. How other wonderful QB64 applications do you want share  ?

I agree with you message:
  [ This attachment cannot be displayed inline in 'Print Page' view ]  
Title: Re: Dav's Doodle Dandy - animated image drawing.
Post by: Dav on June 08, 2021, 07:04:13 am
Hi @TempodiBasic !  Thank you! 

1. Yes, I have UNDO on the list, because I need it very much. I started to add it last night, but it’s not working good yet.

2.  I am adding screen wipes to clear screen to a certain color.  I also added brush size change, allowing one to wipe the screen clear very fast. 

3. Nice idea, maybe I can do a color swap for that

4. I write a lot of programs for fun or to work out an idea that I’m curious about.  The majority of them are not good enough to post here, so I don’t share most of them.  I suppose there are a couple more I could post without embarrassing myself.

Thank you for trying the program. 

- Dav
Title: Re: Dav's Doodle Dandy - animated image drawing.
Post by: Dav on June 08, 2021, 06:39:55 pm
One thing I'm trying to do is eliminate to gaps in the drawing line when moving the mouse too fast (like in your image above @TempodiBasic) by drawing in the in-between space.  It seems simple at first, save the last known x/y point and fill in between that and the new x/y, but I'm not seeing it clearly yet how to correctly.  It's too blocky when moving real fast, so I need to do a series of blocks on the line.   I'm sure I'm not seeing something probably so obvious to others.  Here's an example...

- Dav

Code: QB64: [Select]
  1.  
  2. SCREEN _NEWIMAGE(600, 600, 32)
  3.  
  4. CLS , _RGB(255, 255, 255)
  5.  
  6. size% = 3: clr& = _RGB(0, 0, 0)
  7.  
  9.  
  10.     mi = _MOUSEINPUT: mx = _MOUSEX: my = _MOUSEY
  11.  
  13.  
  14.         'if drawing still, draw pixels in between
  15.         IF drawing = 1 THEN
  16.             LINE (oldmx, oldmy)-(mx, my), clr&, BF
  17.         END IF
  18.  
  19.         'draw line brush
  20.         LINE (mx - (size% / 2), my - (size% / 2))-(mx + (size% / 2), my + (size% / 2)), clr&, BF
  21.  
  22.         'use circle brush instead of line
  23.         'FOR d = 1 TO size% STEP .2
  24.         '    CIRCLE (mx, my), d, clr&
  25.         'NEXT
  26.  
  27.         drawing = 1: oldmx = mx: oldmy = my
  28.  
  29.     ELSE
  30.  
  31.         drawing = 0
  32.  
  33.     END IF
  34.  
  36.  
Title: Re: Dav's Doodle Dandy - animated image drawing.
Post by: STxAxTIC on June 08, 2021, 07:37:43 pm
Sup Dav -

The thing you want is linear interpolation. Highly google-able, but I'll do you one better. From our very own archives, the curve smoother:

Code: QB64: [Select]
  1. '_OE
  2.  
  4. _TITLE "If these curves were smoother they'd steal your wife."
  5.  
  6. ' Hardware
  7. SCREEN _NEWIMAGE(800, 600, 32)
  8. _SCREENMOVE (_DESKTOPWIDTH \ 2 - _WIDTH \ 2) - 3, (_DESKTOPHEIGHT \ 2 - _HEIGHT \ 2) - 29
  9.  
  10. ' Meta
  12.  
  13. ' Data structures
  14. TYPE Vector
  15.     x AS DOUBLE
  16.     y AS DOUBLE
  18.  
  19. ' Object type
  20. TYPE Object
  21.     Elements AS INTEGER
  22.     Shade AS _UNSIGNED LONG
  24.  
  25. ' Object storage
  26. DIM SHARED Shape(300) AS Object
  27. DIM SHARED PointChain(300, 500) AS Vector
  28. DIM SHARED TempChain(300, 500) AS Vector
  29. DIM SHARED ShapeCount AS INTEGER
  30. DIM SHARED SelectedShape AS INTEGER
  31.  
  32. DIM SHARED MasterDraw AS STRING
  33.  
  34. ' Initialize
  35. ShapeCount = 0
  36.  
  37. ' Main loop
  39.     LOCATE 1, 1: PRINT ShapeCount
  40.     CALL UserInput
  41.     CALL Graphics
  42.     _LIMIT 120
  44.  
  46.  
  47. SUB UserInput
  48.     TheReturn = 0
  49.     ' Keyboard input
  50.     kk = _KEYHIT
  51.     SELECT CASE kk
  52.         CASE 32
  53.             DO: LOOP UNTIL _KEYHIT
  54.             WHILE _MOUSEINPUT: WEND
  55.             _KEYCLEAR
  56.             CALL NewMouseShape(7.5, 400, 15)
  57.             CLS
  58.         CASE ASC("e"), ASC("E")
  59.             OPEN "Curves" + LTRIM$(RTRIM$(STR$(INT(TIMER)))) + ".txt" FOR OUTPUT AS #1
  60.             PRINT #1, MasterDraw
  61.             CLOSE #1
  62.     END SELECT
  63.     IF (kk) THEN
  64.         _KEYCLEAR
  65.     END IF
  67.  
  68. SUB Graphics
  69.     DIM k AS INTEGER
  70.     DIM x1 AS DOUBLE
  71.     DIM x2 AS DOUBLE
  72.     DIM y1 AS DOUBLE
  73.     DIM y2 AS DOUBLE
  74.     MasterDraw = ""
  75.     LINE (0, 0)-(_WIDTH, _HEIGHT), _RGBA(0, 0, 0, 255), BF
  76.     CALL cPrintstring(16 * 17, "PRESS SPACE and then drag MOUSE 1 to draw a new shape.")
  77.     FOR k = 1 TO ShapeCount
  78.         z$ = "c" + STR$(Shape(k).Shade) + " "
  79.         FOR i = 1 TO Shape(k).Elements - 1
  80.             x1 = PointChain(k, i).x
  81.             y1 = PointChain(k, i).y
  82.             x2 = PointChain(k, i + 1).x
  83.             y2 = PointChain(k, i + 1).y
  84.             'CALL lineSmooth(x1, y1, x2, y2, Shape(k).Shade)
  85.  
  86.             '''
  87.             ' Fellippe, this was it ...
  88.             dr = SQR((x2 - x1) ^ 2 + (y2 - y1) ^ 2)
  89.             ang = (180 / 3.1416 * ATN((y2 - y1) / (x2 - x1)))
  90.             IF (x2 < x1) THEN
  91.                 ang = 180 + ang
  92.             END IF
  93.             z$ = z$ + "TA " + STR$(ang - 90) + " U" + STR$(dr) + " "
  94.             '''
  95.         NEXT
  96.         ' Make a point to get DRAW started.
  97.         CALL cPset(PointChain(k, 1).x, PointChain(k, 1).y, Shape(k).Shade)
  98.         ' Draw replaces CLine.
  99.         MasterDraw = MasterDraw + z$ + "___"
  100.         DRAW z$
  101.     NEXT
  102.     _DISPLAY
  104.  
  105. SUB NewMouseShape (rawresolution AS DOUBLE, targetpoints AS INTEGER, smoothiterations AS INTEGER)
  106.     ShapeCount = ShapeCount + 1
  107.     numpoints = 0
  108.     xold = 999 ^ 999
  109.     yold = 999 ^ 999
  110.     DO
  111.         DO WHILE _MOUSEINPUT
  112.             x = _MOUSEX
  113.             y = _MOUSEY
  114.             IF (x > 0) AND (x < _WIDTH) AND (y > 0) AND (y < _HEIGHT) THEN
  115.                 IF _MOUSEBUTTON(1) THEN
  116.                     x = x - (_WIDTH / 2)
  117.                     y = -y + (_HEIGHT / 2)
  118.                     delta = SQR((x - xold) ^ 2 + (y - yold) ^ 2)
  119.                     IF (delta > rawresolution) AND (numpoints < targetpoints - 1) THEN
  120.                         numpoints = numpoints + 1
  121.                         PointChain(ShapeCount, numpoints).x = x
  122.                         PointChain(ShapeCount, numpoints).y = y
  123.                         CALL cPset(x, y, _RGB(0, 255, 255))
  124.                         xold = x
  125.                         yold = y
  126.                     END IF
  127.                 END IF
  128.             END IF
  129.         LOOP
  130.         _DISPLAY
  131.     LOOP UNTIL NOT _MOUSEBUTTON(1) AND (numpoints > 1)
  132.  
  133.     DO WHILE (numpoints < targetpoints)
  134.         rad2max = -1
  135.         kmax = -1
  136.         FOR k = 1 TO numpoints - 1
  137.             xfac = PointChain(ShapeCount, k).x - PointChain(ShapeCount, k + 1).x
  138.             yfac = PointChain(ShapeCount, k).y - PointChain(ShapeCount, k + 1).y
  139.             rad2 = xfac ^ 2 + yfac ^ 2
  140.             IF rad2 > rad2max THEN
  141.                 kmax = k
  142.                 rad2max = rad2
  143.             END IF
  144.         NEXT
  145.         FOR j = numpoints TO kmax + 1 STEP -1
  146.             PointChain(ShapeCount, j + 1).x = PointChain(ShapeCount, j).x
  147.             PointChain(ShapeCount, j + 1).y = PointChain(ShapeCount, j).y
  148.         NEXT
  149.         PointChain(ShapeCount, kmax + 1).x = (1 / 2) * (PointChain(ShapeCount, kmax).x + PointChain(ShapeCount, kmax + 2).x)
  150.         PointChain(ShapeCount, kmax + 1).y = (1 / 2) * (PointChain(ShapeCount, kmax).y + PointChain(ShapeCount, kmax + 2).y)
  151.         numpoints = numpoints + 1
  152.     LOOP
  153.  
  154.     FOR j = 1 TO smoothiterations
  155.         FOR k = 2 TO numpoints - 1
  156.             TempChain(ShapeCount, k).x = (1 / 2) * (PointChain(ShapeCount, k - 1).x + PointChain(ShapeCount, k + 1).x)
  157.             TempChain(ShapeCount, k).y = (1 / 2) * (PointChain(ShapeCount, k - 1).y + PointChain(ShapeCount, k + 1).y)
  158.         NEXT
  159.         FOR k = 2 TO numpoints - 1
  160.             PointChain(ShapeCount, k).x = TempChain(ShapeCount, k).x
  161.             PointChain(ShapeCount, k).y = TempChain(ShapeCount, k).y
  162.         NEXT
  163.     NEXT
  164.  
  165.     Shape(ShapeCount).Elements = numpoints
  166.     Shape(ShapeCount).Shade = _RGB(100 + INT(RND * 155), 100 + INT(RND * 155), 100 + INT(RND * 155))
  167.     SelectedShape = ShapeCount
  169.  
  170. SUB cPset (x1 AS DOUBLE, y1 AS DOUBLE, col AS _UNSIGNED LONG)
  171.     PSET (_WIDTH / 2 + x1, -y1 + _HEIGHT / 2), col
  173.  
  174. SUB cLine (x1 AS DOUBLE, y1 AS DOUBLE, x2 AS DOUBLE, y2 AS DOUBLE, col AS _UNSIGNED LONG)
  175.     LINE (_WIDTH / 2 + x1, -y1 + _HEIGHT / 2)-(_WIDTH / 2 + x2 - 0, -y2 + _HEIGHT / 2 + 0), col
  177.  
  178. SUB cPrintstring (y, a AS STRING)
  179.     _PRINTSTRING (_WIDTH / 2 - (LEN(a) * 8) / 2, -y + _HEIGHT / 2), a
  181.  
  182. SUB lineSmooth (x0, y0, x1, y1, c AS _UNSIGNED LONG)
  183.     'Credit: FellippeHeitor qb64.org (2020)
  184.     '        Adapted from https://en.wikipedia.org/w/index.php?title=Xiaolin_Wu%27s_line_algorithm&oldid=852445548
  185.     'Edit:   Correction to alpha channel (2020-11-20)
  186.  
  187.     DIM plX AS INTEGER, plY AS INTEGER, plI
  188.  
  189.     DIM steep AS _BYTE
  190.     steep = ABS(y1 - y0) > ABS(x1 - x0)
  191.  
  192.     IF steep THEN
  193.         SWAP x0, y0
  194.         SWAP x1, y1
  195.     END IF
  196.  
  197.     IF x0 > x1 THEN
  198.         SWAP x0, x1
  199.         SWAP y0, y1
  200.     END IF
  201.  
  202.     DIM dx, dy, gradient
  203.     dx = x1 - x0
  204.     dy = y1 - y0
  205.     gradient = dy / dx
  206.  
  207.     IF dx = 0 THEN
  208.         gradient = 1
  209.     END IF
  210.  
  211.     'handle first endpoint
  212.     DIM xend, yend, xgap, xpxl1, ypxl1
  213.     xend = _ROUND(x0)
  214.     yend = y0 + gradient * (xend - x0)
  215.     xgap = (1 - ((x0 + .5) - INT(x0 + .5)))
  216.     xpxl1 = xend 'this will be used in the main loop
  217.     ypxl1 = INT(yend)
  218.     IF steep THEN
  219.         plX = ypxl1
  220.         plY = xpxl1
  221.         plI = (1 - (yend - INT(yend))) * xgap
  222.         GOSUB plot
  223.  
  224.         plX = ypxl1 + 1
  225.         plY = xpxl1
  226.         plI = (yend - INT(yend)) * xgap
  227.         GOSUB plot
  228.     ELSE
  229.         plX = xpxl1
  230.         plY = ypxl1
  231.         plI = (1 - (yend - INT(yend))) * xgap
  232.         GOSUB plot
  233.  
  234.         plX = xpxl1
  235.         plY = ypxl1 + 1
  236.         plI = (yend - INT(yend)) * xgap
  237.         GOSUB plot
  238.     END IF
  239.  
  240.     DIM intery
  241.     intery = yend + gradient 'first y-intersection for the main loop
  242.  
  243.     'handle second endpoint
  244.     DIM xpxl2, ypxl2
  245.     xend = _ROUND(x1)
  246.     yend = y1 + gradient * (xend - x1)
  247.     xgap = ((x1 + .5) - INT(x1 + .5))
  248.     xpxl2 = xend 'this will be used in the main loop
  249.     ypxl2 = INT(yend)
  250.     IF steep THEN
  251.         plX = ypxl2
  252.         plY = xpxl2
  253.         plI = (1 - (yend - INT(yend))) * xgap
  254.         GOSUB plot
  255.  
  256.         plX = ypxl2 + 1
  257.         plY = xpxl2
  258.         plI = (yend - INT(yend)) * xgap
  259.         GOSUB plot
  260.     ELSE
  261.         plX = xpxl2
  262.         plY = ypxl2
  263.         plI = (1 - (yend - INT(yend))) * xgap
  264.         GOSUB plot
  265.  
  266.         plX = xpxl2
  267.         plY = ypxl2 + 1
  268.         plI = (yend - INT(yend)) * xgap
  269.         GOSUB plot
  270.     END IF
  271.  
  272.     'main loop
  273.     DIM x
  274.     IF steep THEN
  275.         FOR x = xpxl1 + 1 TO xpxl2 - 1
  276.             plX = INT(intery)
  277.             plY = x
  278.             plI = (1 - (intery - INT(intery)))
  279.             GOSUB plot
  280.  
  281.             plX = INT(intery) + 1
  282.             plY = x
  283.             plI = (intery - INT(intery))
  284.             GOSUB plot
  285.  
  286.             intery = intery + gradient
  287.         NEXT
  288.     ELSE
  289.         FOR x = xpxl1 + 1 TO xpxl2 - 1
  290.             plX = x
  291.             plY = INT(intery)
  292.             plI = (1 - (intery - INT(intery)))
  293.             GOSUB plot
  294.  
  295.             plX = x
  296.             plY = INT(intery) + 1
  297.             plI = (intery - INT(intery))
  298.             GOSUB plot
  299.  
  300.             intery = intery + gradient
  301.         NEXT
  302.     END IF
  303.  
  304.     EXIT SUB
  305.  
  306.     plot:
  307.     ' Change to regular PSET for standard coordinate orientation.
  308.     CALL cPset(plX, plY, _RGB32(_RED32(c), _GREEN32(c), _BLUE32(c), plI * _ALPHA32(c)))
  309.     RETURN
  311.  
Title: Re: Dav's Doodle Dandy - animated image drawing.
Post by: Dav on June 08, 2021, 07:44:29 pm
Wow, thanks @STxAxTIC ! That’s something I sure will chew on and digest. Thank you.

- Dav
Title: Re: Dav's Doodle Dandy - animated image drawing.
Post by: bplus on June 08, 2021, 08:04:10 pm
Quote from: Dav on June 08, 2021, 06:39:55 pm
One thing I'm trying to do is eliminate to gaps in the drawing line when moving the mouse too fast (like in your image above @TempodiBasic) by drawing in the in-between space.  It seems simple at first, save the last known x/y point and fill in between that and the new x/y, but I'm not seeing it clearly yet how to correctly.  It's too blocky when moving real fast, so I need to do a series of blocks on the line.   I'm sure I'm not seeing something probably so obvious to others.  Here's an example...

- Dav

Code: QB64: [Select]
  1.  
  2. SCREEN _NEWIMAGE(600, 600, 32)
  3.  
  4. CLS , _RGB(255, 255, 255)
  5.  
  6. size% = 3: clr& = _RGB(0, 0, 0)
  7.  
  9.  
  10.     mi = _MOUSEINPUT: mx = _MOUSEX: my = _MOUSEY
  11.  
  13.  
  14.         'if drawing still, draw pixels in between
  15.         IF drawing = 1 THEN
  16.             LINE (oldmx, oldmy)-(mx, my), clr&, BF
  17.         END IF
  18.  
  19.         'draw line brush
  20.         LINE (mx - (size% / 2), my - (size% / 2))-(mx + (size% / 2), my + (size% / 2)), clr&, BF
  21.  
  22.         'use circle brush instead of line
  23.         'FOR d = 1 TO size% STEP .2
  24.         '    CIRCLE (mx, my), d, clr&
  25.         'NEXT
  26.  
  27.         drawing = 1: oldmx = mx: oldmy = my
  28.  
  29.     ELSE
  30.  
  31.         drawing = 0
  32.  
  33.     END IF
  34.  
  36.  


I have this for that, hard to test with Wondows constant interrupts for update
Code: QB64: [Select]
  1. _Title "thic2 line mouse demo" 'b+ 2021-06-08
  2. Const xmax = 800
  3. Const ymax = 600
  4. Screen _NewImage(xmax, ymax, 32)
  5. _ScreenMove 360, 60
  6.  
  9.     mx = _MouseX: my = _MouseY: mb = _MouseButton(1)
  10.     If mb Then
  11.         If lastmx And lastmy Then thic2 mx, my, lastmx, lastmy, 15, &HFFFFFF00
  12.         lastmx = mx: lastmy = my
  13.     Else
  14.         lastmx = 0: lastmy = 0
  15.     End If
  16.     _Display
  17.     _Limit 300
  19.  
  20. 'this version needs fcirc and is pretty inefficient but once and a while it comes in handy
  21. Sub thic2 (x1, y1, x2, y2, rThick, K As _Unsigned Long)
  22.     'x1, y1 is one endpoint of line
  23.     'x2, y2 is the other endpoint of the line
  24.     'rThick is the radius of the tiny circles that will be drawn
  25.     '   from one end point to the other to create the thick line
  26.     'Yes, the line will then extend beyond the endpoints with circular ends.
  27.     rThick = Int(rThick / 2): stepx = x2 - x1: stepy = y2 - y1
  28.     length = Int((stepx ^ 2 + stepy ^ 2) ^ .5)
  29.     If length Then
  30.         dx = stepx / length: dy = stepy / length
  31.         For i = 0 To length
  32.             fcirc x1 + dx * i, y1 + dy * i, rThick, K
  33.         Next
  34.     Else
  35.         fcirc x1, y1, rThick, K
  36.     End If
  38.  
  39. Sub fcirc (CX As Integer, CY As Integer, R As Integer, C As _Unsigned Long)
  40.     Dim Radius As Integer, RadiusError As Integer
  41.     Dim X As Integer, Y As Integer
  42.  
  43.     Radius = Abs(R)
  44.     RadiusError = -Radius
  45.     X = Radius
  46.     Y = 0
  47.  
  48.     If Radius = 0 Then PSet (CX, CY), C: Exit Sub
  49.  
  50.     ' Draw the middle span here so we don't draw it twice in the main loop,
  51.     ' which would be a problem with blending turned on.
  52.     Line (CX - X, CY)-(CX + X, CY), C, BF
  53.  
  54.     While X > Y
  55.         RadiusError = RadiusError + Y * 2 + 1
  56.         If RadiusError >= 0 Then
  57.             If X <> Y + 1 Then
  58.                 Line (CX - Y, CY - X)-(CX + Y, CY - X), C, BF
  59.                 Line (CX - Y, CY + X)-(CX + Y, CY + X), C, BF
  60.             End If
  61.             X = X - 1
  62.             RadiusError = RadiusError - X * 2
  63.         End If
  64.         Y = Y + 1
  65.         Line (CX - X, CY - Y)-(CX + X, CY - Y), C, BF
  66.         Line (CX - X, CY + Y)-(CX + X, CY + Y), C, BF
  67.     Wend
  69.  
  70.  
 [ This attachment cannot be displayed inline in 'Print Page' view ]  
Title: Re: Dav's Doodle Dandy - animated image drawing.
Post by: Dav on June 08, 2021, 08:22:44 pm
That looks good. I’ll give it a run when I get back home. Thanks, @bplus.

- Dav
Title: Re: Dav's Doodle Dandy - animated image drawing.
Post by: Dav on June 08, 2021, 10:22:08 pm
@bplus:  Thanks! Really helpful code.  I took it apart, and I think it can fit in very easily into a drawing program.  The only thing I added was the IF length > size% THEN part before drawing the length, because I'm using large radius sizes for brushes and no need to draw in the length unless gaps are larger than the size% (it slowed it down on really large circle radius sizes). 

I really appreciate that code!

- Dav

Code: QB64: [Select]
  1. SCREEN _NEWIMAGE(800, 600, 32)
  2.  
  3. CLS , _RGB(255, 255, 255)
  4.  
  5. clr& = _RGB(200, 100, 50)
  6. size% = 50
  7.  
  10.  
  11.     mx = _MOUSEX: my = _MOUSEY: mb = _MOUSEBUTTON(1)
  12.  
  13.     IF mb THEN
  14.  
  15.         IF lastmx AND lastmy THEN
  16.             stepx = lastmx - mx
  17.             stepy = lastmy - my
  18.             length = INT((stepx ^ 2 + stepy ^ 2) ^ .5)
  19.  
  20.             IF length THEN
  21.                 dx = stepx / length
  22.                 dy = stepy / length
  23.  
  24.                 IF length > size% THEN
  25.  
  26.                     FOR i = 0 TO length
  27.                         FOR d = 1 TO size% STEP .2
  28.                             CIRCLE (mx + dx * i, my + dy * i), d, clr&
  29.                         NEXT
  30.                     NEXT
  31.  
  32.                 END IF
  33.  
  34.             ELSE
  35.                 FOR d = 1 TO size% STEP .2
  36.                     CIRCLE (mx, my), d, clr&
  37.                 NEXT
  38.             END IF
  39.  
  40.         END IF
  41.         lastmx = mx: lastmy = my
  42.     ELSE
  43.         lastmx = 0: lastmy = 0
  44.     END IF
  45.  
  47.  
  48.  
Title: Re: Dav's Doodle Dandy - animated image drawing.
Post by: bplus on June 08, 2021, 11:00:21 pm
Yeah I thought it easy to implement and easy for changing radius = brush size.

@Dav might also be handy to change radius with mouse wheel.
Title: Re: Dav's Doodle Dandy - animated image drawing.
Post by: Dav on June 09, 2021, 09:00:56 am
Quote from: bplus on June 08, 2021, 11:00:21 pm
@Dav might also be handy to change radius with mouse wheel.

That sounds like a good idea. I don’t have a mouse wheel for testing it out, but I can add in the code anyway. Currently The brush size is changed with the +/-keys. 

I hope to post a new player and demo file soon to show the new updates, the maker program is taking the most work.

Btw @bplus, do you have a GitHub page or place where your put all you code snippets? You sure have a ton of golden nuggets people can learn from.

- Dav
Title: Re: Dav's Doodle Dandy - animated image drawing.
Post by: bplus on June 09, 2021, 11:00:39 am
@Dav thanks, I am thinking this app might be perfect for your right click popup menu.

Quote
Btw @bplus, do you have a GitHub page or place where your put all you code snippets? You sure have a ton of golden nuggets people can learn from.

I have a few choice items stashed or linked in this thread that I add to now and then
https://www.qb64.org/forum/index.php?topic=1511.0
Title: Re: Dav's Doodle Dandy - animated image drawing.
Post by: Dav on June 09, 2021, 04:34:23 pm
Quote from: bplus on June 09, 2021, 11:00:39 am
@Dav thanks, I am thinking this app might be perfect for your right click popup menu.

Yeah, I'm doing a right click menu thing for it, trying to combine a menu it with a color picker. 

I getting a weird hangup/delay with the IDE (v1.5) programming this.  It's like the IDE is checking syntax or something, and it has to think for about 15 seconds and freezes.  Then all is well.  Happened a few times.  Nothing I can narrow down yet - not sure if it happens when typing or clicking on a new line.  I'll try to catch what I'm doing when the freeze happens.

- Dav
Title: Re: Dav's Doodle Dandy - animated image drawing.
Post by: Dav on June 09, 2021, 10:02:50 pm
@bplus: I was still getting occasional gaps in when drawing fast long lines. After playing around with it for a while, adding the little stilldown flag resulted in absolutely no gaps in the drawing line now.

Btw, your way of polling mouse input is best (WHILE _MOUSEINPUT: WEND).  My way was causing a noticeable drawing drag (mi = _MOUSEINPUT).   

The code below is the method I'm going with -  runs pretty smooth on even large brush size% numbers.

- Dav

Code: QB64: [Select]
  1. SCREEN _NEWIMAGE(800, 600, 32)
  2.  
  3. CLS , _RGB(255, 255, 255)
  4.  
  5. clr& = _RGB(0, 0, 0)
  6. size% = 15
  7.  
  9.  
  10.     'mi = _MOUSEINPUT
  12.  
  13.     mx = _MOUSEX: my = _MOUSEY
  14.     mb1 = _MOUSEBUTTON(1)
  15.  
  16.     IF mb1 THEN
  17.         IF stilldown = 1 THEN
  18.             stepx = lastmx - mx
  19.             stepy = lastmy - my
  20.             length = INT((stepx ^ 2 + stepy ^ 2) ^ .5)
  21.             dx = stepx / length
  22.             dy = stepy / length
  23.             FOR i = 0 TO length
  24.                 FOR d = 1 TO size%
  25.                     CIRCLE (mx + dx * i, my + dy * i), d, clr&
  26.                 NEXT
  27.             NEXT
  28.         ELSE
  29.             FOR d = 1 TO size% STEP .2
  30.                 CIRCLE (mx, my), d, clr&
  31.             NEXT
  32.         END IF
  33.         lastmx = mx: lastmy = my
  34.         stilldown = 1
  35.     ELSE
  36.         stilldown = 0
  37.     END IF
  38.  
  39.     _LIMIT 300
  40.  
  42.  
Title: Re: Dav's Doodle Dandy - animated image drawing.
Post by: bplus on June 09, 2021, 10:24:35 pm
Quote
@bplus: I was still getting occasional gaps in when drawing fast long lines. After playing around with it for a while, adding the little stilldown flag resulted in absolutely no gaps in the drawing line now.

Yeah as I said I had a Windows Update waiting in wings and was getting bogged down and interrupts and Not Responding crap with everything I did while testing the mouse drawing. I did notice occasional jumps but wasn't sure if Windows was just being obnoxious until I stopped and did update.

@Dav your solution here is smooth as silk! nice fix.
Text Only | Text with Attachments