Problem getting drawing to be smooth

I have code that currently works.
It show a drawing tool on the screen and you can drag the tool around the screen and it use’s display.newImage to draw with a tiny image. It also stores them so an undo or erase buttons can clear out the drawing. This all works, EXCEPT if I move the tool with my finger fast or even slightly fast the drawing has gaps.

I have used the isfocus command as suggested by other code examples but it still doesn’t work to smooth things out.

Any suggestions?

Here’s the code.

local widget = require “widget”
– This is only included because I used the widget.newButton API for the example “undo” & “erase” buttons. It’s not required for the drawing functionality.

local moveTool = {}

– VARIABLES & LINE TABLE (required)

local lineTable = {}
– This is a required table that will contain each drawn line as a separate display group, for easy referral and removal
– create object
local myObject = display.newImage(“ScorchPen200x81.png”,0,0,100,100)
function myObject:touch( event )
local function drawLine()
local line = display.newImage(“FeatherTip_4x2.png”,linePoints[#linePoints-1].x,linePoints[#linePoints-1].y,linePoints[#linePoints].x,linePoints[#linePoints].y)
lineTable[i]:insert(line)
end

local t = event.target

local phase = event.phase

if “began” == phase then
display.getCurrentStage():setFocus( t )
t.isFocus = true

– Store initial position
t.x0 = event.x - t.x
t.y0 = event.y - t.y

z = 1
i = #lineTable+1
lineTable[i]=display.newGroup()
linePoints = nil
linePoints = {};

local pt = {}
–pt.x = event.x;
–pt.y = event.y;
pt.x = t.x0
pt.y = t.y0
table.insert(linePoints,pt);

elseif t.isFocus then
if “moved” == phase then
t.x = event.x - t.x0
t.y = event.y - t.y0

local pt = {}
pt.x = t.x - 100;
pt.y = t.y + 30;

if not (pt.x==linePoints[#linePoints].x and pt.y==linePoints[#linePoints].y) then
table.insert(linePoints,pt)
–lineTable[i]:insert(line)
drawLine()

end

z = z + 1

elseif “ended” == phase or “cancelled” == phase then
display.getCurrentStage():setFocus( nil )
t.isFocus = false

i=nil

–t:pause()

end
end

– Stop further propagation of touch event!
return true
end

function myObject:timer( event )
local count = event.count

–print( “Table listener called " … count … " time(s)” )
–self.text = count

– if count >= 20 then
– timer.cancel( event.source ) – after the 20th iteration, cancel timer
– end
end

– Register to call t’s timer method 50 times
timer.performWithDelay( 5000, myObject, 1 )


– UNDO & ERASE FUNCTIONS (not required)

local undo = function()
if #lineTable>0 then
lineTable[#lineTable]:removeSelf()
lineTable[#lineTable]=nil
end
return true
end

local erase = function()
for i = 1, #lineTable do
lineTable[i]:removeSelf()
lineTable[i] = nil
end
return true
end


– UNDO & ERASE BUTTONS (not required)

local undoButton = widget.newButton{
left = 25,
top = display.contentHeight - 50,
label = “Undo”,
width = 100, height = 28,
cornerRadius = 8,
onRelease = undo
}

local eraseButton = widget.newButton{
left = display.contentWidth-125,
top = display.contentHeight - 50,
label = “Erase”,
width = 100, height = 28,
cornerRadius = 8,
onRelease = erase
}

–function MyClass:enterFrame( event )
– print( "enterFrame called at time: " … event.time )
–end
–function moveTool:touch(event)

–self.markX = self.x – store x location of object
–self.markY = self.y – store y location of object

–local mapX, mapY = map:getPosition()
– local diffX = event.x ;
– local diffY = event.y ;
–myObject.transition = transition.to( myObject, { time = 500, x =diffX ,y = diffY, onComplete = onTransitionComplete } )
–transition.to( myObject, {time=500, delay=3500, alpha=0})
–transition.to( myObject, { time = 500, x =diffX ,y = diffY, onComplete = onTransitionComplete } )

local function moveTool(event)
local diffX = event.x;
local diffY = event.y;
–transition.to(myObject, {time=500, delay=0, alpha=0})
transition.to( myObject, { time = 5, x =diffX ,y = diffY, onComplete = onTransitionComplete } )

end

– make ‘myObject’ listen for touch events
–background:addEventListener(“tap”,moveTool)
myObject:addEventListener( “touch”, myObject )
Runtime:addEventListener(“touch”, moveTool) [import]uid: 44287 topic_id: 22590 reply_id: 322590[/import]

setup a enterframe
draw the line in the enterframe loop not in the touch

all the drawings in corona happen on an enterframe event, set one up and draw there.

right now you are ‘loosing’ x,y due to the fact that it has to jump out to render.

while on touch i would render a circle first instead of image. display.newImage can be costly. though we don’t load the image from disk if we know it is the same image beingloaded.
once the touch ended - re-render the line with the feather. destroy the lines with circles.

or

draw circles instead of feathers but on the enterrame you can redrwa with the feather brush [import]uid: 24 topic_id: 22590 reply_id: 90102[/import]

Great! Thank you!
I’ll give it a try!

[import]uid: 44287 topic_id: 22590 reply_id: 90198[/import]