Problem in adding the sprite class directly to canvas component in Flex

Hi,

we cannot directly added the sprite component to the Canvas component or any other Flex components; the main reason was all Flex omponent derived from the UIComponent. So it can support only to add the UIComponent to the flex component that are derived from the UIComponent. Its better way we can add the sprite component to the UIComponent and then we can add this UIComponent to the Canvas or other Flex components.

Sprite Vs Shape

HI,

Sprite and Shape are the basic graphics component for draw the graphics. The important points to be noted as the shape class is cannot dispatch the common event like mouse or keyboard event. So if you need to perform any mouse related event to be perform then you can choose sprite instead of shape class; because the sprite class having the basic event like mouse and keyboard relate events.

Create the custom HTTP Service class and return XML as output in AS3

Hi,
I am creating the custom HTTP service class for accessing URL and get the response from the server and return the result as xml format. Here i attached the code for that.


package service
{
import flash.events.Event;
import flash.net.URLLoader;
import flash.net.URLRequest;
import service.MessageService;
import flash.net.URLVariables;
import flash.net.navigateToURL;
import flash.events.IOErrorEvent;
import flash.net.URLRequestMethod;
import flash.events.SecurityErrorEvent;
public class URLService
{
private var _url:String;
private var _callbackObject:Object;
private var _callbackFunction:Function;
private var _urlError:MessageService = new MessageService("URL Error","Warning");
private var _ioError:MessageService = new MessageService("IO Error","Warning");
private var _xmlError:MessageService = new MessageService("XML Error","Warning");
private var _securityError:MessageService = new MessageService("Security Error","Warning");
public function set url(val:String):void
{
if(_url != val)
_url = val;
}
public function set callbackObject(val:Object):void
{
if(_callbackObject != val)
_callbackObject = val;
}
public function set callbackFunction(val:Function):void
{
if(_callbackFunction != val)
_callbackFunction = val;
}
public function URLService()
{
}
public function loadXML(urlVar:URLVariables = null,callbackObject:Object = null,callbackFunction:Function = null):void
{
if(_url && _url != "")
{
var urlLoader:URLLoader = new URLLoader();
var urlRequest:URLRequest = new URLRequest(_url);
if(urlVar)
{
urlRequest.data = urlVar;
urlRequest.method = URLRequestMethod.POST;
}
urlLoader.load(urlRequest);
urlLoader.addEventListener(Event.COMPLETE,onComplete);
urlLoader.addEventListener(IOErrorEvent.IO_ERROR,onIOError);
urlLoader.addEventListener(SecurityErrorEvent.SECURITY_ERROR,onSecurityError);
_callbackObject = callbackObject;
_callbackFunction = callbackFunction;
}
else
{
_urlError.show();
}
}
public function selfNavigation(urlVar:URLVariables = null):void
{
if(_url && _url != "")
{
var urlRequest:URLRequest = new URLRequest(_url);
if(urlVar)
{
urlRequest.data = urlVar;
urlRequest.method = URLRequestMethod.POST;
}
navigateToURL(urlRequest,"_self");
}
else
{
_urlError.show();
}
}
private function onComplete(evt:Event):void
{
var _xml:XML = XML(evt.target.data);
if(_callbackObject && _callbackFunction != null)
{
_callbackFunction.call(_callbackObject,_xml);
}
else
{
_xmlError.show();
}
}
private function onIOError(evt:IOErrorEvent):void
{
_ioError.show();
}
private function onSecurityError(evt:SecurityErrorEvent):void
{
_securityError.show();
}
}
}

This is very nice class. So use this class and enjoy.

Dispatch custom event with values in AS3

Hi,
We can dispatch custom event with some values. The following steps we can send the values when dispatch the event. The Custom Dispatch Event class is created as follows


package service
{
import flash.events.Event;
import flash.net.FileReference;
public class UploadEvent extends Event
{
private var _data:Array;
public function get data():Array
{
return _data;
}
public function set data(val:Array):void
{
if(_data != val)
_data = val;
}

public static const UPLOAD_FILE_COMPLETD:String = "UploadFileSelected";
public function UploadEvent(type:String,arr:Array=null):void
{
this.data = arr;
super(type);
}
}
}

Event dispatches by following way
dispatchEvent(new UploadEvent(UploadEvent.UPLOAD_FILE_COMPLETD,data[Array]));

Handler function for the dispatched event as follows
[Event Dispatcher Instance].addEventListener(UploadEvent.UPLOAD_FILE_COMPLETD,onUpoadComplete);

private function onUpoadComplete(evt:UploadEvent):void
{
trace(evt.data);
//handle code here;
}

Dispatch a custom event without any values in AS3

Hi,

We need to dispatch the custom event for perform certain custom function after certain activity may be happen. The custom dispatch event is very nice approach and it used the DOM for event handling.

The some points to be remember for dispatch the event

1. The customevent class must be subclass of Event class i.e it extends from Event class

2. We can send some data when custom event dispatches

3. The event dispatcher class must support the feature of dispatch event. the UIComponent class supports its features otherwise we need to create the subclass of EventDispatcher class

4. To capture the dispatched event and handle those event by handler function.

Create the custom Dispatch event class without any values as follows

package service
{
import flash.events.Event;
public class UploadEvent extends Event
{
public static const UPLOAD_FILE_COMPLETD:String = "UploadFileSelected";
public function UploadEvent(type:String):void
{
super(type);
}
}
}

Dispatch the custom Event by

dispatchEvent(new UploadEvent(UploadEvent.UPLOAD_FILE_COMPLETD));

create the handler file for dispacthed custom event as follows

instance name[Event Dispatcher].addEventListener(UploadEvent.UPLOAD_FILE_COMPLETD,onUploadCompleted);

private function onUploadCompleted(evt:UploadEvent):void

{

//handling code here

}

Call Flash function from Javascript

Hi,

Most of the flash developer have the idea about ExternalInterface API for accessing the javascript function from Flash and it can be support to call Flash function from the javascript. From this feature we can control the functionality from the javascript. For accessing the flash function first we need to get the flash swf object instance and then call the flash function. Please note browser may be differ for getting the object from the web page. So use relevant tag for getting the swf object from HTML page. The javascript function can be added in inside of HEAD tag in the HTML /Web page as

function getFlashMovie(movieName)
{
var isIE = navigator.appName.indexOf("Microsoft") != -1;
return (isIE) ? window[movieName] : document[movieName];
}
function loadLogo()
{
getFlashMovie("Flash Instance Name").UploadLogo();
}

in Flash add the callbackfunction to the External Interface API as folows

ExternalInterface.addCallback("UploadLogo", UploadLogo);

public function UploadLogo():void

{

//Your code here

}

The some of the points to be noted for acessing the flash functions as follows

1.The flash function can be called from the javascript function must be public scope.

2.Use the flash instance name as same as Object Tag id property as well as Embed Tag id and name property

3. Object Tag id property and Embed Tag id as well as name property must be same name.

Then accessing the flash function from the javascript and control the swf functionality from javascript function.

Create Custom controls in AS3

Hi,

I would like to create the controls dynamically using the actionscript. So i create the actionscript class for creating the Button, Text Field, and TextInput controls by using the AS3. Here i added the code for creating the controls in AS3.

package util{

import flash.geom.Matrix;

import flash.display.Sprite;

import flash.text.TextField;

import flash.text.TextFormat;

import fl.controls.ProgressBar;

import flash.text.TextFieldType;

import flash.display.SimpleButton;

import flash.text.TextFormatAlign;

import flash.display.GradientType;

import fl.controls.ProgressBarMode;

import flash.text.TextFieldAutoSize;

public class ControlUtils

{

public function ControlUtils() { }

public function createTextField(color:uint):TextField

{

var _txtFormat:TextFormat = new TextFormat();

_txtFormat.font = "Arial";

_txtFormat.size = 12.5;

_txtFormat.bold = true;

_txtFormat.color = color;

var _txtField:TextField = new TextField();

_txtField.autoSize = TextFieldAutoSize.CENTER;

_txtField.defaultTextFormat = _txtFormat;

_txtField.selectable = false; return _txtField;

}

public function createInputBox(wid:int,hgt:int,bgColor:uint,borderColor:uint):TextField

{

var _txtField:TextField = new TextField();

_txtField.type = TextFieldType.INPUT;

_txtField.background = true;

_txtField.border = true;

_txtField.width = wid;

_txtField.height = hgt;

_txtField.backgroundColor = bgColor;

_txtField.borderColor = borderColor;

_txtField.selectable = false;

return _txtField;

}

public function createButton(buttonText:String,wid:int,hgt:int,color:Array,overColor:Array,txtColor:uint,cornerRadius:int=2):SimpleButton

{

var _colors:Array = [color[0],color[1]];

var _alphas:Array = [1,1];

var _ratios:Array = [0,255];

var _matrix:Matrix = new Matrix();

_matrix.createGradientBox(wid,hgt,Math.PI/2,0,0);

var _btnUpState:Sprite = new Sprite();

_btnUpState.graphics.lineStyle(1,_colors[0]);

_btnUpState.graphics.beginGradientFill(GradientType.LINEAR,_colors,_alphas,_ratios,_matrix);

if((_colors[0] == _colors[1]) && (cornerRadius == 0))

_btnUpState.graphics.drawRect(0,0,wid,hgt);

else if((_colors[0] == _colors[1]) && (cornerRadius > 0))

_btnUpState.graphics.drawRoundRect(-cornerRadius/2,0,wid-cornerRadius/2,hgt,cornerRadius,cornerRadius);

else if(_colors[0] != _colors[1])

_btnUpState.graphics.drawRoundRect(0,0,wid,hgt,cornerRadius,cornerRadius);

_btnUpState.addChild(createButtonTextField(buttonText,txtColor,wid,hgt,cornerRadius));

if(overColor == null)

_colors = [color[1],color[0]];

else

_colors = [overColor[0],overColor[1]];

var _btnOverState:Sprite = new Sprite();

_btnOverState.graphics.lineStyle(1,_colors[0]);

_btnOverState.graphics.beginGradientFill(GradientType.LINEAR,_colors,_alphas,_ratios,_matrix);

if((_colors[0] == _colors[1]) && (cornerRadius == 0))

_btnOverState.graphics.drawRect(0,0,wid,hgt);

else if((_colors[0] == _colors[1]) && (cornerRadius > 0))

_btnOverState.graphics.drawRoundRect(-cornerRadius/2,0,wid-cornerRadius/2,hgt,cornerRadius,cornerRadius);

else if(_colors[0] != _colors[1])

_btnOverState.graphics.drawRoundRect(0,0,wid,hgt,cornerRadius,cornerRadius);

_btnOverState.addChild(createButtonTextField(buttonText,txtColor,wid,hgt,cornerRadius));

var _myButton:SimpleButton = new SimpleButton(_btnUpState,_btnOverState,_btnUpState,_btnUpState);

_myButton.name = buttonText;

return _myButton;

}

private function createButtonTextField(Text:String,color:uint,wid:int,hgt:int,cornerRadius:int):TextField

{

var _txtField:TextField = new TextField();

_txtField.autoSize = TextFieldAutoSize.LEFT;

_txtField.textColor = color;

_txtField.selectable = false;

_txtField.width = wid;

_txtField.height = hgt;

var _txtFormat:TextFormat = new TextFormat();

_txtFormat.align = TextFormatAlign.CENTER;

Text = ""+Text+"";

_txtField.htmlText = ""+Text+"";

_txtField.x = (wid - _txtField.width)/2 - cornerRadius/2;

_txtField.y = (hgt - _txtField.height)/2; return _txtField;

}

public function createProgressBar(wid:int,hgt:int,barColor:Array,trackColor:uint):Preloader

{

var _progressBar:Preloader = new Preloader(wid,hgt,trackColor);

_progressBar.barColor = barColor; return _progressBar;

}

}

}

Creating the custom preloader in AS3

Hi,

I am try to use the preloader component from Flash CS3. But it takes more size while creating the swf file. So i try to create the custom preloader class in AS3. Its very nice look and we can set the preloader bar style as gradient or normal style. In below i added the custom preloader class code. use this code and enjoy.

package util

{

import flash.geom.Matrix;

import flash.text.TextField;

import flash.display.Sprite;

import flash.display.Graphics;

import flash.display.GradientType;

import flash.display.SpreadMethod;

import flash.display.InterpolationMethod;

public class Preloader extends Sprite

{

private var _matrix:Matrix;

private var _loadBar:Sprite;

private var _progressBG:Sprite;

private var _barColor:Array;

private var _percLabel:TextField;

private var _controlUtil:ControlUtils;

private var _preloaderWidth:Number = 0;

private var _preloaderHeight:Number = 0;

private var _trackColor:uint = 0xFFFFFF;

public function set barColor(val:Array):void

{

if(_barColor != val)

_barColor = val;

}

public function Preloader(wid:Number,hgt:Number,trackColor:uint)

{

super();

_matrix = new Matrix();

_preloaderWidth = wid;

_preloaderHeight = hgt;

_trackColor = trackColor;

_controlUtil = new ControlUtils();

createBackground();

}

private function createBackground():void

{

_progressBG = new Sprite();

_progressBG.graphics.clear();

_progressBG.graphics.lineStyle(0x000000,2);

_progressBG.graphics.beginFill(_trackColor,1);

_progressBG.graphics.drawRect(0,0,_preloaderWidth,_preloaderHeight);

_progressBG.graphics.endFill();

addChild(_progressBG);

_loadBar = new Sprite();

_progressBG.addChild(_loadBar);

_percLabel = _controlUtil.createTextField(0x000000);

_progressBG.addChild(_percLabel);

_percLabel.x = (_preloaderWidth - _percLabel.width)/2;

this.width = _preloaderWidth;

this.height = _preloaderHeight;

}

public function setLoadProgress(loaded:Number,total:Number):Boolean

{

var _percent:Number = loaded/total;

var _val:Number = Math.round(_percent * 100);

if(_val <= 100)

{

_percLabel.text = _val+" %";

var _tempValue:Number = Math.round(_percent * _preloaderWidth);

_matrix.createGradientBox(_tempValue,_preloaderHeight,Math.PI/2,0,0);

var _ratios:Array = [0,255];

var _alphas:Array = [0.75,0.75];

var _colors:Array = [_barColor[0],_barColor[1]];

_loadBar.graphics.clear();

if(_barColor.length > 1)

_loadBar.graphics.beginGradientFill(GradientType.LINEAR,_colors,_alphas,_ratios,_matrix);

else

_loadBar.graphics.beginFill(_barColor[0],0.7);

_loadBar.graphics.drawRect(1,1,_tempValue-1,_preloaderHeight-1);

_loadBar.graphics.endFill();

if(_val == 100)

return true;

}

return false;

}

}

}