Howdy, Stranger!

It looks like you're new here. If you want to get involved, click one of these buttons!

[App Sharing] Being confident with lines.

edited January 2015 in Code Sharing Posts: 505


Hey guys,

Yesterday I thought a lot about drawing. And lines as a such medium.

People often think, that they are not able to draw. They are afraid of trying! They are afraid of leaving their comfort zones!

So I sat down and tried to find a solution for this dilemma. - How could I push myself out of my comfort zone and make myself productive, more inventive and more active?

I opened Codea an began to experiment.

[Source] This App is what came out!

I described it all here, on my personal Blog. And apologize for it being german. But you might use that fancy google translation tool on the page..

UI is quite simple to use.

    - Paint: Drag finger to paint.

    - Erase: Set Color alpha to less than 50%, and it jumps to fully transparent. This means the pen acts now as an eraser!

    - Eyedropper: Hold down your finger, for a second. The eyedropper is now active, by dragging around you can sample color from canvas.

    - Mirror: Rotate your device by 180° - the canvas flips horizontally!

    - Save: To save your work, press HOME and POWER buttons on your iPad simultaneously.

    - Delete: Reload or restart the app.

In this post are a few images I created during my development session. There are more, but I have to sort them out first. Join me (maybe) and show off what you did with this app?! (I would be honored!)

Btw, you can always change the background color and mirror (flip) the canvas by rotating your device by 180°!



  • Jmv38Jmv38 Mod
    Posts: 3,297

    @se24vad nice, simple, fast. I am proud you tried to draw my avatar, but you still have to work on that, it is not quite alike... ;)

  • Posts: 505

    :)) :)>-

  • IgnatzIgnatz Mod
    Posts: 5,396

    actually, @Jmv38, your avatar picture has not changed for a long time, so maybe he drew it as it is now, all grown up... :D

  • Nice drawing app! Simple, but I like it, a lot.

    @Ignatz I don't think ginger cats turn grey when they get older ;)

  • edited September 2014 Posts: 282

    @se24vad Nice app. One suggestion. Add this in setup so people can clear the image without losing their color settings:

    parameter.action("Clear", function() Canvas=nil Canvas=image(WIDTH, HEIGHT) end)

    @Jmv38Success! ;)

  • edited September 2014 Posts: 505

    @Saturn031000 actually, this is a pretty good idea! I updated my app to remember color settings. thanks! Grab the new Source here!

    I also played with opacity :) I'm not sure if I like it, but its there now and I'm testing it. (Right now its a little buggy. - When sampling transparent color, it returns a darker color. But I think I know whats wrong and will re-work later.)


  • IgnatzIgnatz Mod
    Posts: 5,396

    @se24vad - nice drawing, and you have a nice brushstroke effect. :-bd

  • edited September 2014 Posts: 135

    I added an erase button by adding this parameter:

    parameter.action("Clear",function() setContext(Canvas) background(BG) setContext() end)
  • edited September 2014 Posts: 505

    @Doge because you want to be able to change the BG color, you better do it like:

    parameter.action("Clear",function() Canvas = image(WIDTH, HEIGHT) end)

    Otherwise the Canvas is filled with background and you wont be able to see the actual BG.

    I actually plan to add a gesture: shake to erase

  • toffertoffer Mod
    Posts: 151

    @se24vad - Really nice app - I like it's simplicity. And it's fun to tweak around it, the plugin system is awesome, open Codea... and type some code :)

    Playing with lineCap and alpha look like (a little) 'paper pencil' / painting effects.

  • edited September 2014 Posts: 505

    @toffer love your art! well done! =D>

    #Edit: The pencil tool looks really cool!

  • edited September 2014 Posts: 505

    I've added a new triple-tap gesture. This replaces the need of transparency! Try to tap the screen 3x times and hold down your finger on the third tap. Then move your finger up and down:

    The Gist was updated!


  • Posts: 505

    Updated Gist. Refactored code and added some more app-logic.

    Have fun! This is the final version of my barebone painting app :)

    Download Source!

    - Delete from painting by setting "Color" opacity to 0.
    - Mirror your drawing to spot imperfection, by rotating your device by 180°.
    - Hold down one finger to sample "Color" from Canvas.
    - Tripple-Tap and hold down one finger, to choose a shade of your current "Color".
    - Take screenshot by pressing Power and Home buttons of your device simultaneously.
    - Delete Canvas by reloading the Codea project. "Color" and "BG" are preserved!


  • pressing Home & Power isn't really a feature. that's built into iOS.

  • edited September 2014 Posts: 505

    thats why I'm using it :) - I never said, that it is a feature of the app. And I never said, that I have programmed it ;)
    It just helps to keep the app as simple as possible!

  • IgnatzIgnatz Mod
    Posts: 5,396

    I agree, use what is built in, where you can

    Nice picture of your pet cat, by the way...

  • edited September 2014 Posts: 282

    I believe its a picture of Jmv38's cousin ;)

    @se24vad I believe apps are never finished as there is always something to be added.

  • Posts: 2,051

    instead of home + power, you can also use the built in Codea button, which will grab a screenshot without the buttons overlay

  • Jmv38Jmv38 Mod
    Posts: 3,297

    @se24vad better, but that's my dad, not me...

  • Posts: 505


  • The user and all related content has been deleted.
  • edited September 2014 Posts: 223
    The user and all related content has been deleted.
  • edited September 2014 Posts: 547


    first off, nice program you got there, I really like it :)

    I had some time and played a bit with it, and made a minor adjustment

    if Color.a > 127.5 then Color.a = 255 if Color ~= color(0, 0, 0, 255) then storedColor = Color end Color = storedColor else Color = color(0, 0, 0, 0) end -- Transparency is used for erasing, NOT for drawing!

    I changed this in draw

    Why? Just because I like being able to have my 'old' color after erasing something

    I'm sure it's not optimised but I thought I'd share it with you, and nice job sir :)

    EDIT: I just realised that I copied the wrong version, and thus my comment may be discarded since you've already implemented something like this
    My apologies for this

    Also, the triple-tap-hold doesn't seem to do anything for me :(

  • edited September 2014 Posts: 505

    @stevon8ter you have to tripple tap, and hold down your finger on the third tap... for about one second! UI pops up then.

  • @se24vad, I tried that already but nothing happens, I'll try it again in a while, if it doesn't work, I'll look into the code and report back to you

  • Posts: 505

    this is the relevant line (35) of code:

    if colorshadetimer and ((ElapsedTime - colorshadetimer) > 1) then Mode = 3 end

    change 1 to something like .3 and it will pop up sooner.

  • edited September 2014 Posts: 547

    looks like it worked this time (without any adjusting)

    I probably did something wrong when I tried it at first ;p

    also @se24vad, would you mind if I take your amazing app, and adjust it a bit to have a 'better' color picker? (with better I mean having it not in the codea parameters) and a few other UI changes?

    EDIT: not meaning your app's bad or so, it's just amazing :) and I'd like to refresh my coding a bit and see this as a small step towards that, if I may from you at least

  • edited September 2014 Posts: 505

    @stevon8ter its open source! - have a go ;)

Sign In or Register to comment.