Flash Widget Tutorial

Flash Widgets Hussain Fakhruddin http://hussulinux.blogspot.com hussulinux@gmail.com

Widgets : Window Gadgets ➔ Can be embedded on ➔ Websites, ➔ Blogs, ➔ Desktops, ➔ Social networking sites ... ➔ Really easy to develop ➔ Many Frameworks ➔ 2

Widgets widgets widgets 3

What are we waiting for? What we're going to do is this: Retrieve data from a database. Print it somewhere using scripting language. Import this in the flash. What we need? Adobe Flash( I'll show all demos using Flash 8) PHP/ASP/JSP/CGI/RoR any scripting language. I'll use PHP Database if any. 4

Lets get started On the server. Step 1: (Without XML) Create a script which will throw out the data to you in a GET variable form Example author=Hussain&desc=I+am+a+stupid+programmer&picu rl=me.jpg Also create a database create table barcamp ( uid int(10) primary key auto_increment, author varchar(50), desciption text, picurl varchar(60) ); 5

PHP Script for the widget <?php $uid = $_GET['uid']; // I will receive this from the flash include ('db.php'); //Contains my Database Connectivity code. $rs = mysql_query(quot;select * from barcamp where uid=$uidquot;); // I'm being lazy to check for errors here $arr = mysql_fetch_array($rs); //Output format, I am using URL encode method, One may also use XML echo quot;author=quot;.$arr['author']; echo quot;&desc=quot;.$arr['desciption']; echo quot;&picurl=quot;.$arr['picurl']; ?> 6

Flash Design Our flash widget design 7

Flash ActionScript Now to get this data into our flash widget function LoadData() { myvar=new LoadVars(); //Create a New LoadVars object //Load our created URL myvar.load(quot;http://www.mywidgets.com/widget/getWidgetInfo.php?uid=quot; + this.uid); //I'll explain where this.uid comes from later. myvar.onLoad = function( ){ /* Our PHP variables are available inside flash as myvar.author; myvar.desc; myvar.picurl; */ author = myvar.author; desc = myvar.desc; LoadMovie(pic,picurl); } } //Call the above function LoadData(); 8

Embed this <embed allownetworking=quot;allquot; pluginspage=quot;http://www.macromedia.com/go/ getflashplayerquot; quality=quot;highquot; allowscriptaccess=quot;alwaysquot; align=quot;middlequot; flashvars=quot;uid=1quot; src=quot;http://www.mywidgets.com/widget/mywidg et.swfquot; height=quot;230quot; type=quot;application/x- shockwave-flashquot; bgcolor=quot;#ffffffquot; width=quot;194quot; name=quot;mywidgetquot; /> </embed> 9

http://www.slideshare.net	123
http://hussulinux.blogspot.com	13
http://localhost	4
http://meband.fandistribution.com	3
http://www.kaneva.com	2
http://cms.cadems.webnode.com.br	1
http://www.appsgeyser.com	1
http://oursoftwarepc.blogspot.com	1
http://profiles.myfreecams.com	1
http://translate.googleusercontent.com	1
http://feeds.feedburner.com	1
http://www.peharec.com	1
http://wildfire.gigya.com	1
file://	1

Flash Widget Tutorial

by hussulinux on Jul 08, 2007

Accessibility

Categories

Tags

Upload Details

Usage Rights

14 Embeds 154

Statistics

Flash Widget Tutorial — Presentation Transcript