AS3: History Manager Class

13 years ago

Recently at work I have been building a text editing application to help speed up the process of adding HTML tags to text for Flash. Today I wrote a simple reusable history management class to enable undo/redo on a text field. This is the first version so there may still be some bugs. I also hope to extend it’s functionality to display objects.

The HistoryManager provides any number of undo/redo steps which is set on instanciation – could be limited to 1 step or 100 steps depending on the use,
As well a a typing sensitivity i.e each character could be saved, or blocks of text

Type or copy some text into the example below to test it out. The class file is available at the bottom of the post and all documentation and usage examples are in the file.

[kml_flashembed publishmethod=”static” fversion=”9.0.0″ movie=”https://www.purplesquirrels.com.au/blogstuff/historymanager/historytest.swf” width=”650″ height=”300″ targetclass=”alignnone”]

[/kml_flashembed]

Download the above example (Flash CS5)
Download HistoryManager.as

Inspiring Inspiration #1

13 years ago

First is this great infographic for a documentary called Waiting For ‘Superman’ which highlights a bunch of issues in America. I love the simple colours and textures in this and the animation is really smooth and flowing. The use of circles is awesome too!

Secondly, an animated video clip for Don’t Give it Up by Deep River Running. I like the spooky carnival graphics and the the film effects added in post.

Invisible Mouse

13 years ago

Here is a cool video that was posted over at the NUI Group forums. This guy has used infra-red lasers and a webcam along with CCV to track the users hand position and movement, which is then translated into cursor movements and clicks. Pretty cool idea.

AS3 – Getting the order of MovieClips in the stage

13 years ago

Here is yet another small code snippet which allows you to get the order of MovieClips that are positioned on the stage.

[kml_flashembed publishmethod=”static” fversion=”9.0.0″ movie=”https://www.purplesquirrels.com.au/wp-content/uploads/2010/06/sorting.swf” width=”550″ height=”200″ targetclass=”alignnone”]

[/kml_flashembed]
[cc lang=”actionscript3″]
var boxes:Array = [box1, box2, box3, box4]; //put the MovieClips into an array

function getOrder():void
{
boxes.sortOn(“x”, Array.NUMERIC); //sort array on the x positions from smallest to largest
trace(boxes); // traces the order of the boxes according to their x positions
}

getOrder();
[/cc]

Source for the demo above: Download

AS3 – Detecting Control, Shift and Alt keyboard shortcuts

13 years ago

Here is a snippet of code which allows you to detect keyboard shortcuts such as ctrl+[another key] and ctrl+shift+[another key]. I wasn’t able to find any decent examples of detecting shortcuts but after reading the AS3 documentation I found that the Keyboard event contains the following boolean properties [cc lang=”actionscript3″]
ctrlKey
shiftKey
altKey
[/cc]
So by simply checking if those properties a true you can fire code after a combination was pressed.

The following detects ‘ctrl+p’:

[cc lang=”actionscript3″]
stage.addEventListener(KeyboardEvent.KEY_UP, onKeyBoardUp);

function onKeyBoardUp(e:KeyboardEvent):void
{
if ( e.ctrlKey ) //if control key is down
{
switch ( e.keyCode )
{
case Keyboard.P : //if control+p
//do something
break;
}
}
}
[/cc]

You can also detect ctrl+[another key] and ctrl+shift+[another key] at the same time by using:

[cc lang=”actionscript3″]
function onKeyBoardUp(e:KeyboardEvent):void
{
if ( e.ctrlKey ) //if control key is down
{
if ( e.shiftKey ) //if shift key is also down
{
switch ( e.keyCode )
{
case Keyboard.U : //if control+shift+u
//do something
break;
}
}
else //otherwise do normal control shortcut
{
switch ( e.keyCode )
{
case Keyboard.P : //if control+p
//do something
break;
}
}
}
}
[/cc]

AS3 – Repositioning the ComboBox dropdown list

13 years ago

If you’re like me and you don’t mind using some of the built in components in Flash to quickly build a UI but hate the look of them, you’ve probably made your own skins for them which is all well and good. But sometimes there are little things that really annoy me like the ComboBox for example. Recently I was building a custom skin for it but I needed the dropdown list to be shifted down a couple pixels so it wouldn’t overlap with the main box. I spent hours (unsuccessfully) trying to find a way to move it (all for 2 pixels) and after looking at the ComboBox class files and a few other custom classes people had made for customising components I came up with the the solution below. It’s really simple to use – just save the following class in the correct folder structure, change the class in the linkage properties of the ComboBox to the one below and edit the x and y values of ‘list’ in the positionList() function. Too easy!

Before and After

The code:

[cc lang=”actionscript3″]
package com.nv.utils
{
import fl.controls.ComboBox;

/**
* For repositioning the drop down list on the combo box component.
*
* HOW TO USE:
*
* simply put this class in the correct folder structure above
* then change the linkage class of your combo box to:
* com.nv.utils.ComboBoxListRepositioner
*/

public class ComboBoxListRepositioner extends ComboBox
{
public function ComboBoxListRepositioner()
{
super();
}

override protected function positionList():void {
super.positionList();
list.y += 2; //moves the dropdown list down 2px
}
}
}
[/cc]