XIFF + Flash CS3 + AS3 Experiment (tiny preview)

Hi all,

i am writing a chat client with XIFF (XIFF is an ActionScript library to communicate with XMPP servers out there) in AS3. As I am doing so, I’ve run into a few problems, namely the unavailability of the ArrayCollection class in Flash CS3 (it’s only available in Flex 2+). I ended up writing a simplified version of a collection class based on the Array. ArrayCollection offers both Event Dispatching and the Collection’s typical functions.
Continue reading

Actionscript 3 TextField renders excessive line breaks

Hi all,

I was working on a project for musicnation.com, their EPK. I had to render text in a textfield that was coming from an XML feed, text that is entered by users. It can be filled with different types of line feeds, notable the:

\n = linux
\r = mac (prior to macos being based on freebsd I guess)
\r\n = the damned pc linefeed.

The TextField object in Flash seems to render both \r and \n as linefeeds. Therefore I was getting way too many linefeeds in my rendered text.
Continue reading

Passing parameters to a Flash 9 ActionScript 3 SWF file

Hi everyone, I found this blog entry which shed light on how to pass variables to your SWF this way :

[code]
light.swf?artist=yolanda&page=12
[/code]

Here is some usefull function you can use. Put it in your Document Class. For those who don’t know what that is, just put it on the stage on Frame 1 then.

1
2
3
4
5
6
7
8
9
10
protected function getSwfParam(name:String, defaultValue:String):String
{
	var paramObj:Object = LoaderInfo(stage.loaderInfo).parameters;
 
	if(paramObj[name] != null && paramObj[name] != "")
		return paramObj[name];
 
	else
		return defaultValue;
}

So it’s quite simple to use it:

1
var artist:String = getSwfParam("artist", "defaultArtist");

VoilĂ !

Inspiration

I used these articles as inspiration. Make sure you READ the FIRST COMMENT of the post since it outlines an important omission from the author.

link to Theo’s Blog entry

Cheers!

bug in flash player 9 only on Mac OS X and Linux

Hi..

i’ve run into a bug on Mac OS X and Linux. Don’t ask me WHAT is the source, I don’t understand it. Basically I have a scrollable list (all my own components) of tracks & videos in a box, and it works fine on Windows XP but doesn’t work at all under Linux or Mac OS X. The box contains a status bar which appears on all platforms but the scrollbar & content don’t appear on Mac OS X and Linux.

Anybody has clues? I updated my version of flash player to 9.0.48.0 and still the bug doesn’t happen on Windows. I had version 9.0.32.0 on Windows before, while my other clients have version 9.0.45.0 on Mac OS X and 9.0.32.0 on Linux (I think).

How am I supposed to diagnose the cause of such a problem?

HELP!

Making a DisplayObject, Sprite or Movieclip (or any other subclasses of DisplayObject) be always on top in ActionScript 3

Hi. I’m making a little rating visual control for a client and had to ensure this control would always stay on top of everything else. This basically means that whenever another control is added to the display list of it’s parent, i need to ensure my control stays last in the list.

You need to listen to the flash.events.Event.ADDED event on the container like so :

1
2
3
4
5
6
7
// don't forget to do this at the top of your file
import flash.events.Event;
 
// object code goes here.. and inside of some initialization function you add this line
// (be sure the object has been added to some parent before calling this line!)
 
parent.addEventListener(Event.ADDED, alwaysOnTop);

Now, to code the alwaysOnTop function, what we need to do is find out where our object is in the display list; if it’s not last we need to swap it to the last position like so

1
2
3
4
5
6
 
protected function alwaysOnTop(evt:Event):void
{
   if(parent.numChildren-1 > parent.getChildIndex(this))
      parent.swapChildrenAt(parent.numChildren-1, parent.getChildIndex(this));
}

there is one case, if another object swaps itself to your position, where the display list is changed. The event Event.ADDED is triggered by the functions “addChild” and “addChildAt”. There is no event (in my humble knowledge) which tells you when the display list order has changed. Therefore it would be a good idea to have a centralized timer which would ensure all controls which must stay on top do actually stay on top by calling their “alwaysOnTop” functions at a regular interval.

Comments and questions are welcome!

:)

Martin

Tutorial – Creating the reflection of an image dynamically in AS3

You’ve seen it everywhere, even in the new iTunes. Basically the idea is to create a reflection of an image, as if the surface it is standing on was mirror-like.

sample reflection

I’ve managed to hack away some code using the BitmapData, Bitmap and Sprite classes. This is probably not an efficient way to do things, especially the changeAlpha function which adapts the negative color values (why do I get that?) for each pixel.

_art is a Sprite containing the image we want to create the reflection of; in my example _art has been scaled by fixing it’s width and height dynamically, therefore we need to take that into consideration when drawing it’s content into a BitmapData object

_artReflection is a Sprite which will contain the reflection

Here we go:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
 
import flash.display.Bitmap;
import flash.display.BitmapData;
import flash.geom.Matrix;
 
protected function createReflection()
{
   // you'll need to rewrite this, my _art variable is a covert art from a CD loaded dynamically, and I scale it previously
   var xscale:Number = _art.scaleX;
   var yscale:Number = _art.scaleY;
 
   // create my scaling matrix to draw the bitmap into a bitmap data, since even it it's containing Sprite is scaled, it will draw the thing in full proportions otherwise
   var scaleMatrix:flash.geom.Matrix;
   scaleMatrix = new Matrix();
   scaleMatrix.scale(xscale, yscale);         
 
   // create a bitmap data for the source bitmap, of the full dimensions of the image we are using to create the reflection from
   var sourceBmp:BitmapData;
   sourceBmp = new BitmapData(_art.width, _art.height, true, 0x00ffffff);
 
   // draw the source (covert art in my case, into the bitmap data.
   sourceBmp.draw(_art, scaleMatrix);
 
   // the height of my reflection is 1/3 of the original image
   var reflectionHeight:Number = Math.round(_art.height/3);
 
   // variable to track the row we are writing in the target bitmapdata
   var targetRow:Number;
 
   // this is our starting alpha value (0 to 255). The reflection starts at 1/4th of alpha, going gradually to 0
   var curAlpha:Number = 64;
 
   // this is the step by which the alpha will lessen on each row, calculated based on the height of our reflection
   var steps:Number = 64 / reflectionHeight;
 
   // create our target bitmap data, same width as the original image, and using the height we calculated earlier
   var targetBmp:BitmapData = new BitmapData(_art.width, reflectionHeight, true, 0x00FFFFFF);
 
   // loop through the rows of pixels, starting at the bottom of the image to be reflected
   for(var row:Number = _art.height-1; row > _art.height - reflectionHeight; row--)
   {
      // our target row is opposite the sourcerow, since we are reflecting it
      targetRow = _art.height - row - 1;
 
      // for each row, decrement the alpha
      curAlpha -= steps;
 
      // we go through columns left to right in both source and target image
      for(var col:Number = 0; col < _art.width; col++)
      {
         // we set the pixel in the target image, using col, targetrow, and changing the alpha value of the pixel we get from the source image on the way
         targetBmp.setPixel32(col, targetRow, changeAlpha(sourceBmp.getPixel32(col, row), Math.round(curAlpha)));
      }
   }
 
   // create a bitmap from the bitmapdata
   var image:Bitmap = new Bitmap(targetBmp);
 
   // add it to the sprite we use to contain the reflection
   _artReflection.addChild(image);
 
   // and eventually position _art and _artReflection so that _art is right OVER the _artReflection
}
 
// this function alters the alpha value of a 0xAARRGGBB color value and returns the new color value
protected function changeAlpha(color:uint, alpha:int):uint
{
   // decompose the 0xAARRGGBB value, each component is a byte, therefore from 0 to 255 in value.
   var blueOffset:Number = color % 256;
   var greenOffset:Number = ( color >> 8 ) % 256;
   var redOffset:Number = ( color >> 16 ) % 256;
   var alphaOffset:Number = ( color >> 24) % 256;
 
   // i'm not sure why sometimes the color values are negative, but I remember 7 years ago in C++ under windows I did this hack and it worked.
   if(greenOffset < 0)
      greenOffset += 256;
   if(redOffset < 0)
      redOffset += 256;
   if(blueOffset < 0)
      blueOffset += 256;
 
   //trace("blue:"+blueOffset+", green:"+greenOffset+", red:"+redOffset+", alpha:"+alpha);
 
   // recompose the 0xAARRGGBB value
   return (alpha<<24|redOffset<<16|greenOffset<<8|blueOffset);
}

VoilĂ . Post your comments or questions! Or even better, improve the efficiency of my code!

Things I would like to see done in AS3

Since AS3 offers raw sockets and enables byte-arrays, there is no reason why we couldn’t build the following:

  • MySQL Connector
  • Oracle Connector
  • SVN Connector

For example, if someone wanted to make a UML modeling program online, it would be possible to plug it directly on an SVN serveur (or CVS .. or anything else you fancy), and do reverse engineering on the classes, showing you a complete UML view of your code! Then you could do live re-factoring visually, like move functions around, create new objects, and have the program update all your code for you. Now that’s what I call something usefull!

Anybody’s up for it?

AMFPHP & PHP 5.2.2 Bug

Hi. I am hosted on dreamhost and they recently upgraded their version of PHP5 to 5.2.2. There is a bug in PHP 5.2.2 where the $_GLOBALS['HTTP_RAW_POST_DATA'] never gets set, a global variable which is used by AMFPHP to read the request from the Flash application.

To fix it, edit the file gateway.php find this line of code :

[php]
$gateway = new Gateway();
[/php]
and add these lines before it :

[php]
if (phpversion()==”5.2.2″)
$GLOBALS['HTTP_RAW_POST_DATA'] = file_get_contents(“php://input”);
[/php]

Cheers!

Flash ActionScript brightenColor Function

I’ve been working hard on several projects lately; and have decided to post on here some of the useful functions i’ve developped. Starting with the simplest ones and eventually going into sharing full-blown components.

Today I wish to share a little function that either brightens or darkens a color value, such as 0×445566. Here is the code:

[code lang="actionscript"]

public static function brightenColor(color:Number, perc:Number):Number {
var factor:Number;

// get the blue offset
var blueOffset:Number = color % 256;

// get the green offset
var greenOffset:Number = ( color >> 8 ) % 256;

// get the red offset
var redOffset:Number = ( color >> 16 ) % 256;

// if percentage is greater than 50, we are making the color brighter
if(perc > 50 && perc <= 100) {

// calculate the factor by which we will make the color brighter
factor = ( ( perc-50 ) / 50 );

// apply this factor to all offsets
redOffset += ( 255 - redOffset ) * factor;
blueOffset += ( 255 - blueOffset ) * factor;
greenOffset += ( 255 - greenOffset ) * factor;

}
// else if the percentage is less than 50, we are making the color darker
else if( perc < 50 & perc >= 0 )
{
// calculate the factor by which we will make the color darker
factor = ( ( 50 - perc ) / 50 );

// apply the factor to all offsets
redOffset -= redOffset * factor;
blueOffset -= blueOffset * factor;
greenOffset -= greenOffset * factor;
}

// put all offsets back together to form the color value of 0xRRGGBB
return (redOffset<<16|greenOffset<<8|blueOffset);
}

[/code]

Basically, this function decomposes the color value into it’s individual components, that is the red, green and blue components. It then applies a factor to this component. If the ‘perc’ parameter is above 50, it will brighten the color, if the parameter is below 50, it will darken it. The minimum value should be 0, and maximum should be 100.

Enjoy!