How To ... Develop a Bitmap Painting Tool - Basic Utility

Step-By-Step

macroScript MicroPaint category:"HowTo" (

We define a macroScript called MicroPaint which will appear in the "HowTo" category.

global MicroPaint_CanvasRollout

In order to be able to close any existing dialog from previous sessions, we define the variable of the rollout to be used as dialog as a global variable.

Local and Global Variables

try(destroyDialog CanvasRollout)catch()

Then we try to destroy any existing dialog from a previous session. If there is none, the try()catch() error trap will prevent any error messages.

Try Expression

local isDrawing = false

This local variable will be used as a flag for enabling drawing. When the variable is false, the mouse move event handler will not draw. When the left mouse button has been pressed, this variable will be set to true and allow drawing until the left mouse button is released.

BooleanClass Values

local bitmapX = bitmapY = 512

These local variables will contain the size of the bitmap to be painted. Simply changing this value would resize the tool to paint on a different canvas size!

local theCanvasBitmap = bitmap bitmapX bitmapY color:white

This variable will contain the canvas to draw on. We initialize it to a white bitmap with a size of 400 by 400 pixels.

Bitmap Values

rollout MicroPaint_CanvasRollout "MicroPaint" (

This is the rollout which will define the dialog with the bitmap canvas.

bitmap theCanvas pos:[0,0] width:bitmapX height:bitmapY bitmap:theCanvasBitmap 

This is the bitmap User Interface control. It is aligned to the upper left corner of the rollout and displays the 400 by 400 canvas bitmap.

Bitmap

bitmap my_bmp width:100 height:100

local my_bmp = bitmap 100 100

fn paintBrush pos = (

This function will be called to draw a point on the bitmap. The argument pos will contain the 2D coordinates to place the new point at.

Defining Custom Functions

setPixels theCanvasBitmap pos #(black)

setPixels is used to change the color of one or more pixels in a row. The pos defines the location in the bitmap (where 0,0 is the upper left corner) the paining should start at.The colors to be changes are provided in an array. In our case, the array contains a single element, the color black.

setpixels

theCanvas.bitmap = theCanvasBitmap

After the black point is drawn into the bitmap, we assign it to the user interface control to update the drawing.

) onMicroPaint_CanvasRollout lbuttondown pos do (

This dialog event handler is called whenever the left mouse button is pressed while the mouse is located over the rollout. The argument pos will contain the 2D position in rollout coordinates.

CreateDialog

isDrawing = true

We raise the flag to notify the mousemove handler (see below) that the drawing can be started.

paintBrush pos

We also call the paintbrush function by passing the currently clicked point to it. This way, simply clicking without moving the mouse will cause a black point to be placed on the bitmap.

 ) on MicroPaint_CanvasRollout lbuttonup pos do isDrawing = false

This dialog event handler is called whenever the left mouse button is released. We just lower the flag again so the drawing can be stopped.

on MicroPaint_CanvasRollout mousemove pos do if isDrawing do paintBrush pos

This dialog event handler is called whenever the mouse movies over the rollout, regardless of the button state. The argument pos contains the 2D position in pixels inside the rollout, coinciding with the position in pixels inside the bitmap (remember? Both have the same origin [0,0].

We check to see whether the left mouse button has been pressed but not released yet by looking into the isDrawing variable. If it contains true, we call the drawing paintbrush function with the current position of the mouse inside the dialog.

) createDialogMicroPaint_CanvasRollout bitmapX bitmapY

Finally, we create a dialog using the rollout we just defined.

)

Result

Next Tutorial:

How To ... Develop a Bitmap Painting Tool - Strokes Support