Game Programming‎ > ‎

Drawing - Simple Version Using LiveCode Tools

Making a Simple Drawing Program
This will show you how to make a really simple drawing program using LiveCode Tools.

Example: (You can add to the graphics, background, etc)


Getting Started:

    Open a new card and drag 5 buttons and an "image area" to the card


    Name the image "paper"

    Add the following code to it:

    Add the following scripts to the buttons:





            Use the code for the GREEN button above but change the colors

    Now You have a nice coloring program:


 For You To Do:
                1. Experiment by moving the commands around. 
                        Will it work better if they were on the card instead of the image? 
                        Do you need to set the pencolor for each color? 
                        Can you put that line on the image instead? ("choose pencil tool" )
                2. Can you add line thickness to it? (hint set the penHeight or penWidth to a number
                3. Can you add other tools?

Extra Credit: Save Your Drawings
        1. Add a button with the code:
                    export image "paper" to file "myDrawing.jpg" as JPEG

             2. add a text field so the user can type a name for it instead of "myDrawing.jpg"

Drawing a Straight Line Inside an Image with Code:
            Here is code to draw a straight line with code inside of an image:

            on mouseUp
                    set the penColor to "green"
                    set the penHeight to 5
                    set the penWidth to 5
                    choose line tool
                    drag from 0,0 to 10,20
                    choose browse tool
            end mouseUp

Problems? Want to do more?
If you want to do more with drawing, the mouse messages could cause problems. Please read the following post on the forum: