SpyroDraw v1.2 Drawing program (iPad & iPhone)

[Dav]

Hi everyone. I made this just to get back into a programming mode (been out of it for a while). This is a simple finger drawing thing, but it has a little twist - you can draw up to four points at a time. Choose basic colors, brush size. Nothing fancy, but it was very quick to put together. That's what I like about smart Basic - you can make a fun little app pretty quickly!

I'd like to add higher number of points, but will have to use a better method of plotting x,y for drawing.

Feel free to change/improve this and post your version here. I will add a screen shot here as soon as I can.

- Dav

New in V1.2 - thanks to ricardobytes the drawing is greatly improved, there is also save function now, and best of all it now works on both iPad and iPhones. Thanks ricardobytes!

Code: Select all

'spyrodraw.txt v1.2 
'A simple finger drawing program
'Coded by Dav, September/2016
'Save function and all-device
'compatibility by ricardobytes.
'(Thanks ricardobytes for all the help)

'Draws up to 4 points at a time.
'Choose basic colors and brush size.

'To use: Select the color you want.
'Select number of points to draw with.
'Use slider to choose brush size to use.
'Toggle brush shadows on/off with button.
'Clear the screen with the C button.
'Save to Camera Roll with the S button.
'Selecting X will exit program.



SET BUTTONS CUSTOM
SET TOOLBAR OFF
SET ORIENTATION TOP
laun$=LAUNCHER$ ()
GET SCREEN SIZE w,h
dev$=DEVICE_TYPE$()
iostest=0                ' set to 1 to test other devices on iPad
IF iostest THEN
  dev$=""
  w=375!h=667            ' to test iPhone 6
ENDIF
rw=w/768!rh=h/1024
SET BUTTONS FONT SIZE 42*rh
GRAPHICS
GRAPHICS CLEAR 0,0,0
FILL COLOR .5,.5,.5
F$="temp.jpg"
DRAW COLOR .5,.5,.5
SPRITE "line" BEGIN w,2
DRAW LINE 1,0 TO w,0
SPRITE "line" END
SPRITE "line" AT 1,h-60*rh
SPRITE "line" SHOW
SPRITE "square" BEGIN 50*rh,50*rh
FILL RECT 25*rh,25*rh SIZE 25*rh
SPRITE "square" END
SPRITE "square" AT w-210*rw,h-52*rh
SPRITE "square" SHOW
FILL COLOR 0,0,0
SPRITE "circle" BEGIN 50*rh,50*rh
FILL CIRCLE 25*rh,25*rh SIZE 25*rh
SPRITE "circle" END
SPRITE "circle" AT w-210*rw,h-52*rh SCALE 10/25
SPRITE "circle" SHOW
DRAW COLOR 1,1,1
BUTTON "quit" TEXT "X" AT w-50*rw,0 SIZE 50*rw,50*rh
BUTTON "clear" TEXT "C" AT 454*rw,0 SIZE 50*rw,50*rh
BUTTON "save" TEXT "S" AT 504*rw,0 SIZE 50*rw,50*rh

'defaults
SIZE=10
COLOR = 1
points =4
SHADOW = 1

'draw screen
GOSUB updatecolors
GOSUB updatepoints
GOSUB updatesize
DRAW LINECAP ROUND

'main loop
DO
    IF x<>-1 AND x<>0 THEN!oldx=x!oldx2=x2!ENDIF
    IF y<>-1 AND y<>0 THEN!oldy=y!oldy2=y2!ENDIF

    GET TOUCH 0 AS x,y
    IF (x=-1 AND y=-1) OR (x=oldx AND y=oldy) THEN connect=0

    IF x<>-1 AND y>(50*rh)+SIZE AND y < h-(65*rh)-SIZE THEN

       'draw 1 point where finger is
       IF connect THEN DRAW LINE oldx,oldy TO x,y
       
       IF points >1 THEN
         cx=w/2!cy=h/2 'find the center spot
         'the other side of the universe...
         x2=cx-x+cx!y2=cy-y+cy 
         '2nd one
         IF connect THEN DRAW LINE oldx2,oldy2 TO x2,y2
         
       END IF

       IF points > 2 THEN
          '3rd and 4th one
          IF connect THEN DRAW LINE oldx,oldy2 TO x,y2
          IF connect THEN DRAW LINE oldx2,oldy TO x2,y

       END IF
       connect=1

   ELSE


   'check colors change
   IF BUTTON_PRESSED("1") THEN 
     COLOR = 1 ! GOSUB updatecolors
   END IF
   IF BUTTON_PRESSED("2") THEN 
     COLOR = 2 ! GOSUB updatecolors
   END IF
   IF BUTTON_PRESSED("3") THEN 
     COLOR = 3 ! GOSUB updatecolors
   END IF
   IF BUTTON_PRESSED("4") THEN 
     COLOR = 4 ! GOSUB updatecolors
   END IF
   IF BUTTON_PRESSED("5") THEN 
     COLOR = 5 ! GOSUB updatecolors
   END IF
   IF BUTTON_PRESSED("6") THEN 
     COLOR = 6 ! GOSUB updatecolors
   END IF
   IF BUTTON_PRESSED("7") THEN 
     COLOR = 7 ! GOSUB updatecolors
   END IF
   IF BUTTON_PRESSED("8") THEN 
     COLOR = 8 ! GOSUB updatecolors
   END IF
   IF BUTTON_PRESSED("9") THEN 
     COLOR = 9 ! GOSUB updatecolors
   END IF

   'check num of points change
   IF BUTTON_PRESSED("p1") THEN
     points=1 ! GOSUB updatepoints
   END IF
   IF BUTTON_PRESSED("p2") THEN
     points=2 ! GOSUB updatepoints
   END IF
   IF BUTTON_PRESSED("p4") THEN
     points=4 ! GOSUB updatepoints
   END IF

   'check size change
   IF SLIDER_CHANGED("size") THEN
    newsize=INT(25*SLIDER_VALUE("size"))
    'don't allow under 1
    IF newsize => 1 THEN
      SIZE=newsize ! GOSUB updatesize
    END IF
   END IF

   'turn shadows on/off
   IF BUTTON_PRESSED("shadow") THEN
      IF SHADOW=1 THEN
        SHADOW=0
      ELSE
        SHADOW=1
      END IF
      GOSUB updatepoints
   END IF

   'clear screen
   IF BUTTON_PRESSED("clear") THEN 
      GRAPHICS CLEAR 0,0,0
      GOSUB updatesize
   END IF
   
   'save image
   IF BUTTON_PRESSED("save") THEN
     GRAPHICS SAVE 0,0, w,h TO F$
     ALBUM EXPORT F$
   END IF

   'quit button check
   IF BUTTON_PRESSED("quit") THEN
     IF laun$="desktop" THEN RUN "/-Launch.sb"
     END
   END IF

   END IF

UNTIL 0

END


'=======================================
'   G O S U B S / F U N C T I O N S
'=======================================

'============
updatecolors:  'Shows user color choice
'============

  j$=chr$(10003) 'checkmark (replaced "^")

  DRAW COLOR 1,1,1 ! FILL COLOR 1,0,0
  IF COLOR=1 THEN a$=j$ ELSE a$=""
  BUTTON "1" TEXT a$ AT 0,0 SIZE 50*rw,50*rh

  DRAW COLOR 1,1,1 ! FILL COLOR 0,1,0
  IF COLOR=2 THEN a$=j$ ELSE a$=""
  BUTTON "2" TEXT a$ AT 52*rw,0 SIZE 50*rw,50*rh

  DRAW COLOR 1,1,1 ! FILL COLOR 0,0,1
  IF COLOR=3 THEN a$=j$ ELSE a$=""
  BUTTON "3" TEXT a$ AT 103*rw,0 SIZE 50*rw,50*rh

  DRAW COLOR 0,0,0 ! FILL COLOR 1,1,0
  IF COLOR=4 THEN a$=j$ ELSE a$=""
  BUTTON "4" TEXT a$ AT 153*rw,0 SIZE 50*rw,50*rh

  DRAW COLOR 1,1,1 ! FILL COLOR 0,1,1
  IF COLOR=5 THEN a$=j$ ELSE a$=""
  BUTTON "5" TEXT a$ AT 201*rw,0 SIZE 50*rw,50*rh

  DRAW COLOR 1,1,1 ! FILL COLOR 1,0,1
  IF COLOR=6 THEN a$=j$ ELSE a$=""
  BUTTON "6" TEXT a$ AT 251*rw,0 SIZE 50*rw,50*rh

  DRAW COLOR 1,1,1 ! FILL COLOR 1,.5,0
  IF COLOR=7 THEN a$=j$ ELSE a$=""
  BUTTON "7" TEXT a$ AT 303*rw,0 SIZE 50*rw,50*rh

  DRAW COLOR 0,0,0 ! FILL COLOR 1,1,1
  IF COLOR=8 THEN a$=j$ ELSE a$=""
  BUTTON "8" TEXT a$ AT 353*rw,0 SIZE 50*rw,50*rh

  DRAW COLOR 1,1,1 ! FILL COLOR 0,0,0
  IF COLOR=9 THEN a$=j$ ELSE a$=""
  BUTTON "9" TEXT a$ AT 403*rw,0 SIZE 50*rw,50*rh

  GOSUB setcolor

RETURN

'===========
updatepoints:  'shows how many points selected
'===========

  DRAW COLOR 1,1,1

  FILL COLOR 0,0,0
  IF points=1 THEN FILL COLOR .5,.5,1
  BUTTON "p1" TEXT "1" AT 554*rw,0 SIZE 50*rw,50*rh

  FILL COLOR 0,0,0
  IF points=2 THEN FILL COLOR .5,.5,1
  BUTTON "p2" TEXT "2" AT 605*rw,0 SIZE 50*rw,50*rh

  FILL COLOR 0,0,0
  IF points=4 THEN FILL COLOR .5,.5,1
  BUTTON "p4" TEXT "4" AT 656*rw,0 SIZE 50*rw,50*rh

  FILL COLOR 0,0,0
  IF SHADOW=1 THEN FILL COLOR .5,.5,1
  SET BUTTONS FONT SIZE 25*rw
  BUTTON "shadow" TEXT "Shadows" AT w-135*rw,h-50*rh SIZE 125*rw,50*rh
  SET BUTTONS FONT SIZE 42
  PAUSE .25
  GOSUB setcolor

RETURN

'==========
updatesize:  'brush slider choice
'==========

  SHADOW OFF
  FILL COLOR .5,.5,.5
  DRAW COLOR .5,.5,.5
  FIELD "brush" TEXT "Brush size:" AT 15*rw,h-48*rh RO
  FIELD "brush" BACK COLOR 0,0,0
  FIELD "brush" FONT COLOR 1,1,1
  FIELD "brush" FONT SIZE 20*rh
  SLIDER "size" VALUE SIZE/25 AT 150*rw,h-45*rh SIZE 400*rw
  FILL COLOR 0,0,0
  SPRITE "circle" AT w-210*rw,h-52*rh SCALE SIZE/25
  IF SHADOW=1 THEN SHADOW ON
  DRAW SIZE SIZE
  GOSUB setcolor

RETURN

'=======
setcolor:  'does the actual color setting 
'=======

  IF COLOR=1 THEN DRAW COLOR 1,0,0
  IF COLOR=2 THEN DRAW COLOR 0,1,0
  IF COLOR=3 THEN DRAW COLOR 0,0,1
  IF COLOR=4 THEN DRAW COLOR 1,1,0
  IF COLOR=5 THEN DRAW COLOR 0,1,1
  IF COLOR=6 THEN DRAW COLOR 1,0,1
  IF COLOR=7 THEN DRAW COLOR 1,.5,0
  IF COLOR=8 THEN DRAW COLOR 1,1,1
  IF COLOR=9 THEN DRAW COLOR 0,0,0
  IF SHADOW=1 THEN
     SHADOW ON ! SHADOW COLOR 1,1,1
  ELSE 
     SHADOW OFF
  END IF
  DRAW SIZE SIZE

RETURN

[rbytes]

Fun program!

[rbytes]

I couldn't resist! I added a save function. The Clear button "C" now shares its former space with the Save button "S".
Then I had to convert a couple of drawing commands: the label for "Brush size" is now a field, and the separator line and indicator for brush size are now sprites. Otherwise they would be saved with the image.

The full screen is saved to a file called "temp.jpg" and then with an ALBUM EXPORT it is sent to the Camera Roll.

[Dav]

Nice changes! I was just starting to work on it again, to add a save, but you work faster than me! If you'd like too, feel free to post your version! Thanks for the screen shots (now I don't have to add one )

- Dav

EDIT: You draw better than me with it too...

[rbytes]

It's tempting to use all the colors, but I try to limit it to a nice color scheme.

Here is the code.

Code: Select all

'spyrodraw.txt v1.1
'A simple finger drawing program
'Coded by Dav, September/2016
'Save function by ricardobytes
'FOR IPAD ONLY RIGHT NOW

'Draws up to 4 points at a time.
'Choose basic colors and brush size.

'To use: Select to color you want.
'Select number of points to draw with.
'Use slider to choose brush size to use.
'Toggle brush shadows on/off with button.
'Clear the screen with the C button.
'Save to Camera Roll with the S button.
'Selecting X will exit program.

'ipad check...
IF CAPSTR$(DEVICE_TYPE$()) <> "IPAD" THEN
   PRINT "Sorry, this is only for iPad."
   END
END IF

SET BUTTONS CUSTOM
SET BUTTONS FONT SIZE 42
SET TOOLBAR OFF
SET ORIENTATION TOP

GRAPHICS
GRAPHICS CLEAR 0,0,0
GET SCREEN SIZE w,h
FILL COLOR .5,.5,.5
F$="temp.jpg"
DRAW COLOR .5,.5,.5
SPRITE "line" BEGIN w,2
DRAW LINE 1,0 TO w,0
SPRITE "line" END
SPRITE "line" AT 1,h-60
SPRITE "line" SHOW
SPRITE "square" BEGIN 50,50
FILL RECT 25,25 SIZE 25
SPRITE "square" END
SPRITE "square" AT w-200,h-52
SPRITE "square" SHOW
FILL COLOR 0,0,0
SPRITE "circle" BEGIN 50,50
FILL CIRCLE 25,25 SIZE 25
SPRITE "circle" END
SPRITE "circle" AT w-200,h-52 SCALE 10/25
SPRITE "circle" SHOW
DRAW COLOR 1,1,1
BUTTON "quit" TEXT "X" AT w-50,0 SIZE 50,50
BUTTON "clear" TEXT "C" AT 454,0 SIZE 50,50
BUTTON "save" TEXT "S" AT 504,0 SIZE 50,50

'defaults
SIZE=10
COLOR = 1
points =4
SHADOW = 1

'draw screen
GOSUB updatecolors
GOSUB updatepoints
GOSUB updatesize

'main loop
DO

    GET TOUCH 0 AS x,y

    IF x<>-1 AND y>50+SIZE AND y < h-65-SIZE THEN

       'draw 1 point where finger is
       FILL CIRCLE x,y SIZE SIZE

       IF points >1 THEN
         cx=w/2!cy=h/2 'find the center spot
         'the other side of the universe...
         x2=cx-x+cx!y2=cy-y+cy 
         '2nd one
         FILL CIRCLE x2,y2 SIZE SIZE
       END IF

       IF points > 2 THEN
          '3rd and 4th one
          FILL CIRCLE x,y2 SIZE SIZE
          FILL CIRCLE x2,y SIZE SIZE
       END IF

   ELSE


   'check colors change
   IF BUTTON_PRESSED("1") THEN 
     COLOR = 1 ! GOSUB updatecolors
   END IF
   IF BUTTON_PRESSED("2") THEN 
     COLOR = 2 ! GOSUB updatecolors
   END IF
   IF BUTTON_PRESSED("3") THEN 
     COLOR = 3 ! GOSUB updatecolors
   END IF
   IF BUTTON_PRESSED("4") THEN 
     COLOR = 4 ! GOSUB updatecolors
   END IF
   IF BUTTON_PRESSED("5") THEN 
     COLOR = 5 ! GOSUB updatecolors
   END IF
   IF BUTTON_PRESSED("6") THEN 
     COLOR = 6 ! GOSUB updatecolors
   END IF
   IF BUTTON_PRESSED("7") THEN 
     COLOR = 7 ! GOSUB updatecolors
   END IF
   IF BUTTON_PRESSED("8") THEN 
     COLOR = 8 ! GOSUB updatecolors
   END IF
   IF BUTTON_PRESSED("9") THEN 
     COLOR = 9 ! GOSUB updatecolors
   END IF

   'check num of points change
   IF BUTTON_PRESSED("p1") THEN
     points=1 ! GOSUB updatepoints
   END IF
   IF BUTTON_PRESSED("p2") THEN
     points=2 ! GOSUB updatepoints
   END IF
   IF BUTTON_PRESSED("p4") THEN
     points=4 ! GOSUB updatepoints
   END IF

   'check size change
   IF SLIDER_CHANGED("size") THEN
    newsize=INT(25*SLIDER_VALUE("size"))
    'don't allow under 1
    IF newsize => 1 THEN
      SIZE=newsize ! GOSUB updatesize
    END IF
   END IF

   'turn shadows on/off
   IF BUTTON_PRESSED("shadow") THEN
      IF SHADOW=1 THEN
        SHADOW=0
      ELSE
        SHADOW=1
      END IF
      GOSUB updatepoints
   END IF

   'clear screen
   IF BUTTON_PRESSED("clear") THEN 
      GRAPHICS CLEAR 0,0,0
      GOSUB updatesize
   END IF
   
   'save image
   IF BUTTON_PRESSED("save") THEN
     GRAPHICS SAVE 0,0, w,h TO F$
     ALBUM EXPORT F$
   END IF

   'quit button check
   IF BUTTON_PRESSED("quit") THEN
     SET TOOLBAR ON
     BREAK
   END IF

   END IF

UNTIL 0

END


'=======================================
'   G O S U B S / F U N C T I O N S
'=======================================

'============
updatecolors:  'Shows user color choice
'============

  DRAW COLOR 1,1,1 ! FILL COLOR 1,0,0
  IF COLOR=1 THEN a$="^" ELSE a$=""
  BUTTON "1" TEXT a$ AT 0,0 SIZE 50,50

  DRAW COLOR 1,1,1 ! FILL COLOR 0,1,0
  IF COLOR=2 THEN a$="^" ELSE a$=""
  BUTTON "2" TEXT a$ AT 52,0 SIZE 50,50

  DRAW COLOR 1,1,1 ! FILL COLOR 0,0,1
  IF COLOR=3 THEN a$="^" ELSE a$=""
  BUTTON "3" TEXT a$ AT 103,0 SIZE 50,50

  DRAW COLOR 0,0,0 ! FILL COLOR 1,1,0
  IF COLOR=4 THEN a$="^" ELSE a$=""
  BUTTON "4" TEXT a$ AT 153,0 SIZE 50,50

  DRAW COLOR 0,0,0 ! FILL COLOR 0,1,1
  IF COLOR=5 THEN a$="^" ELSE a$=""
  BUTTON "5" TEXT a$ AT 201,0 SIZE 50,50

  DRAW COLOR 1,1,1 ! FILL COLOR 1,0,1
  IF COLOR=6 THEN a$="^" ELSE a$=""
  BUTTON "6" TEXT a$ AT 251,0 SIZE 50,50

  DRAW COLOR 1,1,1 ! FILL COLOR 1,.5,0
  IF COLOR=7 THEN a$="^" ELSE a$=""
  BUTTON "7" TEXT a$ AT 303,0 SIZE 50,50

  DRAW COLOR 0,0,0 ! FILL COLOR 1,1,1
  IF COLOR=8 THEN a$="^" ELSE a$=""
  BUTTON "8" TEXT a$ AT 353,0 SIZE 50,50

  DRAW COLOR 1,1,1 ! FILL COLOR 0,0,0
  IF COLOR=9 THEN a$="^" ELSE a$=""
  BUTTON "9" TEXT a$ AT 403,0 SIZE 50,50

  GOSUB setcolor

RETURN

'===========
updatepoints:  'shows how many points selected
'===========

  DRAW COLOR 1,1,1

  FILL COLOR 0,0,0
  IF points=1 THEN FILL COLOR .5,.5,1
  BUTTON "p1" TEXT "1" AT 554,0 SIZE 50,50

  FILL COLOR 0,0,0
  IF points=2 THEN FILL COLOR .5,.5,1
  BUTTON "p2" TEXT "2" AT 605,0 SIZE 50,50

  FILL COLOR 0,0,0
  IF points=4 THEN FILL COLOR .5,.5,1
  BUTTON "p4" TEXT "4" AT 656,0 SIZE 50,50

  FILL COLOR 0,0,0
  IF SHADOW=1 THEN FILL COLOR .5,.5,1
  SET BUTTONS FONT SIZE 25
  BUTTON "shadow" TEXT "Shadows" AT w-135,h-50 SIZE 125,50
  SET BUTTONS FONT SIZE 42
  PAUSE .25
  GOSUB setcolor

RETURN

'==========
updatesize:  'brush slider choie
'==========

  SHADOW OFF
  FILL COLOR .5,.5,.5
  DRAW COLOR .5,.5,.5
  'SPRITE LINE BEGIN 
  'DRAW LINE 1,h-60 TO w,h-60
  FIELD "brush" TEXT "Brush size:" AT 15,h-48 RO
  FIELD "brush" BACK COLOR 0,0,0
  FIELD "brush" FONT COLOR 1,1,1
  'DRAW TEXT "Brush size:" AT 5,h-40
  SLIDER "size" VALUE SIZE/25 AT 150,h-45 SIZE 400
  'FILL RECT w-175,h-25 SIZE 25
  FILL COLOR 0,0,0
  SPRITE "circle" AT w-200,h-52 SCALE SIZE/25
  'FILL CIRCLE w-175,h-25 SIZE SIZE
  IF SHADOW=1 THEN SHADOW ON
  GOSUB setcolor

RETURN

'=======
setcolor:  'does the actual color setting 
'=======

  IF COLOR =1 THEN FILL COLOR 1,0,0
  IF COLOR =2 THEN FILL COLOR 0,1,0
  IF COLOR =3 THEN FILL COLOR 0,0,1
  IF COLOR =4 THEN FILL COLOR 1,1,0
  IF COLOR =5 THEN FILL COLOR 0,1,1
  IF COLOR =6 THEN FILL COLOR 1,0,1
  IF COLOR =7 THEN FILL COLOR 1,.5,0
  IF COLOR =8 THEN FILL COLOR 1,1,1
  IF COLOR =9 THEN FILL COLOR 0,0,0
  IF SHADOW=1 THEN
     SHADOW ON ! SHADOW COLOR 1,1,1
  ELSE 
     SHADOW OFF
  END IF

RETURN

[Dav]

Having already run out of screen space for any more additions, a GUI redesign will be next. I was thinking of using the longer side of the screen instead, or perhaps do a drop down color picker menu page (like my browser uses for bookmarks). Don't want to take up anymore of the screen. I'd like to add more color choice, and drawing points. And add a RECT choice of brush along with the CIRCLE. I'm changing the selection mark on the colors to an emoji check mark for a nicer look. Trying to figure out how to do an UNDO...

Thanks for your additions/improvements Ricardo.

- Dav

[rbytes]

It will be exciting to see the upgrades.

You might use the PAGE command to toggle the interface on and off to give maximum drawing space. For Undo, you could save the image after each drawing action and reload it if Undo is pressed. Or save multiple numbered images and reload them in reverse order with each Undo. Saves and reloads are so fast the user probably wouldn't notice the delay.

[Henko]

Having already run out of screen space for any more additions, a GUI redesign will be next. I was thinking of using the longer side of the screen instead, or perhaps do a drop down color picker menu page (like my browser uses for bookmarks). Don't want to take up anymore of the screen. I'd like to add more color choice, and drawing points. And add a RECT choice of brush along with the CIRCLE. I'm changing the selection mark on the colors to an emoji check mark for a nicer look. Trying to figure out how to do an UNDO...

Thanks for your additions/improvements Ricardo.

- Dav

Here is an UNDO mechanism, it's a revolving stack to generate, save and recall filenames.
The actual save and load must be added in the calling code.

Code: Select all

for i=1 to 7 ! print push_f$() ! next i
print
for i=1 to 5
  ff$=pop_f$()
  if ff$<>"" then
    print ff$
    else
    print "stack is empty" ! break
    end if
  next i
end

'  revolving stack mechanism for saving and recalling filenames
'  filenammes are generated (currently as <undo_file> and number)
'  depth may be set by max_depth=.... (currently 5 for test purpose)
'  actual depth is one less because storage of "" as kind of EOS
'  (EOS means End Of Stack) ;-)
'  saving and loading of files must be added by the calling code
'  the push_f$ overrides filenames older than max_depth
'  if pop_f$ returns "", then the stack is empty
'
def push_f$()
if sp=0 then ! max_depth=5 ! dim stack$(max_depth+1) ! end if
if sp<max_depth then sp+=1 else sp=1
f$="undo_file" & sp ! stack$(sp)=f$
if sp<max_depth then stack$(sp+1)="" else stack$(1)=""
return f$
end def

def pop_f$()
f$=push_f$.stack$(push_f$.sp) ! if f$="" then return ""
if push_f$.sp>1 then push_f$.sp-=1 else push_f$.sp=push_f$.max_depth
return f$
end def

image.jpeg (104.06 KiB) Viewed 3455 times

[rbytes]

Here is a version of SpyroDraw with a modified draw engine.

Rather than drawing a series of circles, this one draws lines between the consecutive touch points. At each touch it tests to see if the finger was just lifted. If true, it will not draw a connecting line from the previous point. It also checks to see if the two consecutive touch points are in exactly the same place. Again, if true it does not draw.

Advantages:
You will always get a continuous line, no matter how fast you draw. The line will not break up into dots, although that could be made an alternative choice.
Shadows look more realistic - they have some transparency
Lines can now be much finer, down to just a single point in width.

Code: Select all

'spyrodraw.txt v1.1b
'A simple finger drawing program
'Coded by Dav, September/2016
'Save function by ricardobytes
'FOR IPAD ONLY RIGHT NOW

'Draws up to 4 points at a time.
'Choose basic colors and brush size.

'To use: Select the color you want.
'Select number of points to draw with.
'Use slider to choose brush size to use.
'Toggle brush shadows on/off with button.
'Clear the screen with the C button.
'Save to Camera Roll with the S button.
'Selecting X will exit program.

'ipad check...
IF CAPSTR$(DEVICE_TYPE$()) <> "IPAD" THEN
   PRINT "Sorry, this is only for iPad."
   END
END IF

SET BUTTONS CUSTOM
SET BUTTONS FONT SIZE 42
SET TOOLBAR OFF
SET ORIENTATION TOP
DRAW LINECAP ROUND

GRAPHICS
GRAPHICS CLEAR 0,0,0
'SHADOW OFFSET 1,1
DRAW LINECAP ROUND
GET SCREEN SIZE w,h
FILL COLOR .5,.5,.5
F$="temp.jpg"
DRAW COLOR .5,.5,.5
SPRITE "line" BEGIN w,2
DRAW LINE 1,0 TO w,0
SPRITE "line" END
SPRITE "line" AT 1,h-60
SPRITE "line" SHOW
SPRITE "square" BEGIN 50,50
FILL RECT 25,25 SIZE 25
SPRITE "square" END
SPRITE "square" AT w-200,h-52
SPRITE "square" SHOW
FILL COLOR 0,0,0
SPRITE "circle" BEGIN 50,50
FILL CIRCLE 25,25 SIZE 25
SPRITE "circle" END
SPRITE "circle" AT w-200,h-52 SCALE 10/25
SPRITE "circle" SHOW
DRAW COLOR 1,1,1
BUTTON "quit" TEXT "X" AT w-50,0 SIZE 50,50
BUTTON "clear" TEXT "C" AT 454,0 SIZE 50,50
BUTTON "save" TEXT "S" AT 504,0 SIZE 50,50

'defaults
SIZE=10
COLOR = 1
points =4
SHADOW = 1

'draw screen
GOSUB updatecolors
GOSUB updatepoints
GOSUB updatesize
DRAW LINECAP ROUND

'main loop
DO
    IF x<>-1 AND x<>0 THEN!oldx=x!oldx2=x2!ENDIF
    IF y<>-1 AND y<>0 THEN!oldy=y!oldy2=y2!ENDIF

    GET TOUCH 0 AS x,y
    IF (x=-1 AND y=-1) OR (x=oldx AND y=oldy) THEN connect=0

    IF x<>-1 AND y>50+SIZE AND y < h-65-SIZE THEN

       'draw 1 point where finger is
       IF connect THEN DRAW LINE oldx,oldy TO x,y
       
       IF points >1 THEN
         cx=w/2!cy=h/2 'find the center spot
         'the other side of the universe...
         x2=cx-x+cx!y2=cy-y+cy 
         '2nd one
         IF connect THEN DRAW LINE oldx2,oldy2 TO x2,y2
         
       END IF

       IF points > 2 THEN
          '3rd and 4th one
          IF connect THEN DRAW LINE oldx,oldy2 TO x,y2
          IF connect THEN DRAW LINE oldx2,oldy TO x2,y

       END IF
       
       connect=1

   ELSE


   'check colors change
   IF BUTTON_PRESSED("1") THEN 
     COLOR = 1 ! GOSUB updatecolors
   END IF
   IF BUTTON_PRESSED("2") THEN 
     COLOR = 2 ! GOSUB updatecolors
   END IF
   IF BUTTON_PRESSED("3") THEN 
     COLOR = 3 ! GOSUB updatecolors
   END IF
   IF BUTTON_PRESSED("4") THEN 
     COLOR = 4 ! GOSUB updatecolors
   END IF
   IF BUTTON_PRESSED("5") THEN 
     COLOR = 5 ! GOSUB updatecolors
   END IF
   IF BUTTON_PRESSED("6") THEN 
     COLOR = 6 ! GOSUB updatecolors
   END IF
   IF BUTTON_PRESSED("7") THEN 
     COLOR = 7 ! GOSUB updatecolors
   END IF
   IF BUTTON_PRESSED("8") THEN 
     COLOR = 8 ! GOSUB updatecolors
   END IF
   IF BUTTON_PRESSED("9") THEN 
     COLOR = 9 ! GOSUB updatecolors
   END IF

   'check num of points change
   IF BUTTON_PRESSED("p1") THEN
     points=1 ! GOSUB updatepoints
   END IF
   IF BUTTON_PRESSED("p2") THEN
     points=2 ! GOSUB updatepoints
   END IF
   IF BUTTON_PRESSED("p4") THEN
     points=4 ! GOSUB updatepoints
   END IF

   'check size change
   IF SLIDER_CHANGED("size") THEN
    newsize=INT(25*SLIDER_VALUE("size"))
    'don't allow under 1
    IF newsize => 1 THEN
      SIZE=newsize ! GOSUB updatesize
    END IF
   END IF

   'turn shadows on/off
   IF BUTTON_PRESSED("shadow") THEN
      IF SHADOW=1 THEN
        SHADOW=0
      ELSE
        SHADOW=1
      END IF
      GOSUB updatepoints
   END IF

   'clear screen
   IF BUTTON_PRESSED("clear") THEN 
      GRAPHICS CLEAR 0,0,0
      GOSUB updatesize
   END IF
   
   'save image
   IF BUTTON_PRESSED("save") THEN
     GRAPHICS SAVE 0,0, w,h TO F$
     ALBUM EXPORT F$
   END IF

   'quit button check
   IF BUTTON_PRESSED("quit") THEN
     SET TOOLBAR ON
     BREAK
   END IF

   END IF

UNTIL 0

END


'=======================================
'   G O S U B S / F U N C T I O N S
'=======================================

'============
updatecolors:  'Shows user color choice
'============

  DRAW COLOR 1,1,1 ! FILL COLOR 1,0,0
  IF COLOR=1 THEN a$="^" ELSE a$=""
  BUTTON "1" TEXT a$ AT 0,0 SIZE 50,50

  DRAW COLOR 1,1,1 ! FILL COLOR 0,1,0
  IF COLOR=2 THEN a$="^" ELSE a$=""
  BUTTON "2" TEXT a$ AT 52,0 SIZE 50,50

  DRAW COLOR 1,1,1 ! FILL COLOR 0,0,1
  IF COLOR=3 THEN a$="^" ELSE a$=""
  BUTTON "3" TEXT a$ AT 103,0 SIZE 50,50

  DRAW COLOR 0,0,0 ! FILL COLOR 1,1,0
  IF COLOR=4 THEN a$="^" ELSE a$=""
  BUTTON "4" TEXT a$ AT 153,0 SIZE 50,50

  DRAW COLOR 1,1,1 ! FILL COLOR 0,1,1
  IF COLOR=5 THEN a$="^" ELSE a$=""
  BUTTON "5" TEXT a$ AT 201,0 SIZE 50,50

  DRAW COLOR 1,1,1 ! FILL COLOR 1,0,1
  IF COLOR=6 THEN a$="^" ELSE a$=""
  BUTTON "6" TEXT a$ AT 251,0 SIZE 50,50

  DRAW COLOR 1,1,1 ! FILL COLOR 1,.5,0
  IF COLOR=7 THEN a$="^" ELSE a$=""
  BUTTON "7" TEXT a$ AT 303,0 SIZE 50,50

  DRAW COLOR 0,0,0 ! FILL COLOR 1,1,1
  IF COLOR=8 THEN a$="^" ELSE a$=""
  BUTTON "8" TEXT a$ AT 353,0 SIZE 50,50

  DRAW COLOR 1,1,1 ! FILL COLOR 0,0,0
  IF COLOR=9 THEN a$="^" ELSE a$=""
  BUTTON "9" TEXT a$ AT 403,0 SIZE 50,50

  GOSUB setcolor

RETURN

'===========
updatepoints:  'shows how many points selected
'===========

  DRAW COLOR 1,1,1

  FILL COLOR 0,0,0
  IF points=1 THEN FILL COLOR .5,.5,1
  BUTTON "p1" TEXT "1" AT 554,0 SIZE 50,50

  FILL COLOR 0,0,0
  IF points=2 THEN FILL COLOR .5,.5,1
  BUTTON "p2" TEXT "2" AT 605,0 SIZE 50,50

  FILL COLOR 0,0,0
  IF points=4 THEN FILL COLOR .5,.5,1
  BUTTON "p4" TEXT "4" AT 656,0 SIZE 50,50

  FILL COLOR 0,0,0
  IF SHADOW=1 THEN FILL COLOR .5,.5,1
  SET BUTTONS FONT SIZE 25
  BUTTON "shadow" TEXT "Shadows" AT w-135,h-50 SIZE 125,50
  SET BUTTONS FONT SIZE 42
  PAUSE .25
  GOSUB setcolor

RETURN

'==========
updatesize:  'brush slider choie
'==========

  SHADOW OFF
  FILL COLOR .5,.5,.5
  DRAW COLOR .5,.5,.5
  'SPRITE LINE BEGIN 
  'DRAW LINE 1,h-60 TO w,h-60
  FIELD "brush" TEXT "Brush size:" AT 15,h-48 RO
  FIELD "brush" BACK COLOR 0,0,0
  FIELD "brush" FONT COLOR 1,1,1
  'DRAW TEXT "Brush size:" AT 5,h-40
  SLIDER "size" VALUE SIZE/25 AT 150,h-45 SIZE 400
  'FILL RECT w-175,h-25 SIZE 25
  FILL COLOR 0,0,0
  SPRITE "circle" AT w-200,h-52 SCALE SIZE/25
  'FILL CIRCLE w-175,h-25 SIZE SIZE
  IF SHADOW=1 THEN SHADOW ON
  DRAW SIZE SIZE
  GOSUB setcolor

RETURN

'=======
setcolor:  'does the actual color setting 
'=======

  IF COLOR=1 THEN DRAW COLOR 1,0,0
  IF COLOR=2 THEN DRAW COLOR 0,1,0
  IF COLOR=3 THEN DRAW COLOR 0,0,1
  IF COLOR=4 THEN DRAW COLOR 1,1,0
  IF COLOR=5 THEN DRAW COLOR 0,1,1
  IF COLOR=6 THEN DRAW COLOR 1,0,1
  IF COLOR=7 THEN DRAW COLOR 1,.5,0
  IF COLOR=8 THEN DRAW COLOR 1,1,1
  IF COLOR=9 THEN DRAW COLOR 0,0,0
  IF SHADOW=1 THEN
     SHADOW ON ! SHADOW COLOR 1,1,1
  ELSE 
     SHADOW OFF
  END IF
  DRAW SIZE SIZE

RETURN

[Dav]

Ricardo: Wow, what a great improvement! Thanks. It works & looks a lot better using that method of drawing. I didn't even know DRAW LINECAP existed! I should read the help more! I'll update the code at the top of the thread with your improvements/addiitons, so people won't have to read the whole thread to get the best best version.

Henko: Thanks for your idea & code.

- Dav