a girl named sue

If you like to customize (skinning) the look of your menu tree component in flash please take a look at the following examples of the properties you can change.

public var myTree:Tree;

myTree.setStyle(”fontSize”, “10″);
myTree.setStyle(”fontFamily”, “Verdana”);
myTree.setStyle(”backgroundColor”, “0xEBEBEB”);
myTree.setStyle(”borderStyle”, “none”);
myTree.setStyle(”color”, “0×666666″);
myTree.setStyle(”rollOverColor”, “0xE3E3E3″);
myTree.setStyle(”selectionColor”, “0xE3E3E3″);
myTree.setStyle(”textRollOverColor”, “0×666666″);
myTree.setStyle(”textSelectedColor”, “0×666666″);

If you want to customize the icons in your tree component you can by creating your own icon. Convert your icon to a movie clip symbol and it’s important that you give it a unique Linkage Identifier name. You can do this by clicking on the Advanced button in the Symbol Properties box. If you don’t you will not be able to customize the look of your icons. These are the 5 icons you can customize.

myTree.setStyle(”defaultLeafIcon”, “LinkageIdentiferName”);
myTree.setStyle(”folderClosedIcon”, “LinkageIdentiferName”);
myTree.setStyle(”folderOpenIcon”, “LinkageIdentiferName”);
myTree.setStyle(”disclosureOpenIcon”, “LinkageIdentiferName”);
myTree.setStyle(”disclosureClosedIcon”, “LinkageIdentiferName”);

For more infomation on customizing the tree component in flash click here.

I needed to create a simple banner for a client where text would fade in and slide in from the left. So here’s a simple way to rotate text in a textfield. Now it’s easy to update text later down the road and you don’t have to manually tween every text box. I’ve added a nice fade in and slide transition to make it more pretty.

On your timeline window be sure to create a movieclip called “mc_instancename“. In the movieclip “mc_instancename” create a textbox called “txt_instancename”. Adjust the x and y coordinates and alpha amounts yourself in the tween class. Please note that this does not loop. But you can easily adjust the code to have it loop.

function tweenText() {

new mx.transitions.Tween(mc_instancename, “_alpha”, mx.transitions.easing.Regular.easeOut, 0, 100, 2, true);
new mx.transitions.Tween(mc_instancename, “_x”, mx.transitions.easing.Regular.easeOut, 533, 276, 1, true);

}

var intervalId:Number;
var count:Number = 0;
var maxCount:Number = 6;
var duration:Number = 5000;

var rotatingtext:Array = new Array();
rotatingtext[0] = “Place text here”;
rotatingtext[1] = “Place text here“;
rotatingtext[2] = “Place text here“;
rotatingtext[3] = “Place text here”;
rotatingtext[4] = “Place text here“;
rotatingtext[5] = “Place text here“;
rotatingtext[6] = “Place text here“;

function rotateText(param:String) {

tweenText();
mc_instancename.txt_instancename.htmlText = param;
clearInterval(intervalId);

if (count<maxCount) {

count++;
intervalId = setInterval(this, “rotateText“, duration, rotatingtext[[count]);

} else if (count=maxCount) {

clearInterval(intervalId);

}

}
if (intervalId != null) {

clearInterval(intervalId);

}
intervalId = setInterval(this, “rotateText“, 0, rotatingtext[count]);

Mike sent me this sexy Overview on Adobe’s Apollo. Apollo will aparently let you create desktop applications using Flash, Flex, Actionscript, HTML, and more. Looks very cool.

Check out the sexy pdf “Understanding Apollo”

Found this nifty little Flash plug script that lets you swap the .swf file for a .gif when the user doesn’t have the flash plug-in installed.

A better alternative to the “go to a different URL” script when you have non-flash elements on the page.

http://www.kirupa.com/developer/mx/detection.htm

To remove these movie clips you must swap depths. Try swapping your movie clip to a level of 0 and then remove the clip like so:

instanceName.swapDepths(0);
instanceName.removeMovieClip();

* Please note that to remove a movie clip it must have been originally placed on the timeline by the attachMovie() or duplicateMovieClip() function. For example:

this.attachMovie(”IndentiferName”, “instanceName”, this.getNextHighestDepth());

Here are some strategies to make Flash applications and content accessible to different disability types:

Hearing disabilities

• Provide audio narration when needed
• Provide captions for audio narrations

Photo epilepsy

• Remove strobing content that flashes between 2 and 55 times per second

Motor disabilities

• Ensure the Flash content is keyboard accessible

Cognitive disabilities

• Give users control over time sensitive content
• Provide easy to use controls and navigation schemes
• Be consistent
• Use the clearest, simplest language appropriate to the content

Low vision

• Be sure to have significant contrast between foreground and background colors to assist users who have difficulty seeing particular colors
• Avoid using light gray text on a white background as users can have trouble reading it
• Allow the Flash content to scale to a larger size

Blindness

• Ensure screen reader accessibility
• Ensure keyboard accessibility
• Do not interfere with screen reader audio or keyboard commands
• Provide textual equivalents for all non-text elements that convey content or provide a function.

Color Blindness

• Avoid using color to communicate information or directions to users. Color blind users will not be able to operate the flash page

Checking for Accessibility

Accessibility.isActive();

Indicates whether an accessibility aid is currently active and the player is communicating with it. Use this method when you want your application to behave differently in the presence of a screen reader or other accessibility aid. Call this method 1 –2 seconds into your timeline as there is a slight communication delay between the flash player and accessibility aid upon initialization.

System.capabilities.hasAccessibility;

Read only property. Returns a Boolean value that if returns true the player is running in an environment that supports communication between Flash Player and accessibility aids.

Accessiblity Properties

instanceName._accProps.propertyName

Lets you control screen reader accessibility options for SWF files, movie clips, buttons, dynamic text fields, and input text fields at runtime.

Property Name/Data Type/Definition

.silent / Boolean / Make Movie or Object Accessible
.forceSimple / Boolean / Make Child Objects Accessible¹
.name / String / Name²
.description / String / Description
.shortcut / String / Keyboard Shortcut³

1. Avoid setting this property to true as it will make every symbol contained in a movie clip accessible.
2. Please note that Name has a max character length of 256.
3. You will have to create the keyboard shortcut. Flash does not check that the ActionScript to code the keyboard shortcut has been created.

Accessibility.updateProperties();

Causes all changes to accessibility properties of objects to take effect. Only one call to Accessibility.updateProperties() is necessary.

Sample:

if (instanceName._accProps == undefined ) {
instanceName._accProps = new Object();
}
// Properties
instanceName._accProps.name = “Name goes here”;
instanceName._accProps.description = “Description goes here”;
instanceName._accProps.shortcut = “Ctrl+7”;
// Update properties
Accessibility.updateProperties();

Reading Text Fields

For screen readers to read contents of a dynamic or input text field, have the accessibility .description property equal to the value of the dynamic or input field.

* Note that static text fields are not accessible and screen readers do not recognize these fields.

inputTextField._accProps.description = inputTextField.text;

If the contents of a dynamic or input field are empty, you may do the following:

if (inputTextField.text == “”) {
inputTextField._accProps.description = “textfield name. this field is empty.”;
} else {
inputTextField._accProps.description = “textfield name. Textfield contains “+inputTextField.text;
};

Reading Order

• You must use ActionScript to assign a tab index to every instance. Avoid using the Accessibility panel to specify the tab index.
• You must create a tab index for every accessible object, not just the focusable objects. Do not miss ordering a single accessible instance in your SWF file, or the reading order reverts to the default reading order which can be unpredictable.
• Avoid using invisible buttons, screen readers do not recognize these buttons.
• Avoid having child objects accessible in movie clips

_this.instanceName.tabIndex = 1;
_this.instanceName.tabIndex = 2;

Components

When you’re building an application in Flash, you’ll need to add one line of code for each component, and set the accessibility parameters in the Accessibility panel. Accessibility for components works the same way as it works for all Flash movie clips.

mx.accessibility.componentInstanceName.enableAccessibility();

Screen readers support the folloring components: Alert, Button, CheckBox, ComboBox, DataGrid, Label, ListBox, RadioButton, TextArea, TextInput, Window

Accessibility Aids using the Flash 6+ player:

• JAWS
• Window-Eyes

I’ve been using macromedia’s livedocs site for the past couple of months as a major resource to research actionscript code. So yesterday when it came time to changing the font size on my Accordion component I referenced my trusty Macromedia livedoc page “Customizing the Accordion component”. Macromedia documents that to change the font size of the accordion you only need to use the following code:

myComponentInstance.setStyle(”fontSize”, 9);

So for an hour I wondered why the hell my font size was still the default setting. It had worked for my Tree component and my Button component I had used just weeks before. Was I going mental? No.

Solution:

So I decided to test my movie, go to Menu, Debug, and List Variables to see what was going on.

That’s where I found the Variable AccordionHeader and along beside it were it’s global styles listed.

Went back to my actions and tried:

_global.styles.AccordionHeader.setStyle(”fontSize”, 9);
I tested the movie and it worked!

If you have trouble setting other styles with your Accordion component try using the above code for other styles such as fontWeight, color, etc.

For the past couple of days I’ve been working on developing a creative way to show Progress summaries for all the chapters in the courseware I have been developing. Instead of having a long list of Chapter and Topic titles listed and their respective progress status displayed, I decided to use the Accordion component to organize and display my individual Progress summaries. In the words of Macromedia the Accordion component is a navigator that contains a sequence of children that it displays one at a time.

However I needed the children for my Accordion to be dynamically created based on information from a XML file.

Solution:

Open a new .fla document and save it as accordion.fla. From the Components panel drag the Accordion component on to your timeline and assign it the instance name myAccordion.

Now create your XML file in Dreamweaver. For this sample, use the following code and save your file as accordion.xml in the same directory as your newly created fla file.

<node>
<node label=”Label One” />
<node label=”Label Two” />
<node label=”Label Three” />
<node label=”Label Four” />
<node label=”Label Five” />
<node label=”Label Six” />
</node>

Now back to Flash. Create a new layer and call it Actions. Select the first key frame in this layer and insert the following actionscript.

myXML = new XML();
myXML.ignoreWhite = true;
myXML.load(”accordion.xml”);

We have just created a new XML object and loaded the XML-formatted data (accordion.xml) from an external source. myXML.ignoreWhite is set to true so that all white space in the XML document is ignored when the data is parsed.

Now insert the following actionscript directly below.

myXML.onLoad = function() {
var i:Number = myXML.firstChild.childNodes.length;
for (var n=1; n

If you don’t know what the above actionscript is all about then continue reading.

What this does is create a child for each node in the XML document on our Accordion component that we assigned the instance myAccordion to.

First we need to determine the number of childNodes in the firstChild of the XML file and assign that number a variable called i. In this example, ‘i’ should return a value of 6.

var i:Number = myXML.firstChild.childNodes.length;

Next we will create a loop.

for (var n=1; n

Notice that the number of iterations that the loop will perform (variable i), is the number of childNodes in the firstChild of the XML file.

We will now have to perform the following actions inside the loop.

var accordionLabel:String = myXML.firstChild.childNodes[n-1].attributes.label;
myAccordion.createChild(”View”, n, {label:accordionLabel});

First we determine the value of the node label in the XML file and assign it a variable called accordionLabel. We’ve used the variable “n” to also change the childNode number and create a different childInstanceName each time the loop is performed. Keep in mind that to reference the first childNode always use zero. That’s why we have “n-1”

After we create the variable “accordionLabel” we can now create the child with an instance name based on the variable “n”, and a label based on the variable “accordionLabel”.

Save and test movie.

Click here to download example files.

Today I had to create a quiz for my elearning project at work and given the deadline I was under I decided to try out Flash’s Quiz templates.

I noticed that if my “Answer” text was too long the Checkbox label wouldn’t automatically wrap it.

Solution:

In the same key frame and timeline that your Checkbox resides, add the following actionscript.

this.myCheckbox.labelPath.wordWrap = true;
this.myCheckbox.labelPath.multiline = true;

Remember to change the height of your Checkbox component to accommodate the additional lines of text. If you don’t, you will only see one line of text when you test or publish your movie.

labelPath actually has quite a few properties associated with it (ie. html, _width, _height, etc.). When you test your movie and select “Debug/List Variables” search for the string _level0.myCheckbox.labelPath. If you view the output before adding the above actionscript you will notice that the default setting for wordWrap and multiline is set to false.