custom button skins Flex MXML

xmlns:mx="http://www.adobe.com/2006/mxml"
layout="vertical"
verticalAlign="middle"
backgroundColor="white">

label="Button"
skin="{null}"
upSkin="{null}"
overSkin="mx.skins.halo.ButtonSkin"
downSkin="mx.skins.halo.ButtonSkin"
disabledSkin="mx.skins.halo.ButtonSkin"
icon="@Embed('assets/Button.png')" />



---------------------------------------------------------------------


xmlns:mx="http://www.adobe.com/2006/mxml"
layout="vertical"
verticalAlign="middle"
backgroundColor="white">


Button {
skin: ClassReference(null);
upSkin: ClassReference(null);
overSkin: ClassReference("mx.skins.halo.ButtonSkin");
downSkin: ClassReference("mx.skins.halo.ButtonSkin");
disabledSkin: ClassReference("mx.skins.halo.ButtonSkin");
icon: Embed("assets/Button.png");
}


label="Button" />


-------------------------------------------------------------------------------


xmlns:mx="http://www.adobe.com/2006/mxml"
layout="vertical"
verticalAlign="middle"
backgroundColor="white">


import mx.skins.halo.ButtonSkin;

[Embed("assets/Button.png")]
private const buttonIcon:Class;

private function init():void {
btn.setStyle("skin", null);
btn.setStyle("upSkin", null);
btn.setStyle("overSkin", ButtonSkin);
btn.setStyle("downSkin", ButtonSkin);
btn.setStyle("disabledSkin", ButtonSkin);
btn.setStyle("icon", buttonIcon);
}
]]>


label="Button"
initialize="init();" />

Create XML the Right way

I was working in PHP to convert my query results into XML, even though we could create this XML using normal XML header type and printing in all the tags. The problem with this type of development is that you can easily go wrong and encoding special characters could be a pain.

Here is the code for creating XML using DOM, very simple and straight forward.

I found this code from the book "PHP HACKS" by Jack D. Herrington, I thought it was worth sharing.

$books = array(
array(
id=>1,
author => "Jack",
name => "code generation in action"
),
array(
id=>2,
author => "Jack",
name => "podcasting Hacks"
),
array(
id=>3,
author => "Jack",
name => "best of PHP"
)
);

$dom = new DomDocument('1.0');
$dom->formatOutput = true;

$root = $dom->createElement("books");
$dom->appendChild($root);

foreach($books as $book){
$bn = $dom->createElement("book");
$bn->setAttribute('id',$book['id']);

$author = $dom->createElement("author");
$author->appendChild($dom->createTextNode($book['author']));
$bn->appendChild($author);

$name = $dom->createElement("name");
$name->appendChild($dom->createTextNode($book['name']));
$bn->appendChild($name);

$root->appendChild($bn);

}

header("content-type: text/xml");
echo $dom->saveXML();

?>

Building my Music Blog & library application

Initially started as a project to test the capabilities of flash to load tons of data from an xml file, later I made this into a flash music library application with support of PHP at the back end. I have completed the new version of the same in Flex and its so fast the data loads in a tick of a second.

The latest addition is the video playback functionality which I will be implementing in a weeks time.

visit my current version of Music Blog, a site with a collection of film songs based on Indain classical ragas and a lot more 

SCORM 2004 communication wrapper

Thinking of how to convert your legasy e-learning content to a SCORM 2004 compatible packages.I was also working on a similar requirement and I thought of making a communication wrapper for all this old legacy SWFs . The SCORM wrappe component helps repackaging old SWF contents into SCORM 2004 packages with all the informations stored and used for reports.I have started working on the basic version with simple sequencing features back in mid 2007 it was so successful that we could make more than a 1000 packages with the e-learning content developed way back could be reused and repackaged.The new version with new features are on plan and will update as and when they are in shape. 

 

The packages thus made could be imported into any SCORM 2004 compactible LMS and can have new sequencing features.

Play an online game and chek your knowledge about places

Its been quite a while I posted some thing on my blog.I am bussy preparing some future with PHP and Flex.For the time being I thought would introduce some old stuf but which really got my attention.This game I did almost an year back, still remember my self struggling to hit the project deadline with my feaver shooting up hardly could hold my head straight but any way got my action scripts right.I am so happy to see that so many people (75000) have played this cute little game. 

The game is ver simple you are the bird and you have to find places thats all! The whole world is yours, keep your energy to fly by grabbing some of the fish that come to the ocean surface.

Click here to play!

Accessing Java Objects from Flex

From Flex it is lot more easier to access methods of Java Objects with out using any services, you can achieve this by using the "mx:RemoteObject" tag which will interact with the Java objects using AMF (Action Message Format).
mx.servicetags.Service
Details of the tag properties are available at adobe Flex language reference.
For detailed reference and example visit ASDoc link

Brush strokes using BitmapData

Couple of weeks back I was going through the "BitmapData" class that is in the flash display package. My idea was to implement different types of brush (brush stroke) like in the photoshope into a small drawing application.Finally the whole thing became very simple.
The idea is when the user drag the mouse over the canvas we have to draw a pattern, a normal stroke will be a circle or a rectangle but here we need some custom strokes.
First we will identify a pattern which would be a combination of single pixel squares arranged to get the specific pattern.To get this pattern at run time we write a loop which uses the 'fillRect' functionality to create the pattern.
Each brush strokes would be a class on its draw function implements the fillRect according to the pattern.
dummy code will look like this
public function mouseMove(event:Event):void {
if(_drawMe){
brushStroke(_color); }
}

private function brushStroke(_color):void {
var fiber_lng:Number =30;
for(var i:int=0;i<=fiber_lng;i++){
bitmap.fillRect(new Rectangle(mouseX+Math.round(Math.random()*10), mouseY+Math.round(Math.random()*10),_pixelWidth, _pixelHight), _color);
}
}
Since we are only changing the color values of a canvas, this approach has proved very smooth and fast, and the main thing that has to taken care of is not overdoing the loops to create complex strokes.
Hope this will help in some of your application

Developing Custom Events for FLEX

Ever wondered while coding for events, it would have been great if I had a custom event whose result event target contain what I want , then this is what you should do.

I would make a class called "CustomEvent" extending the "Events" class which will take care of all the custom event details. I also have another class which trigger the events as soon as it get the data from a webservice .

the DataEventHandler class looks something like this

package mypackage{

import mx.collections.ArrayCollection;
import mx.rpc.events.ResultEvent;
import mx.rpc.events.FaultEvent;
import mx.rpc.soap.WebService;
import mx.rpc.soap.LoadEvent;
import mx.controls.Alert;
import flash.events.EventDispatcher;
import flash.events.Event;
import flash.display.Sprite
import components.CustomEvent;

public class DataEventHandler extends Sprite{
private var service_handler:WebService;
private var methodList:ArrayCollection;
private var isLoaded:Boolean = false;

public function startService(path:String):void{
service_handler = new WebService();
service_handler.wsdl= path;
service_handler.loadWSDL();

service_handler.addEventListener(FaultEvent.FAULT,faultHandler);
service_handler.addEventListener(LoadEvent.LOAD,loadHandler);
service_handler.GetOverviewXML.addEventListener(ResultEvent.RESULT,onOverviewResult);
service_handler.GetOverviewXML.addEventListener(FaultEvent.FAULT,faultHandler);
}
private function loadHandler(event:LoadEvent):void {
isLoaded = true;

dispatchEvent(new Event("onLoadService"));
}


private function faultHandler(event:FaultEvent):void {
Alert.show("error :"+event.fault);
}
private function onOverviewResult(r:ResultEvent):void{

dispatchEvent(new CustomEvent("OverviewEvent",r.result));

}
}
The CustomEvent Class looks like this.

package mypackage{


import mx.controls.Alert;
import flash.events.EventDispatcher;
import flash.events.Event;


public class CustomEvent extends Event{


public var itemDescription:*;

public static const OVERVIEW:String ="OverviewEvent"


public function CustomEvent(type:String,description:* ){
super(type,true, true); //bubble by default

itemDescription=description;
}

override public function clone():Event{
return new CustomEvent(type,itemDescription); // bubbling support inside
}



}

}

From the development side I would write

data_handler = new DataEventHandler();
data_handler.startService("servicepath?wsdl");
data_handler.addEventListener(CustomEvent.OVERVIEW,onOverviewLoad);

private function onOverviewLoad(e:CustomEvent):void{

for(var ns:String in e.itemDescription){
Alert.show(ns+ "::"+e.itemDescription[ns]);
}

}
Note how we included the "CustomEvent" target object. use a for loop to get all the data stored by the result object.Hope rest of the code is self explanatory. This classes has been very useful for me.