20140810:
UndoRedo2.aia
I have reworked the project to include undo on the color setting.
A list of lists with an index pointer is used to simplify the design which replaces the more complex doubly-linked list structure.
20140806:
This project was done with AI2 blocks also.
Here are the blocks for the AI2 version:
It uses a doubly-linked list and is identical to the AI Classic version.
Also, see the attached aia file.
---
My first attempt at undoing an action on the drawing canvas used a
stack and was much simpler than this implementation. But I could not figure out how to easily add a redo feature which is common in many software packages. A
doubly-linked list worked well in this case because it allows easy movement backwards to undo operations and forwards to repeat operations.
If you are not familiar with the concept of a doubly-linked list, it is explained
HERE. I used it to store the operation and it's values in a list that includes a way to get to the previous operation that was performed (undo) and to get to the next one to be performed (redo).
The operations that need to be remembered in this example are all of the <canvas>.
DrawLine and it's 4 x,y tags.
Here's the simplified Hello Kitty app with just the Drawline tool enabled.
The default line width is 2, and PaintColor is RED. By dragging a finger on the screen a line is drawn - in this case, glasses with a nose support...
The nose support was the last thing drawn, and we want to do a monacle on the left eye instead, so the nose support is removed...
And the handle for the monacle added...
Screen Designer:
Blocks:
A block is created to help add the Drawline data to the list. Notice that it begins and ends with two number sevens. Those two 7's are the distance from the start of this group of items to the next and from the end of the group to the previous group in the list. This is the double-linking of the doubly-linked list. For other operations you will need to make similar blocks to handle tools like
DrawText, DrawCircle, etc.
The undo and redo functions just navigate backward or forward , get the operation to be performed and the data, then call the DrawLine block. The only difference between the two is that for undoing a drawn line, the PaintColor must be set to NONE before the line is drawn which erases the line that was previously drawn there.
Here is a closeup of the blocks needed for the DrawLine tool. To add other tools like DrawText or DrawCircle, etc. you need to add blocks like these here for them: