Before I forget...

Blog has moved...

2011-10-10T19:54:00.000-07:00

This blog has moved. It has migrated to: http://craiggrummitt.wordpress.com/

video white

2011-02-09T21:02:00.000-08:00

A recent task I had to achieve was to play a video for several seconds and extract a frame as a JPG several seconds in. I did not know the dimensions of the video ahead of time, so hoped to extract that information out of the video metadata, and create the video object at this point. Sounds simple enough!

However, this only seemed to work about 75% of the time. Occasionally I was seeing just white in certain videos, like they weren't attached correctly to the Video object(despite receiving the metadata correctly). My theory was that perhaps the metadata was received after the FLV began playing, and that perhaps there can be problems creating a Video object and attaching a NetStream to it, after it has begun playing.

So I tried creating the Video object and then resizing after receiving the FLV metadata, but the resize seemed to have no effect when extracting the Bitmap Data. But finally found a solution - the Bitmap Data extracted correctly, if I placed the Video object inside a MovieClip and extracted the Bitmap Data of the MovieClip instead of the resized Video object.

SharedObject not updating between tabs

2010-11-27T01:48:00.000-08:00

Just created an app which required persistent data, so used a local SharedObject. However discovered that if one person had the app open in two different places(eg. 2 tabs) the persistent data in one tab wasn't updating in the other tab. To remedy this I tried reloading the SharedObject(SharedObject.getLocal) every time I extracted a variable, and yet this SharedObject variable still wasn't updating.

Discovered that, strangely, the only way to update the SharedObject, is to first set it to null. Set it to null and then reload it forces an update.

Frustrating Flex problems solved #7 - Removing DragDrop animation

2010-10-18T03:13:00.000-07:00

In Flex was building a simple drag and drop from a library list to another simple list. I also wanted to build the functionality of dragging the item out of the simple list to automatically remove the item from the list, and return the item to the library.

I managed to handle this with one problem remaining. As the dragged item thought it wasn't going to be accepted, it automatically played an animation of it returning to the simple list before my code displayed it back in the library. The animation was completely misleading but I couldn't find a way to turn it off!

My solution in the end was to create a custom ListItemDragProxy component. I included this in the list with:
dragIndicatorClass="display.CustomListItemDragProxy"

and in the custom class, I merely set visible=0 onMouseUp. Simple solution that works perfectly.

Frustrating Flex problems solved #6 - Keydown

2010-09-09T14:24:00.001-07:00

Spent some time screaming "Why can't my component receive keyboard events? "

Crazy, I'm not sure why i never knew this, but for a component to receive keyboard events, it needs to implement IFocusMangerComponent. And then, however you're trying to receive keyboard events, by overriding keyDownHandler, or listening for a keydown event, it should now receive these events...

easy when you know how!

implements="mx.managers.IFocusManagerComponent"

Frustrating Flex problems solved #5 - ButtonBarButton bugs

2010-09-03T03:18:00.000-07:00

So i had a series of custom Buttons all set up perfectly in a ButtonBar, when I realised that the design dictated that one of the buttons was a different size than was happening with the automatic sizing system...

So after discovering that the ButtonBar does not allow facility for resizing the width of a button, I had the choice. If i was going to extract the buttons from the ButtonBar, it probably would make sense to have them as a different type - Button for example. But reskinning my buttons as a different type could be time-consuming so I thought I'd see how I go just using ButtonBarButtons that aren't in a ButtonBar!

All turned out fine, except that my labels weren't appearing. A little delving into the code and I discovered the following code inside spark.components.supportClasses.ButtonBase:

// Push down to the part only if the label was explicitly set
if (_content !== undefined)
labelDisplay.text = label;

For my two cents, there's something strange going on there... So to set the label, I need to put the text inside the label property, and i need to ensure that content is not undefined. Set content to something arbitrary and the label appears! weird...

<s:ButtonBarButton label="Title" content="nada"/>

XML read error in AIR

2010-04-08T12:58:00.000-07:00

Back to blogging, working on a couple of projects:

I was importing an XML file using the standard technique of using a URLLoader, and in the result handler, setting the XML file with:
var result:XML = new XML(event.target.data);

But I found I had to move this to the FileStream class in an AIR application because the user had to specify the XML file to load. So I used:
var result:XML = new XML(stream.readUTFBytes(stream.bytesAvailable));

Suddenly I was getting a 1088 error on this line:
TypeError: Error #1088: The markup in the document following the root element must be well-formed.

After checking and rechecking the XML, I found that for some reason, there was a byte at the beginning of the byteString, which was causing havoc with reading the XML. So the String being returned by the readUTFBytes method had to truncate the first character. Like so:
var fileData:String = stream.readUTFBytes(stream.bytesAvailable);
var result:XML = new XML(fileData.substr(1));

latin flash tour

2009-11-16T10:04:00.001-08:00

Went to the Latin Flash tour last week in Bogotá, and met Lee Brimelow. He went over and demonstrated some of the latest updates to Flash CS5 and the FlashPlayer 10.2.

Features that got my interest:

code snippets panel(frequently used code - similar to the old flash simple mode in old versions of Flash that people have complained about disappearing for years!)

code hinting(although I´ll probably keep using FlashDevelop)

FLA format is now an open format XML based file (with extension XFL) with all media external.

Font embedding panel - embedded fonts can be managed more easily

TLF text - a new text layout format which allows columns more easily(with editable text too!)

Multitouch event handling(if your hardware can handle it of course!)

Access to microphone data(turn your voice into darth vader apps coming up!)

Uncaught error event - Finally you don´t have to ensure you are catching every error possible to avoid the user ever getting a Flash uncaugh error message.

AIR - open a filetype with the default app

AIR - Filemanager API can now catch volume state change events(i.e. if the user plugs in a hard drive)

BUT of course! The feature that everyone talking and every question from the audience was about, was that Flash now has a feature to publish apps for the IPhone! No IPhone still doesn´t have a Flash Player, Flash packages for a native IPhone runtime. And the answer to almost every question about ´can the iphone apps do this´and ´can the iphone apps do that´was yes, it can do everything that the Flash player can do!(with the caveat that you just have to consider that performance might be worse on the Iphone)

Where in the world is Craig?

2009-11-03T15:03:00.000-08:00

There´s been not much movement in this blog for a while because I´ve been travelling South America for a few months and am currently in Bogotá, Colombia. If by chance anyone in Bogotá is reading this, give me a shout. Would be very interested in meeting local Flash developers.

In other Flash news, I´m heading to the Adobe Latin Flash Tour next Friday with Lee Brimelow speaking, will post an update here afterwards.

Embedded fonts disappearing when loaded into another SWF

2009-06-28T23:49:00.000-07:00

I once found that when an AS3 flash movie(let's call it parent) that contained a UIComponent, loaded another AS3 flash movie(let's call it child) that contained a UIComponent with embedded fonts, the component within the child lost its embedded fonts.

I also discovered that if the parent contained the font, then the component in the child was then able to find the embedded font, and all was well.

However, this isn't an ideal situation, because I could imagine that you sometimes want the child movie to be able to operate independent of the parent, manage its own font embedding, or maybe not waste loading time of fonts in the main parent movie that may not even be required if the child isn't navigated to.

I was prompted to revisit this dilemma in a forum post, and it got me wondering what was going on. I can't find documentation to confirm, but I have a theory that once the parent has a UI Component it then tries to take over handling of the list of global Fonts that the child tries to access. This list of global Fonts maintained by the parent, doesn't by default have access to Fonts embedded in SWFs it loads.

However to give the parent access to the font, the child needs to register its font with the global list with:

Font.registerFont(ComicSans); //ComicSans for example

This ensures that when the parent takes over handling of the global list of fonts, it has access to the font the child has embedded.

Component styling utility function

2009-05-20T19:44:00.000-07:00

In addition to an earlier post here:

I have put the sample code into a simple utility function that will apply a TextFormat style to any component or TextField, without needing to consider the specific syntax of the component.

You can download this here.

'as' isn't the equivalent of typing.

2009-05-13T23:37:00.000-07:00

I guess I hadn't thought too deeply about it, but I always thought that the 'as' Operator was the equivalent of typing a variable.

pseudo code example:

type(x) = as type

or to give a real world example:

var myVar:String='3';
var myInt:int=int(myVar);
//or alternatively:
var myInt2:int=myVar as int;
trace(myInt,myInt2);

But this code will trace:
3 0

I've realised that while typing a variable actually converts the variable to the requested datatype, 'as' merely informs the compiler to expect a certain variable to be of a certain datatype.

In the above example, 'myString as int' doesn't work because myString isn't an int.

However, if initially we had defined myVar like so:
var myVar:*=3;

The code would have no problem as myVar is an int.

ComboBox direction

2009-03-03T18:12:00.000-08:00

This blog has moved.

I needed to force the Flex ComboBox to open in a specific direction. (I'm using a HTML Component FCKEditor, which has to be on top, so I need to aim the ComboBox away from it, so it doesn't animate underneath it)

It seems as though the only way to do this in Flex is to edit the mx.controls.ComboBox class itself. With some help from typeoneerror, I went ahead and did just that:

i added two booleans to the class to use to force the comboBox's direction:

public var forceDirectionDown:Boolean = false;
public var forceDirectionUp:Boolean = false;

now in the displayDropdown method, inside the 'opening the dropdown' section, i just changed the if statement:

if (forceDirectionUp || (!forceDirectionDown &&
point.y + _dropdown.height > screen.height &&
point.y > _dropdown.height))

There is still a problem, however - when I set the Combo to 'forceDirectionDown' and there isn't enough room at the bottom of the screen, when the dropdown closes, it assumes to animate the dropdown down, away from the combo. To resolve this, I added to the 'closing the dropdown' section, where it sets endY. I changed the condition line to:

endY = (forceDirectionUp || (!forceDirectionDown &&
(point.y + _dropdown.height > screen.height || tweenUp))

"Color" component parameter

2009-02-28T22:28:00.000-08:00

I never really understood why when you define a component parameter, you can define its type. Wouldn't the variable type that the parameter is related to, always define the type of the parameter? Aren't parameter and variable types synonymous?

Well, it turns out that they are not necessarily.

I've never paid much attention to the fact that you can specify the 'type' of a parameter in the Inspectable tag, as it was obvious to me that this would be the same as the variable type.

But I've discovered at least one case where this is not so.

Attempting to define an Inspectable variable as type 'fl.motion.Color' seems to work okay - it invokes the Color Picker in the Component Inspector when you click on the component on the stage. However when in the Component Inspector when you change the color from the default, and run the file, you'll get:

1067: Implicit coercion of a value of type int to an unrelated type fl.motion:Color." error.

Obviously Flash expects the parameter of type 'color' to be related to a variable of type 'int'. Seems a little strange but there is a way to get around this apparent conflict between parameter and variable types of 'color':

Specify the parameter to be of type 'Color' and the variable to be of type 'int'.

package
{
import flash.display.MovieClip;
public class test extends MovieClip
{
private var _color:int;
[Inspectable (type = "Color")]
public function get color():int {
return _color;
}
public function set color(value:int):void
{
_color = value;
}
}
}

Flex - skinning the DateField icon

2009-02-10T19:20:00.000-08:00

This blog has moved.

When adjusting the Date icon skin in a DateField component, its not sufficient to just use the css that Flex auto-generates when importing the Skin Artwork. In addition to 'skin', you must also specify that upSkin, overSkin, downSkin, disabledSkin are all set to null. otherwise they will supersede 'skin'. you do this for example, like so:

DateField {
skin: Embed(skinClass="DateField_skin");
upSkin: ClassReference(null);
overSkin: ClassReference(null);
downSkin: ClassReference(null);
disabledSkin: ClassReference(null);
}

adding classes dynamically Part II

2009-01-19T15:15:00.000-08:00

A little addition to a previous post on adding symbols dynamically from the library. I was having difficulty adding classes(that weren't in the library) dynamically - they weren't being recognised.

var classRef:Class = getDefinitionByName("Square") as Class;
var shape:IShape= new classRef() as IShape;
//Flash displays: ReferenceError: Error #1065: Variable Square is not defined.

With help from Aaron Beall(on adobe forums) who was having the same problem, i've realised that obviously flash doesn't know to compile the class if it only exists in a string. So we need to ensure that flash compiles every possible class that we may refer to dynamically. We can do this simply by declaring a variable of that class type.

var squareRef:Square;

CS4 component icon library bug.

2008-12-10T15:29:00.000-08:00

I've been wondering why items in my library disappear occasionally - including the library buttons and column headers!

I've narrowed the problem down to a CS4 bug. Steps to reproduce bug:
1.Create a MovieClip
2. Select 'Component Definition'
3. Add a parameter so that the component icon will become visible.
4. Select 'Seek Bar Control Icon' or 'Buffering Control Icon' as custom component icon.
5. Select 'OK'
6. Watch the craziness ensue!

jerky raster animations

2008-11-18T21:07:00.000-08:00

It has always bothered me that animations of raster images are always jerky when they get to the point of animating less than a pixel per frame. Flash assumes that rasters should only live on the exact pixel.

This can be resolved with bitmaps that are created with ActionScript with the Bitmap.pixelSnapping value but for pure animation is a little more complicated.

I've just discovered that if you adjust the scale, rotation or skew of the image, Flash will turn pixelSnapping off. So giving a slight degree(more than 0.1%) of one of these factors is the simplest way to demand no pixelSnapping, without requiring one line of ActionScript.

Stage dimension limitation - 214x137

2008-10-14T22:29:00.000-07:00

I was trying to work out why the Flash Player Settings window was not appearing when i attached a webcam to a Video object, when i discovered that my stage was too small. Although i can't find documentation for this feature anywhere, I have found through experimentation that for the Settings Window to appear, the stage must be a minimum of 214x137.

stage.mouseLeave and wmode=transparent

2008-09-15T18:37:00.001-07:00

noted a strange incompatibility today - the stage.mouseLeave event doesn't get triggered when you hold a mouse button down, and drag off stage on a flash object which has wmode set to transparent. in fact doing so takes the focus off the flash object so that regular stage events no longer get triggered until it receives focus again(say by the user clicking on the object).

sounds obscure, but if someone's dragging a slider and somehow drags off the object, releases the mouse button and then returns to the object, the slider continues to move around with the mouse even though the mouseButton isn't down.

dynamic text fields part II

2008-08-13T18:46:00.000-07:00

just got back from a six week holiday, so was wondering if i'd lost my mind while i was away...

steps to recreate weird problem:

1. set up two dynamic text boxes on the stage - one bold and one not bold - both with letter spacing of 1.(hint at solution) give them instance names - text1 and text2
2. set their text attributes in actionscript eg.
text1.text="hello";
text2.text="there";
3. run out - notice that neither text box is bold.

for some bizarre reason, giving the text box a letter spacing value!=0 means that it loses its formatting when you set its text value.

to resolve either set letter spacing to 0, or follow my earlier post in setting text with a letter spacing value.

Frusting Flex problems solved #4 - preventing a DataGrid column from resizing

2008-06-30T22:16:00.000-07:00

What a laborious problem this was!

I had set up a DataGrid that resized with the browser, and the user could also resize the column widths. However one column contained a button, and needed to not be resizable by the user or by browser resizing. But in practice, the button was resizing smaller and smaller every time the browser was resized. After many forum postings a solution was suggested(thanks VarioPegged) that is not the most elegant but works:

To recap, three steps must be followed:

1. add a dummy datagridcolumn to the far right of the datagrid that is not resizable and has a width of 0.
2. give the column you don't want to resize a minWidth value.
3. set up an updateComplete event handler on the datagrid, which resizes the button column and then calls validateNow() on the datagrid.

you can follow the newsgroup post on this issue here.

dynamic text field part I - letter spacing

2008-06-18T22:59:00.000-07:00

This blog has moved.
Just discovered that flash resets the author-time letter spacing of a dynamic textfield when the textfield's text is set in ActionScript.

To maintain the authortime letter spacing settings of the textfield, you need to record the textfield's textformat, set the text, and then reset the textfield's textformat to what it was. For example, if your textfield's instance name is test:

var fmt:TextFormat = test.getTextFormat();
test.text="New text";
test.setTextFormat(fmt);
something to check is that if the textfield does not contain any text, the author-time TextFormat letter spacing property is not recorded. So if you don't want your textfield to contain any text, make sure the textfield contains at least one space to ensure it maintains its author-time TextFormat letter spacing property.

Frustrating Flex problems solved #3 - DataGrid scrolling error

2008-04-22T20:02:00.000-07:00

I'm currently working on a project that requires me to be using Flex 2 rather than Flex 3(I'm using an older version of Zinc, and avoiding upgrading if possible as we'll probably be moving to AIR after this project). But - issues in Flex 2 are no longer supported...

The problem i encountered was when changing the DataGridColumns and dataProvider of a DataGrid, it gave a #1010 error 'A term is undefined and has no properties.' when scrolling vertically.

After trawling the web for answers, I found a diamond here from Marc Sulinski, who suggested the hack of extending the DataGrid class and overriding updateDisplayList with the following:

override protected function updateDisplayList(w:Number, h:Number):void {
var b:Boolean = false;

if( rendererChanged ) b = true;

super.updateDisplayList(w, h);
if( b ) {
while( rowInfo.length > listItems.length ) rowInfo.pop();
}
}

ObjectCollection

2008-04-01T15:45:00.000-07:00

i'd set up a repeater to display data returned from a ColdFusion call - which would either be a Y or N. I wanted to adjust how this appears to YES or NO, and thought a straightforward way of doing this would be set up an associative array:

[Bindable]
public static var yesNoTranslator:Object={N: "No",Y: "Yes"};

and my text component would look something like:

<text="{Constants.yesNoTranslator[repeater.currentItem.rsvpStatus]}">

Flex Builder produced warnings on this, however:
"Data binding will not be able to detect changes when using square bracket operator. For Array, please use ArrayCollection.getItemAt() instead."

Though in this case, i could ignore the warning and the app would work as desired, i could see that sometimes you may want your associative array to change and the binding wouldn't detect changes. Anyway, warnings are annoying to have hanging around, and for some strange reason they seem to propogate themselves in Flex Builder...

As the warning describes, if yesNoTranslator was an array, i could use ArrayCollection.getItemAt() instead. yesNoTranslator was an object and there is no equivalent with objects(for some reason), so i thought the simplest thing to do would be to create one, which i've called ObjectCollection:

package
{
import mx.utils.ObjectProxy;

public class ObjectCollection extends ObjectProxy
{
public function ObjectCollection(item:Object=null, uid:String=null, proxyDepth:int=-1)
{
super(item, uid, proxyDepth);
}
[Bindable(event="propertyChange")]
public function getItemAt(index:String):Object {
return(this[index]);
}
}
}

and modify my above code to:

[Bindable]
public var yesNoTranslator:ObjectCollection=new ObjectCollection({Y:"Yes",N:"No"});

< text="{yesNoTranslator.getItemAt(repeater.currentItem.rsvpStatus)}">

An Internal Build Error has occurred...

2008-03-27T19:31:00.000-07:00

public var interactionType:String=INTERACT_DRAG=INTERACT_FORM;

This line of code just wasted 4 hours of my life.

Flex didn't notice that there was a problem, and it was only in building that a problem arose with the line 'Classes must not be nested.' and then the more obscure 'An internal build error has occured' Location: UNKNOWN.

So it was down to me looking through my thousands of lines of code to find the problem. I ended up restoring a backup of my code and comparing the two until i narrowed it down to the above line...

deployment issues

2008-03-19T21:28:00.000-07:00

just finishing up an alpha version of a Flex project and discovering a couple of deployment issues that are worth getting down for future -

i was getting a persistent 'Where is the debugger or host application running?' popup window for my swf. i discovered that this occurs for specific versions of the flash player and the most recent flash player ignores the lack of debugger. however i wasn't too keen in forcing my users to install the very latest flash player if it was otherwise unnecessary, so found that i could also add the compiler argument: (in the Flex Project Properties, Flex Compiler tab)

-debug=false

Next i was getting a #2032 error. I discovered that this meant that the framework.swf file wasn't being found. This was happening because the final html file that displayed the swf was not where flex was putting it, so it wasn't finding the framework.swf(which was set to RSL, rather than Merged with Code, to save the user download time). To resolve this, I adjusted the path to the framework url. (in the Flex Project Properties, Flex Build Path, Library Path, Flex 3..., framework.swc, RSL URL)

Styling Text In Instances Of Components Using TextFormat

2008-02-03T16:01:00.000-08:00

This blog has moved.

this is an extension of a previous entry here.

Text in components or TextFields can be formatted in several ways - applying styles manually in the case of TextFields, applying a style using a TextFormat object, StyleSheets for styling html formatted text, or the StyleManager for setting global styles or styles for all instances of a component.

This article focuses on styling instances of components or TextFields with an embedded font in a TextFormat object.

The TextFormat Object would look something like this:

//let's use red Comic Sans to make it obvious when it's working.
//first embed Comic Sans in the library
//select Linkage Properties on the font, select 'Export for ActionScript' and give it the Class name of 'ComicSans'.
var format:TextFormat=new TextFormat();
format.font=new ComicSans().fontName;
format.color=0xFF0000;

Use the following code to apply this TextFormat style to the following display object types(all of which i've assumed have the instance name 'whichObject'.)

TextField

whichObject.embedFonts=true;
whichObject.defaultTextFormat=format;

Button, TextArea, TextInput, Label, NumericStepper, RadioButton, CheckBox

whichObject.setStyle("embedFonts", true);
whichObject.setStyle("textFormat", format);

ComboBox

whichObject.textField.setStyle("embedFonts", true); //textField is the item displayed in the combo box
whichObject.textField.setStyle("textFormat", format);
whichObject.dropdown.setRendererStyle("embedFonts", true); //dropdown is the list of options
whichObject.dropdown.setRendererStyle("textFormat", format);

List

whichObject.setRendererStyle("embedFonts", true);
whichObject.setRendererStyle("textFormat", format);

DataGrid

whichObject.setRendererStyle("embedFonts", true);
whichObject.setRendererStyle("textFormat", format);
whichObject.setStyle("headerTextFormat", format); //styles the datagrid's header
STOP PRESS:

Update to this post here:

Embedding external assets

2008-01-15T02:49:00.000-08:00

Strange, strange.

If you've embedded a Flash object inside a html page, and the Flash object loads external assets(images, SWFs, audio), the flash object locates the assets relative to the location of the html file and NOT relative to the swf file.

However, if you're playing an FLV file using progressive download, the FLV is located relative to the SWF file and NOT relative to the html file.

I've actually been aware of this for a few years but thought that they'd resolve its inconsistency with one of the latest iterations of Flash. but no.

positioning the cursor in a text field

2008-01-06T15:57:00.000-08:00

positioning the cursor in flash can be a little tricky and sometimes temperamental, but we should be able to control where the cursor is with setSelection, with both beginIndex and endIndex set to the same position, for example the end of the input box:
testBox.setSelection(testBox.text.length,testBox.text.length);

We may also need to first set the focus to the text box, if the focus may be elsewhere. If our 'text input' is a TextField of type 'input text', then set focus through the stage object:

stage.focus=testBox;
testBox.setSelection(testBox.text.length,testBox.text.length);

if we're using a TextInput component, use its built in setFocus method:

testBox.setFocus();
testBox.setSelection(testBox.text.length,testBox.text.length);

printAsBitmap - object must be on stage

2007-12-20T20:28:00.000-08:00

This blog has moved.

just for future reference, I've discovered today something that appears to be undocumented - when setting a PrintJob to printAsBitmap=true OR you are printing from a mac,(using the PrintJobOptions class) it is suddenly important that the object is on the stage, or it won't print.

so if you didn't want your object on the stage, the simple solution is to surround your send with an addChild and removeChild like so:

this.addChild(page);page.visible=false; //for macs only - otherwise they display the page while the print dialogue is open.
var myOption:PrintJobOptions = new PrintJobOptions(true);
my_pj.addPage(page,null,myOption);
my_pj.send();
this.removeChild(page);

preloader absorbing application FlashVars

2007-12-16T15:08:00.000-08:00

This blog has moved.

As has happened frequently, after completing a Flash application, I find that the size of the application demands a preloader swf to load the application swf (complete with progress bar). the problem i have found with this preloader swf is that it now absorbs any FlashVars that the application swf was expecting to be passed to it from the html.

how to get the preloader to pass the FlashVars to the application? well, the preloader could extract the FlashVars and explicitly send them to the application in a function call once the application is loaded. but this would mean that the application would work differently than it would have prior to the loader. it could also mean that the preloader may have to be modified for each project, whereas a generic preloader would be much simpler.

here is a solution that means the application works exactly the same, and the preloader can remain generic - within the preloader extract all the FlashVars, and pass them along to the application as URLVariables in the URLRequest.data property.

var ldr:Loader = new Loader();
var url:String = "application.swf";
var urlReq:URLRequest = new URLRequest(url);
urlReq.data=getObjectURLVariables(this.loaderInfo.parameters)
ldr.load(urlReq);
this.addChild(ldr);

public function getObjectURLVariables(whichObject:Object):URLVariables {
var variables:URLVariables=new URLVariables();
for (var i in whichObject) {
variables[i]=whichObject[i];
}
return(variables);
}
You could quite easily set this up as a custom Loader class that automatically passes the FlashVars along to the loaded application.

adding a symbol dynamically from the library

2007-11-06T15:12:00.000-08:00

how to add a symbol from the library?
in AS2,
this.attachMovie("square", "square", 1);

and in AS3,
var square1:square=new square();

but how do you add a symbol dynamically from the library? say if you have a shape stored in a variable:

var shape:String = "square";

and you want to add the symbol in the library with this name.
in AS2, simple! you could have written:
this.attachMovie(shape, shape, 1);

however the AS3 syntax doesn't obviously allow for dynamic references. so how is it done? (credit to kglad for assisting in this discovery)

getDefinitionByName is what you need to extract the class from the library like so:

import flash.utils.getDefinitionByName;

var classRef:Class = getDefinitionByName(shape) as Class;
var square1:* = new classRef();

Frustrating Flex problems solved #2 - addChild

2007-11-06T14:47:00.000-08:00

This blog has moved.

this.addChild(new Sprite())

looks simple enough doesn't it? especially if you've been working solely in Flash AS3. But if you try this line within a Flex component, you'll receive the error: 'Type Coercion failed: cannot convert flash.display::Sprite@86cc0e1 to mx.core.IUIComponent.'
This is because Flex components implement a different addChild method. although addChild is described as accepting a DisplayObject as a parameter, this DisplayObject must implement the IUIComponent interface.
How to add a sprite then? You can either:
specify a UIComponent. eg:
this.addChild(new UIComponent())
This sort of works in this case as UIComponent implements the Sprite. However the additional implementation of UIComponent may at best be unnecessary and at worst cause problems with your code. Also, this alternative won't work in some cases, say if for some reason you wanted to add a MovieClip.

so an alternative is that you can add your child to the component's rawChildren, a property which contains a list of ALL of the container's children - not just the children that the container wants you to know about! (this.numChildren<=this.rawChildren.numChildren) see flex help for more info on this. this alternative looks like: this.rawChildren.addChild(new Sprite())

Embedding a font in a component

2007-09-25T23:42:00.000-07:00

it took me quite a while and a variety of sources to work out how to set an embedded font for use in a comboBox component in AS3, so i thought i would record the solution for others(and myself in future when i forget!).

Here are steps to follow:

Step 1. add the font you wish to embed to the library, set it to 'Export for ActionScript' and give it a Class name.(in this case 'ComicSans')
Step 2. add a comboBox component to your stage.
Step 3. add the following script:

var Comic:TextFormat=new TextFormat();
Comic.font=new ComicSans().fontName;
Comic.size=12; //let's say we want to change the font size

combo.textField.setStyle("embedFonts", true);
combo.textField.setStyle("textFormat", Comic);
combo.dropdown.setRendererStyle("embedFonts", true);
combo.dropdown.setRendererStyle("textFormat", Comic);

A couple of points to be aware of:

when setting your TextFormat font, don't use the font's linkage identifier directly, this property requires the name that the system uses when referring to the font.
rather request the name of the font through the font class.
i did this above with the line:
Comic.font=new ComicSans().fontName;

the font of the textfield within the combo needs to set, and the text within the list component(dropdown property) within the combo also needs to be set.
these are set differently.
while the textfield is set directly with setStyle, the list component is set indirectly, with setRendererStyle as there will be multiple textfields within the list component.

ENTER_FRAME problem

2007-09-25T23:09:00.000-07:00

i've got an interesting conundrum for you all.

According to Flash help, ENTER_FRAME "...does not go through a 'capture phase' and is dispatched directly to the target, whether the target is on the display list or not."

and it is true that an object with an ENTER_FRAME event does seem to work okay if it's not on the display list.

however, if you start loading external assets, it seems to forget about this ENTER_FRAME event at some random point in time! insert the code below into a frame, and replace imageFile with an actual external asset. the enterFrame function should count up from 1 to infinity, but instead at around 30(for me) it stops!

however, if you add the MovieClip to the stage, it receives the ENTER_FRAME event without fail.

const imageFile:String="put a swf here.swf";
var tally:int=0;
var loadertally:int=0;
setUpEnterFrame();
nextLoader();
function setUpEnterFrame() {
var newObject:MovieClip=new MovieClip();
newObject.addEventListener(Event.ENTER_FRAME,enterFrame);
//this.addChild(newObject); -------works when these comments are removed...
}
function nextLoader() {
var loader:Loader = new Loader();
loader.contentLoaderInfo.addEventListener(Event.COMPLETE, loaderDisplayed);
var request:URLRequest = new URLRequest(imageFile);
loader.load(request);
moveToRandomPlace(loader);
this.addChild(loader);
}
function enterFrame(event:Event):void {
tally++;
trace(">>>>enterFrame - "+tally);
}
function loaderDisplayed(event:Event):void {
loadertally++;
if (loadertally<200)>
nextLoader();
}
trace("loader complete - "+loadertally);
}
function moveToRandomPlace(whichObject:DisplayObject):void {
whichObject.x=(Math.random()*stage.stageWidth);
whichObject.y=(Math.random()*stage.stageHeight);
}

STOP PRESS!

I've resolved this issue with some credit to kglad in forums - the problem is that as newObject is a variable local to the nextLoader function, when this function is complete and is garbage collected, the EnterFrame no longer triggers... i initially encountered this problem with Tweens - it is a very easy mistake to make - something to be cautious of!

labels that are numbers

2007-09-20T00:19:00.000-07:00

today i was given a movieClip of a candle slowly burning down. it had 15 states represented by numbered frame labels, and i wanted to go to the appropriate label based on the number of days the candle had been burning. the problem is, even if you convert the variable to a string, flash treats it as a number. so:

days=14;
gotoAndStop(String(days));

even though this is a string, flash still interprets this as frame number rather than a frame label. it goes to frame 14, rather than label '14'. there may be a solution out there, but the only one i know is renaming all of the labels to include an alpha character. laborious...

AS3 to the rescue!

we now have access to available frame labels and the related frame numbers in an array. so assuming we know where which number label we're after - which is easy in my case where the labels where numbered from 1 to 15, we can easily access the label even if its name is a number:

days=14;
this.gotoAndStop(this.currentLabels[days-1].frame);

double click problems

2007-09-12T22:29:00.000-07:00

Let's say we want to set up a standard doubleClick interaction on a movie-clip(draw a square inside this clip) with instance name square:

square.doubleClickEnabled=true;
square.addEventListener(MouseEvent.DOUBLE_CLICK,double);
function double(event:MouseEvent):void {
trace("doubleclick");
}

Compile, it should work fine - "doubleclick" should trace when you double click the square.

Now place a movie-clip inside square with instance name circle(draw a circle inside this clip).

Recompile. Notice that double-click isn't recognised if you double click on the circle...

For some reason the circle movieClip is preventing the double-click event from bubbling up to square. forcing 'circle' to ignore the double-click and allow the event to continue on its merry way to 'square' is the best solution i have found:

square.circle.mouseEnabled=false;

Weird sizing problem

2007-08-17T01:56:00.000-07:00

After a lot of pulling my hair out trying to work out why my custom scrollbars weren't resizing correctly, thinking there must be a problem with my code, i've discovered that it's actually a strange problem with flash resizing movieclips containing objects with strokes that aren't hairline.

to replicate the problem, do the following:

1. draw a rectangle 350 pixels high and say 10 pixels wide with a stroke width of 1.

2. draw a rectangle beside it 30 pixels high and 10 pixels wide with a stroke width of 1. convert this second rectangle to a movieClip and give it an instance name of test. turn on 9-slice scaling.

3. draw a rectangle beside test 30 pixels high and 10 pixels wide with a hairline stroke width. convert this third rectangle to a movieClip and give it an instance name of test2. turn on 9-slice scaling for this clip also.(although it doesn't need it as it is rectangular and uses hairline stroke - do this in the interests of consistency with the other clip for this test)

4. type the following in the frame's actions:

test.height=350;
test2.height=350;

5. compile the movie, and notice that the movie clip called test, with a stroke width of 1, doesn't quite make the correct height, whilst the hairline clip works fine.

what's going on?

flash appears to get a little confused between the height of the clip including stroke,
and the height of the fill.

to illustrate this, click on the movieClip and notice that the properties show it to be 30 pixels high.

trace(test.height);

and notice that flash thinks it is 31 pixels high...

so when flash calculates its new height, it is 1/31st off.

what we need to do is rectify these incorrect calculations. this is done by:
clip.height=preferredHeight*(clip.height/currentHeight);
or, in this case:

test.height=350*(test.height/30);

if you trace test.height again, you'll see that flash now thinks it is 361.7 pixels high, but it is
actually exactly the same height as the 350 pixel high rectangle we drew in step 1.

by the way, all of this can be avoided by drawing the rectangle originally with actionScript, but i believe these workings are still necessary for cases where simple shapes are not sufficient and we need to accurately resize a designer's work.

Frustrating Flex problems solved #1 - dropEnabled

2007-07-09T16:17:00.000-07:00

I set up a drag-drop interaction between two components - from a custom 'dragMe' component i set up(extending Canvas) to a Tree component, but couldn't work out why my Tree wouldn't allow dragMe to drag over it. Until I started experimenting with removing properties from the Tree component. Eventually(this sort of trial and error can be soo slow going in flex) I found the source of the problem: i had dropEnabled set to true. huh? how unintuitive is that?!! as soon as i set dropEnabled to false(or left it out altogether because that's the default) the behaviour works fine.

After reading up on this property it does make sense - dropEnabled refers purely to the default drop behaviour. really defaultDropEnabled would be a more intuitively named property, but anyway i put this information out there for others not to waste the time i did yesterday!

line width

2007-07-03T22:12:00.000-07:00

i was creating a dashed line function which basically drew a short line, then moved on a few pixels. i was trying to display this line with one pixel width. what i discovered was that if the dash was three pixels or less in length the width would increase to two pixels.?? have a look at this flex code(which assumes a Canvas component called 'canvas'), which displays several lines with the same linestyle, but with the length of each one increasing by one pixel:

import flash.geom.*
import flash.display.*
private function drawLine():void {
canvas.graphics.lineStyle(1,0x000000);
for (var i:int;i<10;i++) {
canvas.graphics.moveTo(10,(i*10));
canvas.graphics.lineTo(10+i,(i*10));
}
}

what's that about? well i had a look at whether other lineStyle options had any effect and discovered pixelhinting. pixelhinting is a boolean that specifies whether to hint strokes to full pixels. you'd think that a straight horizontal line wouldn't require much in the way of hinting, but the player does seem to display it incorrectly. perhaps short lines confuses it?

anyway, to resolve this issue, add pixelhinting to the lineStyle:

canvas.graphics.lineStyle(1,0x000000,1.0,true);