Develop dynamic flash widget using PHP & ActionScript 3.0


flash_php_fb
Basically I’m mainly php base web application developer. But I have  much interest in ActionScript project. Sometimes when I get opportunity I work on it. Someday ago, I was assigned in a project, where I’ve to develop a Flash Widget using ActionScript 3.0 and php. This widget will be use mainly for facebook page.

So shortly the project requirements are:

  1. Develop a dynamic flash widget using ActionScript 3.0
  2. Communication between ActionScript and PHP API
  3. This widget should be working on any facebook page

To develop this project I’ve learned a new library called amfphp. Using this library its much easier and practical to communicate between ActionScript and php. In this article, I’ll show how to use amfphp and develop a dynamic flash widget.

Checkout the widget’s screen-shot here.It’s a job search widget, where user will provide keyword and US Location and the widget will show the results. Here flash widget will just pass the data to php api and after getting result it will show them.

For job search we have some customized api provided by our client. Using amfphp I call the api and pass the result to the caller here is ActionScript.

Now first setup amfphp into your project. Download amfphp from here. After downloading the .zip file unzip it and rename the folder amfphp. And put the folder in your project directory.

amfphp folder contains some folders and files like:

amfphp folder

Now I’ll show a basic usage of it. I assume your project dir name is: projectflash, your amfphp folder location is projectflash/amfphp. Now enter the directory projectflash/amfphp/services and create a php file named TestService.php. Now write this code in TestService.php


<?php
	class TestService{
		public function TestService(){

		}

		public function convertMoney($money, $rate){
			return $money * $rate;
		}
	}
?>

This is a php class where a very simple function is written named convertMoney. If you provide money and rate it will just calculate the result and return it. You can write any useful php functions for your purpose like facebook functions that will return your facebook friends.

Now upload the code to your server. If your project url is: http://myproject.com/projectflash then now please visit http://myproject.com/projectflash/amfphp/browser

You will see like this page

amfphp ui

Please see the figure and follow the instruction. Its very easy to install and use amfphp. If you see your php class and function name in the window and by providing values it shows result that means you created a service nicely. Now we will call this method from actionscript.

I assumed that you know how to create flash/actionscript project using Adobe CS4 or Flex Builder. Now use the following actionscript 3.0 code:

package {
	import flash.display.*;
	import flash.display.Sprite;
	import flash.net.*;
	import flash.system.Security;

	public class flashproject extends Sprite {
		function flashproject() {
			callservice();
		}
		private function callservice():void {
			var baseURL:String="http://myproject.com/projectflash";//Tools.getBaseURL(LoaderInfo(this.root.loaderInfo).loaderURL);

			//concat the connection string
			var gatewayUrl:String=baseURL+"/amfphp/gateway.php";
			//trace(gatewayUrl);

			//create a new net connection
			var gateway:NetConnection = new NetConnection();
			//connect to gateway
			gateway.connect(gatewayUrl);

			//create responders for the calls
			var responder:Responder=new Responder(onResult,onFault);

			//call the method
			var parameter 		=	'money=10&rate=68'; // dollar to bd taka conversion
			gateway.call("TestServices.convertMoney", responder, parameter);
		}
		function onResult(result):void {
		   trace(result);
		}
		function onFault(fault:String):void {
			trace('onFault invoked');
		}
	}
}

Please look carefully so that every path is placed correctly. If you run the .swf from Adobe CS4 you’ll see the result in the output window. The result should be 680 as you provided 68 and 10.

Using amfphp library and the following technique you can easily create php service, call them from actionscript and get the result as actionscript’s native way. By this way I developed a social media job search widget that first search the jobs and then find which people of facebook user’s friends worked in those companies. But for NDA project I couldn’t mention the live project link here.

Hope this article will help you. Cheers!

mahmud ahsan

Love computer programming and write occasional blog post. In my early career I worked mostly on web based application and since 2011, I exclusively working on iPhone and android applications. I work at home, father of a nice kid and husband of a beautiful wife. [My Business | Twitter | Linkedin]

You may also like

4 Comments

  • ranacse05
    February 3, 2010 at 3:01 am

    thanks a lot , can u please post some more AS3 tuto ?

  • mahmud ahsan
    mahmud ahsan
    February 3, 2010 at 3:04 am

    @ranacse05, actually as a php developer I hardly find time to work on AS3. But I’m a fan of AS3 and I like it very much. So when any AS3 related project comes, my company assigns that to me. I’ll try to write more in future.

  • Ed Peterson
    April 12, 2010 at 11:02 am

    Thanks a ton! That was very helpful, I just Dugg your website.

  • Jene Schmuff
    January 21, 2011 at 5:00 pm

    Am I cool now? Love my twitter follower widget!

Comments are closed here.

About Me

Hi I am Mahmud Ahsan. I Love computer programming and write occasional blog post. In my early career I worked mostly on web based application and since 2011, I exclusively working on iPhone and android applications. I work at home, father of a nice kid and husband of a beautiful wife. [My Business | Twitter | Linkedin]

Twitter Feed

Fanpage