Search within TutorialsPark

Canvas Save-Restore


Use Canvas Methods of save and restore to save drawing state and use it later


Your browser doesn't support the canvas element

Click Save() to push colors in the Lifo (Last-in-First-Out) Stack.

Click Restore() to pop colors out of the Lifo (Last-in-First-Out) Stack.


Save and Restore Drawing State:save() and restore()

1.To save the values of your drawing state properties to them at later stages use method save().

2.This method will push your current drawing state on a stack of saved drawing states,such that it can be retrived at a later stage within the code.

3.To pop the saved drawing state out from the stack use method restore()

4.This method proves very useful when the graphics are complex in nature, requiring combination of several methods.

Example: Canvas save() and restore().

Give it a TRY! » Note-A stack is a last-in first-out datastructure, the latest entry is the first to move out.


Cliping a region: clip().

1.To create a cliping region on the canvas use method clip().

2.This method will create a clipping region on the canvas such that any drawing, shape, Image etc that falls outside the region are clipped.

3.Once A region is clipped, there is no way to restore back to orginal state.In case you intend to restore to original states use save() and restore().

Example: Clipping a region, method clip().

Give it a TRY! » Note-All drawings outside the clipping region are only clipped.


Check for point within a region: isPointInPath(x, y).

1.To check if a given point lies within the shape defined by the current path use isPointInPath(x, y).

2.Its a Boolean method and returns the output as true or false depending upon whether the condition is satisfied.

Example: isPointInPath(x, y).

Give it a TRY! » Note-The method is useful when we are dealing with collison detection and other animations.


Related Examples

Related Tags