Question about the touch function

Questions
1

i am a beginner and i am trying to make a code in which you can draw. I can get it to draw by making it place ellipses where ever I touch but I want to be able to make the drawing size bigger and smaller and change the color without the spot I lifted my finger to get larger or change color. I know its confusing so I’ll give you what I have so far.

function setup()
  
x = 100000

y = 100000

parameter.color("Color", color(255, 0, 0, 255))

parameter.integer("Size", 0, 150, 20)

backingMode(RETAINED)
    
end

function draw()

fill(Color)

ellipse(x, y, Size)

end

function touched(touch)

x = touch.x

y = touch.y

end
2

@Joey72099 A easy way of not allowing the spot to get bigger would be resetting the x and y.

Example:

function setup()

x = 100000

y = 100000

parameter.color("Color", color(255, 0, 0, 255))

parameter.integer("Size", 0, 150, 20)

backingMode(RETAINED)

end

function draw()

fill(Color)

ellipse(x, y, Size)

x = 100000
y = 100000


end

function touched(touch)

x = touch.x

y = touch.y

end
3

Easiest way is to use a table.

EX: in setup define the table: spots = {}

in draw you draw the stuff in the table:

for id, spot in ipairs(spots) do
    fill(spot.colour)
    ellipse(spot.x, spot.y, spot.size)
end

in touched you store touches in the table: table.insert(spots, {x = touch.x, y = touch.y, size = Size, colour = Color})

Hope that helps. (Just remove the code you have in draw and use this instead)

If you need/want an explanation of how it all works, feel free to ask

P.S. @Prynok, how does that solve the problem?

4

@JakAttak It does not seem to be working for me. What should I get rid of from my original?

5

@JakAttak @Prynok I’m pretty sure that Prynok’s idea works but I think in the long run as a new programmer I’m going to want to better understand tables and the stuff that JakAttak’s using so I still want to hear your idea JakAttack but thanks for the script Prynok

6

@Joey72099, i may have misunderstood what you wanted to do…

But try this:

function setup()
    parameter.color("Color", color(255, 0, 0, 255))

    parameter.integer("Size", 0, 150, 20)

    backingMode(RETAINED)

    spots = {}
end

function draw()
    for id, spot in ipairs(spots) do
        fill(spot.colour)
        ellipse(spot.x, spot.y, spot.size)
    end
end

function touched(touch)
    table.insert(spots, {x = touch.x, y = touch.y, size = Size, colour = Color})
end
7

@JakAttak Can you explain how this works to me

8

and would there be any way to keep it from making separate circles instead of a single line if you go to fast across the screen or is that just a processor thing or something like that that just can’t do that many circles a second

9

@Joey72099 - it sounds like you may need to do a few tutorials before going any further. You’ll find them on the wiki link above, along with some ebooks. I recommend starting with Lua, the language behind Codea.

We don’t have the resources to do 1:1 training in the forum, unfortunately.

10

@Ignatz ok

11

The line in setup: spots = {} initiates a table and stores it as variable spots.

The code in draw is called a for loop. It goes through everything stored in the table spots and draws a circle using the info stored.

The code in touched stores the info of the size, colour, and placement of the dot everytime you touch the screen. This is permanent, allowing you to change the Size and Color without overwriting already draw dots.

12

@JakAttack He asked
“I want to be able to make the drawing size bigger and smaller and change the color without the spot I lifted my finger to get larger or change color.”

So I gave him a easy solution, so instead of the touch always being in the last place, causing the above problems, it resets itself back to the original position.

13

@Joey72099, I think you should look at the backingMode(RETAINED) function. Here is a small demo I whipped up:

function setup()
    backingMode(RETAINED)
    background(255, 255, 255)
    stroke(0)
    strokeWidth(20)
    parameter.integer('StrokeWidth', 0, 150, 20, strokeWidth)
    parameter.color('Color', color(0, 0, 0, 255), stroke)
    parameter.action('Clear', function () background(255, 255, 255) end)
end
function draw()

end

function touched(touch)
    line(touch.x, touch.y, touch.x - touch.deltaX, touch.y - touch.deltaY)
end
14

Joey72099 Is this kind of what you’re after. Change the size and color for each draw.


function setup()
    parameter.color("colr",255,0,0)
    parameter.integer("size",2,80,10)
    xyTab={}    -- x,y table
    colTab={}    -- color table
end

function draw()
    background(40,40,50)
    for a,b in pairs(xyTab) do
        stroke(colTab[a])    -- set olor
        strokeWidth(b.z)    -- set line size
        if b.w==1 then
            sx=b.x    -- start line x,y location
            sy=b.y
        else
            line(sx,sy,b.x,b.y)    -- draw line from previous location
            sx=b.x    -- save x,y for next line 
            sy=b.y
        end
    end
end

function touched(t)
    if t.state==BEGAN then    -- starting to draw
        table.insert(xyTab,vec4(t.x,t.y,size,1))    -- save x,y position
        table.insert(colTab,colr)    -- save color
    end
    if t.state==MOVING then     -- continue to draw
        table.insert(xyTab,vec4(t.x,t.y,size,2))
        table.insert(colTab,colr)
    end
end
15

@Jordan So does the clear button make everything the background color or does it get rid of the writing?

16

@Jordan @dave1707 both of these work great thanks so much for the help