Flex/Flash Developer - by Ankur Arora

There was a requirement in of the projects to have a Radar Chart that is customizable through XML. You can have a look at below working sample.



Finally, as this was required so I have to spent some time and create my own. You can look at the working sample below and if this is something you are looking for I can give away the SWC file to you for a nominal cost.

There was a requirement in of the projects to have a 3D Pie Chart. I thought it would be easy to find a free one on the web but to my surprise unfortunately I could not find any of those.

Finally, as this was required so I have to spent some time and create my own. You can look at the working sample below and if this is something you are looking for I can give away the SWC file to you for a nominal cost.



Enjoy playing with it.

The simplest way to convert a RGB color value to Hexadecimal color values.

private function toHexValue(r:int, g:int, b:int):uint 
{
 var hex:uint = r << 16 ^ g << 8 ^ b;
 return hex;
}

You have your own object instance and you want to copy or clone an exact copy of it?

Simple, you can use Flex built-in ObjectUtil copy function as follows:

import mx.utils.ObjectUtil;
var obj:Object = new Object();
obj.content = "hello";
var objCopy:Object = ObjectUtil.copy(obj);

In case you want it in Actionscript 3.0 instead of Flex in-built capability:-

private function clone(source:Object):* 
{
var copier:ByteArray = new ByteArray();
copier.writeObject(source);
copier.position = 0;
return(copier.readObject());
}

Flex docs talks about using a Datefield as an Editor with DataGrid but what if date is in a string format. Most likely that is practical scenario in most of the cases because when you put some XML or server side data in DataGrid it generally comes as string. Let's have a look at below small code which will allow you to perform this.

Main Application

Now, let's create the MXML file which will be used as itemEditor in DataGridColumn. We will place this MXML file in the same folder as application file.

DateEditor.mxml

A small code to make an Advanced Datagrid editable on double click.

Variables

private var doubleClicked:Boolean = false;

Events

private function itemClickHandler(event:ListEvent):void {
    doubleClicked = false;
}
private function itemDoubleClickHandler(event:ListEvent):void {
    doubleClicked = true;
}

// Allow switching to edit mode only if a double click has been received
private function itemEditBeginHandler(event:AdvancedDataGridEvent):void {
    if (!doubleClicked) 
        event.preventDefault();
}

MXML Code

// adjust the font size on all defined CSS styles by increasing or decreasing pixel size
       public function adjustFontSize(increment:Number):void
        {
            var selectors:Array = StyleManager.selectors;
 
            for each (var selector:String in selectors)
            {
            var css:CSSStyleDeclaration = CSSStyleDeclaration(StyleManager.getStyleDeclaration(selector));
 
            // assume here that all font sizes in the application
            // are explicitly set by pixel size in the CSS
            if (css.getStyle("fontSize") != null)
            {
                var fontSize:Number = Number(css.getStyle("fontSize"));
                css.setStyle("fontSize", fontSize+increment);
            }
            }
        }

Dear all,

I'm writing this post after a long time. Sorry but I'm running very busy these days and feels hard to post new stuff for you. Anyways, finally I'm coming up with a new class which will help you to detect collision between 2 objects in Actionscript 3.0.

I know people who keep asking for hitTest functionality in AS 3.0 where they can provide shape flag like we use to do in AS 2.0 but AS 3.0 does not supports that. To accomplish this I have created a class which will help you in detecting whether two objects colliding or not. This class is having a function name called getCollisionRect(); which takes instances of both objects along with their parent container. Have a look and let me know if you face any problem in implementing it.

package classes.utils
{
 import flash.display.BitmapData;
 import flash.display.BitmapDataChannel;
 import flash.display.BlendMode;
 import flash.display.DisplayObject;
 import flash.display.DisplayObjectContainer;
 import flash.geom.Matrix;
 import flash.geom.Point;
 import flash.geom.Rectangle;
 public class PixeCollisionDetection
 {
  /** Get the collision rectangle between two display objects. **/
  
  //Note: Just use the isColliding function with paramenter is static function.
  public static function getCollisionRect(target1:DisplayObject, target2:DisplayObject, commonParent:DisplayObjectContainer, pixelPrecise:Boolean = false, tolerance:Number = 0):Rectangle
  {
   // get bounding boxes in common parent's coordinate space
   var rect1:Rectangle = target1.getBounds(commonParent);
   var rect2:Rectangle = target2.getBounds(commonParent);
   // find the intersection of the two bounding boxes
   var intersectionRect:Rectangle = rect1.intersection(rect2);
   if (intersectionRect.size.length> 0)
   {
    if (pixelPrecise)
    {
     // size of rect needs to integer size for bitmap data
     intersectionRect.width = Math.ceil(intersectionRect.width);
     intersectionRect.height = Math.ceil(intersectionRect.height);
     // get the alpha maps for the display objects
     var alpha1:BitmapData = getAlphaMap(target1, intersectionRect, BitmapDataChannel.RED, commonParent);
     var alpha2:BitmapData = getAlphaMap(target2, intersectionRect, BitmapDataChannel.GREEN, commonParent);
     // combine the alpha maps
     alpha1.draw(alpha2, null, null, BlendMode.LIGHTEN);
     // calculate the search color
     var searchColor:uint;
     if (tolerance <= 0)
     {
      searchColor = 0x010100;
     }
     else
     {
      if (tolerance> 1) tolerance = 1;
      var byte:int = Math.round(tolerance * 255);
      searchColor = (byte <<16) | (byte <<8) | 0;
     }
     // find color
     var collisionRect:Rectangle = alpha1.getColorBoundsRect(searchColor, searchColor);
     collisionRect.x += intersectionRect.x;
     collisionRect.y += intersectionRect.y;
     return collisionRect;
    }
    else
    {
     return intersectionRect;
    }
   }
   else
   {
    // no intersection
    return null;
   }
  }
  /** Gets the alpha map of the display object and places it in the specified channel. **/
  private static function getAlphaMap(target:DisplayObject, rect:Rectangle, channel:uint, commonParent:DisplayObjectContainer):BitmapData
  {
   // calculate the transform for the display object relative to the common parent
   var parentXformInvert:Matrix = commonParent.transform.concatenatedMatrix.clone();
   parentXformInvert.invert();
   var targetXform:Matrix = target.transform.concatenatedMatrix.clone();
   targetXform.concat(parentXformInvert);
   // translate the target into the rect's space
   targetXform.translate(-rect.x, -rect.y);
   // draw the target and extract its alpha channel into a color channel
   var bitmapData:BitmapData = new BitmapData(rect.width, rect.height, true, 0);
   bitmapData.draw(target, targetXform);
   var alphaChannel:BitmapData = new BitmapData(rect.width, rect.height, false, 0);
   alphaChannel.copyChannel(bitmapData, bitmapData.rect, new Point(0, 0), BitmapDataChannel.ALPHA, channel);
   return alphaChannel;
  }
  /** Get the center of the collision's bounding box. **/
  public static function getCollisionPoint(target1:DisplayObject, target2:DisplayObject, commonParent:DisplayObjectContainer, pixelPrecise:Boolean = false, tolerance:Number = 0):Point
  {
   var collisionRect:Rectangle = getCollisionRect(target1, target2, commonParent, pixelPrecise, tolerance);
   if (collisionRect != null && collisionRect.size.length> 0)
   {
    var x:Number = (collisionRect.left + collisionRect.right) / 2;
    var y:Number = (collisionRect.top + collisionRect.bottom) / 2;
    return new Point(x, y);
   }
   return null;
  }
  /** Are the two display objects colliding (overlapping)? **/
  public static function isColliding(target1:DisplayObject, target2:DisplayObject, commonParent:DisplayObjectContainer, pixelPrecise:Boolean = false, tolerance:Number = 0):Boolean
  {
   var collisionRect:Rectangle = getCollisionRect(target1, target2, commonParent, pixelPrecise, tolerance);
   if (collisionRect != null && collisionRect.size.length> 0) return true;
   else return false;
  }
 }


}

You can also download the source actionscript class file from here.

Send me a comment if you face any difficulty while implementing it.

Thanks
Ankur

Guys,

I just cleared ACE which stands for Adobe Certified Expert. I did it in Adobe Flex with AIR. I'm glad that all my hard work paid off.

I know its been long since I have posted any tutorials. I have so many in my list but believe me I was so busy. I will try to post something new soon.

In case you need any help, suggestions just mail me up. Though, I'm busy but I try to respond all of those. I'm thankful to all of you and ready to help.