Flex, Flash and Web design

Tuesday, March 29, 2011

Server side connection in flex using php

MXML File

<?xml version="1.0" encoding="utf-8"?>

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" backgroundGradientAlphas="[1.0, 1.0]" backgroundGradientColors="[#4D4B4B, #626060]">

<mx:Style source="assets/css/style.css"/>

<mx:Script>

<![CDATA[

import mx.managers.PopUpManager;

import mx.controls.Text;

import mx.rpc.events.FaultEvent;

import mx.rpc.events.ResultEvent;

import mx.controls.Alert;

[Bindable]

public var newuserloginDetail:NewuserLogin;

public var alertmsgbox:alertpopup;

public var displayhos:HospitalL2details;

public var saml:XML;

public function loginpage(evt:ResultEvent):void

{

if(evt.result.loginsuccess == "yes")

{

errorlogin.text="";

username.text="";

password.text="";

displayhos=new HospitalL2details();

this.addChild(displayhos);

}

if(evt.result.loginsuccess == "no")

{

username.text="";

password.text="";

errorlogin.text="Invalid username / password";

}

private function login():void

{

loginHTTPservice.send();

}

public function createnewuser(evt:ResultEvent):void

{

if(evt.result.newuser == "Error")

{

newuserloginDetail.errormsg2.text="Error";

}

if(evt.result.newuser == "Successfully Created")

{

newuserloginDetail.errormsg2.text="Successfully Created";

alertmsgbox=new alertpopup();

PopUpManager.addPopUp(alertmsgbox,this,true);

PopUpManager.centerPopUp(alertmsgbox);

}

public function removemsgpopup():void

{

PopUpManager.removePopUp(alertmsgbox);

}

public function removeallpopup():void

{

PopUpManager.removePopUp(alertmsgbox);

PopUpManager.removePopUp(newuserloginDetail);

}

public function newuser():void

{

if(newuserloginDetail.newpassword.text != newuserloginDetail.newpassword1.text || newuserloginDetail.fname.text=="" || newuserloginDetail.lname.text=="" || newuserloginDetail.newpassword.text=="" || newuserloginDetail.newpassword1.text=="")

{

}

else {

createnewuserrequest.send();

}

private function cleartexfield():void

{

errorlogin.text="";

username.text="";

password.text="";

}

private function fault(evnt:FaultEvent):void

{

displayerrorHTTP.text=evnt.fault.faultString+'\n'+evnt.fault.faultCode+'\n'+evnt.fault.faultDetail;

}

public function newuserlogindis():void

{

newuserloginDetail=new NewuserLogin();

PopUpManager.addPopUp(newuserloginDetail,this,true);

PopUpManager.centerPopUp(newuserloginDetail);

}

public function romovepopupnewuser():void

{

PopUpManager.removePopUp(newuserloginDetail);

}

]]>

</mx:Script>

<mx:HTTPService url="http://localhost/passwordresult/passoutput.php" useProxy="false" fault="fault(event)" result="loginpage(event)" method="POST" id="loginHTTPservice">

<mx:request xmlns="">

<usernameres>{username.text}</usernameres>

<passwordres>{password.text}</passwordres>

</mx:request>

</mx:HTTPService>

<mx:HTTPService url="http://localhost/passwordresult/newusercreate.php" method="POST" useProxy="false" result="createnewuser(event)" fault="fault(event)" id="createnewuserrequest">

<mx:request xmlns="">

<newusername>{newuserloginDetail.lname.text}</newusername>

<newuserpass>{newuserloginDetail.newpassword.text}</newuserpass>

</mx:request>

</mx:HTTPService>

<mx:Panel x="406" y="241" width="453" height="287" layout="absolute" title="Login Page">

<mx:Label x="52" y="59" text="User Name:" fontFamily="Arial" fontSize="13" fontWeight="bold"/>

<mx:Label x="61" y="119" text="Password:" fontSize="13" fontFamily="Arial" fontWeight="bold"/>

<mx:TextInput x="166" y="57" id="username"/>

<mx:TextInput x="166" y="117" id="password" displayAsPassword="true"/>

<mx:Button x="166" y="188" label="Submit" click="login()"/>

<mx:Button x="271" y="188" label="Clear" click="cleartexfield();"/>

<mx:Label x="20" y="219" text="New User Login" fontWeight="bold" buttonMode="true" useHandCursor="true" color="#0C8FAB" textDecoration="underline" click="newuserlogindis();"/>

<mx:Label x="166" y="153" id="errorlogin" width="257" color="#ED1807"/>

</mx:Panel>

<mx:Label x="406" y="536" id="displayerrorHTTP" width="225" height="58" color="#FFFFFF"/>

</mx:Application>

HospitalL2details.MXML Component

<?xml version="1.0" encoding="utf-8"?>

<mx:Canvas xmlns:mx="http://www.adobe.com/2006/mxml" width="100%" height="100%" backgroundColor="#4C4B4B">

<mx:Script>

<![CDATA[

import mx.core.Application;

public function removethiscontainer():void

{

Application.application.removeChild(this);

}

]]>

</mx:Script>

<mx:Label x="24" y="14" text="Hospital Details" color="#F9FCFD" fontSize="16" fontFamily="Arial" fontWeight="bold"/>

<mx:Label right="10" y="19" buttonMode="true" text="Logout" color="#FEFEFE" fontWeight="bold" fontFamily="Arial" fontSize="12" click="removethiscontainer();"/>

<mx:Panel left="10" right="10" top="64" y="57" width="100%" bottom="10" height="100%" layout="absolute" styleName="topspacepanel">

</mx:Panel>

</mx:Canvas>

NewuserLogin.MXML Component

<?xml version="1.0" encoding="utf-8"?>

<mx:Panel xmlns:mx="http://www.adobe.com/2006/mxml" width="428" styleName="Panelcol" height="408" layout="absolute" borderColor="#6E6F6F">

<mx:Script>

<![CDATA[

import mx.core.Application;

public function validationtext():void

{

if(fname.text=="" || lname.text=="" || newpassword.text=="" || newpassword1.text=="")

{

errormsg.text="Fill the All Fileds";

}

else

{

errormsg.text="";

}

public function validationtext1():void

{

if(newpassword.text != newpassword1.text || newpassword.text=="")

{

errormsg1.text="Please Enter Same Password";

}

else

{

errormsg1.text="";

}

public function cleartextfield():void

{

fname.text="";

lname.text="";

newpassword.text="";

newpassword1.text="";

}

]]>

</mx:Script>

<mx:Label text="Name" x="30" y="53" fontSize="13" fontWeight="normal" fontFamily="Arial"/>

<mx:Label text="User Name" x="30" y="99" fontSize="13" fontWeight="normal" fontFamily="Arial"/>

<mx:Label text="Password" x="32" y="150" fontSize="13" fontWeight="normal" fontFamily="Arial"/>

<mx:Label text="Conform Password" x="30" y="204" fontSize="13" fontWeight="normal" fontFamily="Arial"/>

<mx:Button x="180" y="273" label="Submit" click="validationtext(),validationtext1(),Application.application.newuser(),cleartextfield();"/>

<mx:Button x="281" y="273" label="Clear" click="cleartextfield();"/>

<mx:TextInput x="180" y="54" id="fname"/>

<mx:TextInput x="180" y="100" id="lname"/>

<mx:TextInput x="180" y="151" displayAsPassword="true" id="newpassword"/>

<mx:TextInput x="180" y="203" displayAsPassword="true" id="newpassword1"/>

<mx:Label x="317" y="8" text="Close Window" fontWeight="bold" useHandCursor="true" buttonMode="true" color="#0C8FAB" textDecoration="underline" click="Application.application.romovepopupnewuser();"/>

<mx:Label x="9" y="7" text="New User Login" fontWeight="bold" useHandCursor="true" color="#4D6F05" textDecoration="normal" fontSize="14" fontFamily="Arial"/>

<mx:Label x="176" y="327" width="173" height="20" color="#F43705" id="errormsg"/>

<mx:Label x="10" y="233" width="173" height="20" color="#F43705" id="errormsg2"/>

<mx:Label x="177" y="177" width="173" height="20" color="#F43705" id="errormsg1"/>

<mx:Image source="assets/images/newuser.jpg" width="100" height="96" x="30" y="251"/>

</mx:Panel>

alertpopup.MXML Component

<?xml version="1.0" encoding="utf-8"?>

<mx:Canvas xmlns:mx="http://www.adobe.com/2006/mxml" width="272" height="118">

<mx:Script>

<![CDATA[

import mx.core.Application;

]]>

</mx:Script>

<mx:Panel width="100%" height="100%" styleName="topspacepanel" layout="absolute">

<mx:Label text="Do you want to create new user" x="8" y="39" fontWeight="bold"/>

<mx:Label text="Successfully Created" x="58" y="11" fontWeight="bold" fontSize="12" color="#FC0D0D"/>

<mx:Button x="55" y="68" label="Yes" click="Application.application.removemsgpopup();" />

<mx:Button x="140" y="68" label="No" click="Application.application.removeallpopup();" />

</mx:Panel>

</mx:Canvas>

style.CSS

/* CSS file */

.Panelcol {

borderColor: #6e6f6f;

borderAlpha: 1;

borderThicknessLeft: 10;

borderThicknessTop: 0;

borderThicknessBottom: 11;

borderThicknessRight: 10;

roundedBottomCorners: true;

cornerRadius: 9;

headerHeight: 22;

backgroundAlpha: 1;

highlightAlphas: 0.5, 0;

backgroundColor: #ffffff;

dropShadowEnabled: true;

shadowDistance: 2;

shadowDirection: left;

}

.topspacepanel

{

borderAlpha: 0.59;

borderThicknessLeft: 5;

borderThicknessTop: 0;

borderThicknessBottom: 4;

borderThicknessRight: 4;

roundedBottomCorners: false;

cornerRadius: 0;

headerHeight: 5;

backgroundAlpha: 1;

highlightAlphas: 0.06, 0.19;

dropShadowEnabled: true;

shadowDistance: 2;

shadowDirection: left;

}

Your file keep in this Format

Server Side Files
passoutput.php

<?php

$serv ='localhost';

$usern ='root';

$passw ='';

$databasename = 'flexsample';

$sqlcon = mysql_connect($serv, $usern, $passw) or die(mysql_error());

mysql_select_db($databasename);

$username=mysql_real_escape_string($_POST["usernameres"]);

$password=mysql_real_escape_string($_POST["passwordres"]);

$query = "SELECT * FROM hospitallogin WHERE username = '$username' AND pass = '$password'";

$result = mysql_fetch_array(mysql_query($query));

$output = "<loginsuccess>";

if(!$result)

{

$output .= "no";

}

else{

$output .= "yes";

}

$output .= "</loginsuccess>";

//output all the XML

print ($output);

mysql_close($sqlcon);

newusercreate.PHP

<?php

$lhoste='localhost';

$uname='root';

$passval='';

$DatabaseN='flexsample';

$sqlcon = mysql_connect($lhoste, $uname, $passval) or die(msql_error());

mysql_select_db($DatabaseN);

$newusername = mysql_real_escape_string($_POST['newusername']);

$newpasdwod = mysql_real_escape_string($_POST['newuserpass']);

$query = "INSERT INTO hospitallogin VALUES('$newusername','$newpasdwod')";

$result = mysql_fetch_array(mysql_query($query));

$output = "<newuser>";

if(!$result)

{

$output .= "Successfully Created";

}

else{

$output .= "Error";

}

$output .= "</newuser>";

print ($output);

mysql_close($sqlcon);

MYSQL FORMAT

Output Screen Shots

Wednesday, March 23, 2011

Upload File From Flex to PHP

MXML File

<?xml version="1.0" encoding="utf-8"?>

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" creationComplete="init();" backgroundGradientAlphas="[1.0, 1.0]" backgroundGradientColors="[#4E4C4C, #4E4C4C]">

<mx:Script>

<![CDATA[

import mx.controls.Alert;

private var urlRequest:URLRequest;

private var fileReferenceList:FileReferenceList;

private var serverSideScript:String = "http://localhost/testfile/uploadFile.php";

private function init():void {

fileReferenceList = new FileReferenceList();

fileReferenceList.addEventListener(Event.SELECT, fileSelectedHandler);

}

private function uploadFile():void {

fileReferenceList.browse();

}

private function fileSelectedHandler(event:Event):void {

urlRequest = new URLRequest(serverSideScript);

var fileReference:FileReference;

var fileReferenceList:FileReferenceList = FileReferenceList(event.target);

var fileList:Array = fileReferenceList.fileList;

// get the first file that the user chose

fileReference = FileReference(fileList[0]);

// upload the file to the server side script

fileReference.addEventListener(Event.COMPLETE, uploadCompleteHandler);

fileReference.upload(urlRequest);

// update the status text

statusText.text = "Uploading...";

}

private function uploadCompleteHandler(event:Event):void {

statusText.text = "File Uploaded: " + event.target.name + event.target.size;

}

]]>

</mx:Script>

<mx:Label text="Upload File From Flex to PHP" fontWeight="bold" color="#FEFFFF" fontSize="23"/>

<mx:Label text="Choose a file..." id="statusText" color="#FCFDFD" fontSize="17"/>

<mx:Button click="uploadFile();" label="Upload File"/>

</mx:Application>

PHP Server Side File

<?php

$url = "D:/uploads/"; //This is Upload file URL

$tempFile = $_FILES['Filedata']['tmp_name']; // This is going to return the temporary file location

$fileName = $_FILES['Filedata']['name']; // This is going to return the name.

$fileSize = $_FILES['Filedata']['size']; // This is going to return the file size in bytes

move_uploaded_file($tempFile, $url.$fileName); //This is going to upload file to your folder

Output

Monday, February 28, 2011

HTML Loder in Flex Air Application

mxml code

<?xml version="1.0" encoding="utf-8"?>

<mx:WindowedApplication xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" viewSourceURL="srcview/index.html">

<mx:Script>

<![CDATA[

import mx.events.ResizeEvent;

import mx.controls.Alert;

private var htm:HTMLLoader=new HTMLLoader();

private var loc:String = "<html><head></head><body><iframe width='100%' height='100%' frameborder='0' scrolling='no' marginheight='0' marginwidth='0' src='http://maps.google.com/maps?f=q&source=s_q&hl=en&geocode=&q=33 Wood Ave, Iselin, NJ 08246&z=12&output=embed'></iframe></body></html>";

private var conti:Sprite=new Sprite();

private var buttun:Boolean=true;

public function aceesslink():void

{

htm.loadString(loc);

conti.addChild(htm);

uicomponent.addChild(conti);

/* Alert.show("Hi EveryBody") */;

}

private function onResize(e:ResizeEvent):void

{

htm.width = uicomponent.width;

htm.height = uicomponent.height;

}

public function activatebtn():void

{

buttun=false;

if(buttun==false)

{

cheing.selected=false;

mapaction.enabled=false;

}

public function checkboxaction():void

{

if(cheing.selected)

{

mapaction.enabled=true;

}

else

{

mapaction.enabled=false;

}

]]>

</mx:Script>

<mx:Button x="323" y="535" label="Click ME" id="mapaction" width="146" height="49" click="aceesslink(),activatebtn();"/>

<mx:Panel x="10" y="10" width="782" height="505" layout="absolute" id="includegoogle">

<mx:UIComponent id="uicomponent" width="100%" height="100%" resize="onResize(event)"/>

</mx:Panel>

<mx:CheckBox x="16" y="549" label="Map Refresh" id="cheing" selected="true" change="checkboxaction()"/>

</mx:WindowedApplication>

Output Image:

Thursday, September 23, 2010

Dynamically loading data in Data Grid (Flex)

Flex File

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" color="#4B5C60" borderColor="#667179" backgroundGradientAlphas="[1.0, 1.0]" backgroundGradientColors="[#5F5E5E, #524D4D]" creationComplete="sendfile.send();">

    <mx:Script>
        <![CDATA[
            import mx.rpc.events.FaultEvent;
            import mx.controls.Alert;
            import mx.collections.XMLListCollection;
            import mx.rpc.events.ResultEvent;

        [Bindable]
        public var datastore:XML;
        [Bindable]
        public var     datacollection:XMLList;
        private var alert:Alert;
        private var coll:Array;


    public function retrievedata(event:ResultEvent):void

    {

    datastore=new XML(event.result);
    datacollection=datastore.datas;

     }

    private function finderror(event:FaultEvent):void

         {
                var title:String = event.type + " (" + event.fault.faultCode + ")";
                var text:String = event.fault.faultString;
                 alert = Alert.show(text, title);
                datacollection.removeAll();
            }

public function checking():void
{
     Alert.show(datacollection.length());
}

    public function alertdescription():void
    {
        Alert.show(dataprovider.selectedItem.description);

    }

        ]]>
    </mx:Script>


    <mx:HTTPService id="sendfile" url="assets/xmlfile/empdatas.xml" result="retrievedata(event)" resultFormat="e4x"/>

    <mx:DataGrid x="106" y="272" width="682" height="284" id="dataprovider" dataProvider="{datacollection}" change="alertdescription()">
        <mx:columns>

            <mx:DataGridColumn headerText="ID Number" dataField="id" />
           <mx:DataGridColumn headerText="Name" dataField="name"/>
           <mx:DataGridColumn headerText="Designation" dataField="Designation"/>
           <mx:DataGridColumn headerText="Address1" dataField="padress"/>
           <mx:DataGridColumn headerText="Address2" dataField="tadress"/>

        </mx:columns>

    </mx:DataGrid>

    <mx:Button x="106" y="129" label="Data Count" width="100" height="30" click="checking();"/>


</mx:Application>

XML File

empdatas.xml

<?xml version="1.0" encoding="utf-8"?>

<datas>

<name>kaniskar</name>

<Designation>Webdesigner</Designation>

<padress>Tuticorin</padress>

<tadress>chennai</tadress>

<description>He is working in chennai. He is a webdesigner</description>

</datas>

<datas>

<name>Allwin</name>

<Designation>Marketing</Designation>

<padress>Tuticorin</padress>

<tadress>Chennai</tadress>

<description>He is a Marketing person. Now he is in chennai. </description>

</datas>

<datas>

<name>Goodwin</name>

<Designation>Software engineer</Designation>

<padress>Madurai</padress>

<tadress>Bangalore</tadress>

<description>He was engineer in MNC. He is a Senior Developer </description>

</datas>

<datas>

<name>Thanabalan</name>

<Designation>Businesman</Designation>

<padress>Tuticorin</padress>

<tadress>Tuticorin</tadress>

<description>He is a big Business man in Kommadikottai. </description>

</datas>

<datas>

<Designation>Software</Designation>

<padress>Chennai</padress>

<tadress>Bangalore</tadress>

<description>He was engineer in MNC. He is a Senior Developer </description>

</datas>

<datas>

<name>Arasu</name>

<Designation>PHP Developer</Designation>

<padress>Madurai</padress>

<tadress>Meenakshi Temple Street</tadress>

<description>He is working as a PHP Developer. Now He is working in madurai</description>

</datas>

<datas>

<name>Boopathi</name>

<Designation>Teacher</Designation>

<padress>Rameshwaram</padress>

<tadress>Temple Street,</tadress>

<description>Now he is in chennai. He is searching another job </description>

</datas>

</overalldata>

Your file keep in this format

Output

Thursday, August 26, 2010

HTTP Service (Flex)

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" creationComplete="servicesender.send();">

    <mx:Script>
        <![CDATA[
            import mx.collections.ArrayCollection;
            import mx.rpc.events.FaultEvent;
            import mx.controls.Alert;
            import mx.rpc.events.ResultEvent;

            private var arr:XML;
            private var arrall:XMLList=new XMLList();

            private function resudata(evt:ResultEvent):void

            {
             arr=new XML(evt.result);
             arrall=arr.empdetail;
            }

            private function faultservice(evt:FaultEvent):void
            {
            Alert.show(evt.fault.faultString);
            }

            private function count():void
            {
            Alert.show(arrall.length());

            }
        ]]>
    </mx:Script>


    <mx:HTTPService id="servicesender" resultFormat="e4x" url="assets/emp.xml" result="resudata(event);" fault="faultservice(event);"/>
    <mx:Button width="252" height="108" click="count();" label="XML File Length" x="467.5" y="281" fontSize="20"/>

</mx:Application>

XML File

<?xml version="1.0" encoding="utf-8"?>
<employee>

<empdetail>
<companyname>ABC</companyname>
<companysubname>Technology1</companysubname>
<name>kaniskar</name>
<id>000001</id>
<bloodgroup>B+</bloodgroup>
<description>Sample</description>
</empdetail>

<empdetail>
<companyname>DEF</companyname>
<companysubname>Technology2</companysubname>
<name>kaniskar</name>
<id>000001</id>
<bloodgroup>B+</bloodgroup>
<description>Sample1</description>
</empdetail>

<empdetail>
<companyname>GHI</companyname>
<companysubname>Technology3</companysubname>
<name>kaniskar</name>
<id>000001</id>
<bloodgroup>B+</bloodgroup>
<description>Sample2</description>
</empdetail>

<empdetail>
<companyname>JKL</companyname>
<companysubname>Technology4</companysubname>
<name>kaniskar</name>
<id>000001</id>
<bloodgroup>B+</bloodgroup>
<description>Sample3</description>
</empdetail>

<empdetail>
<companyname>MNO</companyname>
<companysubname>Technology5</companysubname>
<name>kaniskar</name>
<id>000001</id>
<bloodgroup>B+</bloodgroup>
<description>Sample4</description>
</empdetail>

<empdetail>
<companyname>Solvedge</companyname>
<companysubname>Enabling Technology</companysubname>
<name>kaniskar</name>
<id>000001</id>
<bloodgroup>B+</bloodgroup>
<description>jksdkjfhksdjhfkjshfkjhsjkdfhsjkdfhjkshdfjkhsdfjkhsdfhsjkdfhksjh</description>
</empdetail>

</employee>

Your File Keep in this format

Output

Monday, August 23, 2010

Image Drag (Flex)

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" backgroundGradientAlphas="[1.0, 1.0]" backgroundGradientColors="[#494747, #494747]" creationComplete="servicelis.send();">
<mx:Script>
    <![CDATA[
        import mx.core.UIComponent;
        import mx.events.DragEvent;
        import mx.containers.Panel;
        import mx.containers.Canvas;
        import mx.managers.DragManager;
        import mx.core.DragSource;
        import mx.controls.Image;
        import mx.controls.Alert;
        import mx.collections.ArrayCollection;
        import mx.rpc.events.ResultEvent;

        [Bindable]
        private var allimage:ArrayCollection=new ArrayCollection();

        private var newimg:Image;
        public var val:String=new String();
        private var deleteobj:Object=new Object();
        private var imglod:String;
        private function imageretrive(evt:ResultEvent):void
        {
            allimage=evt.result.imagelist.image;
        }
        private function callxml(xmlfile:String):void
        {
            servicelis.url=xmlfile;
            servicelis.send();
        }

        public function dodrag(evt:MouseEvent):void
        {
            var img:Image=evt.currentTarget as Image;
               /* var neimage:Image=new Image();
            neimage.source=img.source; */
            var dodrg:DragSource=new DragSource();
            dodrg.addData(img, 'img');
            DragManager.doDrag(img,dodrg,evt);
            imglod=(evt.currentTarget as Image).source.toString();


        }

        private function dragAccept(event:DragEvent):void

        {
        var dropTarget:Canvas = event.currentTarget as Canvas;
        DragManager.acceptDragDrop(dropTarget);
        }

        private function dropimg(evt:DragEvent):void
        {
         newimg=new Image();
         can.addChild(newimg);
         newimg.source=imglod;
         newimg.x=can.mouseX;
         newimg.y=can.mouseY;
         newimg.name=val;
         newimg.addEventListener(MouseEvent.MOUSE_DOWN, startmove);
         newimg.addEventListener(MouseEvent.MOUSE_UP, stopmove);
         newimg.addEventListener(MouseEvent.CLICK, takeimage);

        }
        private function takeimage(evt:Event):void
        {
            deleteobj=evt.currentTarget as Image;
        }

        private function startmove(evt:MouseEvent):void
        {
            (evt.currentTarget as Image).startDrag();
        }
        private function stopmove(evt:MouseEvent):void
        {
            (evt.currentTarget as Image).stopDrag();
        }

        private function check():void

        {
            Alert.show(allimage.length.toString());

        }

        private function del(evt:Event):void
        {
       can.removeChild(deleteobj as Image);
        }

    ]]>
</mx:Script>

<mx:HTTPService id="servicelis" url="assets/imagelist.xml" result="imageretrive(event)"/>



    <mx:Canvas x="14" y="418" width="820" height="127" borderColor="#494B4C" backgroundColor="#8E8C8C">
        <mx:TileList x="6" y="6" dataProvider="{allimage}" itemRenderer="imgfile" labelField="title" width="809" height="116" backgroundColor="#8E8C8C">

        </mx:TileList>
    </mx:Canvas>

    <mx:Canvas x="14" y="23" width="820" id="can" height="377" dragEnter="dragAccept(event);" dragDrop="dropimg(event);" borderStyle="solid" borderColor="#8b8b8b" borderThickness="3" backgroundColor="#ffffff">
        <mx:Button width="50" height="30" click="check();" x="764" y="341">

        </mx:Button>
    </mx:Canvas>
    <mx:Panel x="838" y="23" width="166" height="522" layout="absolute">
        <mx:Button x="20" y="40" label="Natural" width="98" click="callxml('assets/imagelist.xml')"/>
        <mx:Button x="20" y="80" label="Animals " width="98" click="callxml('assets/imagelist1.xml')"/>
        <mx:Button x="20" y="120" label="Baby " width="98" click="callxml('assets/imagelist2.xml')"/>
        <mx:Button x="20" y="160" label="Delete " width="98" click="del(event);"/>
    </mx:Panel>
</mx:Application>

XML File

imagelist.xml

<?xml version="1.0" encoding="iso-8859-1"?>
<imagelist>

<image>
<tiltle>Image1</tiltle>
<srcim>assets/images/img1.jpg</srcim>
</image>

<image>
<tiltle>Image2</tiltle>
<srcim>assets/images/img2.jpg</srcim>
</image>

<image>
<tiltle>Image3</tiltle>
<srcim>assets/images/img3.jpg</srcim>
</image>

<image>
<tiltle>Image4</tiltle>
<srcim>assets/images/img4.jpg</srcim>
</image>

<image>
<tiltle>Image5</tiltle>
<srcim>assets/images/img5.jpg</srcim>
</image>

<image>
<tiltle>Image3</tiltle>
<srcim>assets/images/img6.jpg</srcim>
</image>
<image>
<tiltle>Image4</tiltle>
<srcim>assets/images/img7.jpg</srcim>
</image>

</imagelist>

imagelist1.xml

<?xml version="1.0" encoding="iso-8859-1"?>
<imagelist>

<image>
<tiltle>Image1</tiltle>
<srcim>assets/images/img11.jpg</srcim>
</image>

<image>
<tiltle>Image2</tiltle>
<srcim>assets/images/img21.jpg</srcim>
</image>

<image>
<tiltle>Image3</tiltle>
<srcim>assets/images/img31.jpg</srcim>
</image>

<image>
<tiltle>Image4</tiltle>
<srcim>assets/images/img41.jpg</srcim>
</image>

<image>
<tiltle>Image5</tiltle>
<srcim>assets/images/img51.jpg</srcim>
</image>

<image>
<tiltle>Image3</tiltle>
<srcim>assets/images/img61.jpg</srcim>
</image>

<image>
<tiltle>Image4</tiltle>
<srcim>assets/images/img71.jpg</srcim>
</image>

</imagelist>

imagelist2.xml

<?xml version="1.0" encoding="iso-8859-1"?>
<imagelist>

<image>
<tiltle>Image1</tiltle>
<srcim>assets/images/img12.jpg</srcim>
</image>

<image>
<tiltle>Image2</tiltle>
<srcim>assets/images/img22.jpg</srcim>
</image>

<image>
<tiltle>Image3</tiltle>
<srcim>assets/images/img32.jpg</srcim>
</image>

<image>
<tiltle>Image4</tiltle>
<srcim>assets/images/img42.jpg</srcim>
</image>

<image>
<tiltle>Image5</tiltle>
<srcim>assets/images/img52.jpg</srcim>
</image>

<image>
<tiltle>Image3</tiltle>
<srcim>assets/images/img62.jpg</srcim>
</image>

<image>
<tiltle>Image4</tiltle>
<srcim>assets/images/img72.jpg</srcim>
</image>

</imagelist>

Your File Keep this Format

Out put

Thursday, August 19, 2010

Video player(Flex)

<mx:HTTPService id="sendreques" url="assets/vidiofile.xml" result="collectionvideo(event);"/>
   <mx:Panel x="918" y="28" width="250" height="747" layout="absolute">

        <mx:TileList x="25" itemClick="selectflvfile(event);" y="10" id="tileimage" dataProvider="{arraycolle}" labelField="book" width="185" height="668">
        <mx:itemRenderer>
            <mx:Component>
                <mx:Image source="{data.book}" width="150" height="150"/>
            </mx:Component>
        </mx:itemRenderer>
        </mx:TileList>
    </mx:Panel>
    <mx:Panel x="27" y="28" width="848" height="747" layout="absolute" backgroundColor="#161515">
<mx:Image source="assets/images/req7nqmi.jpg" width="807" height="705"/>
        <mx:VideoDisplay x="179.5" y="10" width="584" height="286" id="displayimg" playheadUpdate="videoDisplay_playheadUpdate()"/>
        <mx:Panel x="107" y="624" width="563" height="73" layout="absolute" backgroundColor="#D4CECE">
            <mx:Button x="10" y="6" label="Play" fillAlphas="[1.0, 1.0, 1.0, 1.0]" fillColors="[#E0DFDF, #D5D5D5, #CACACA, #595757]" borderColor="#808181" themeColor="#868788" width="64" click="playflim();"/>
            <mx:Button x="468" y="6" label="Pause" fillAlphas="[1.0, 1.0, 1.0, 1.0]" fillColors="[#E0DFDF, #D5D5D5, #CACACA, #595757]" borderColor="#808181" themeColor="#868788" click="pauseflim();"/>
            <mx:ProgressBar x="89.75" y="16" mode="manual" label=" " id="prograssimg" width="363.5" height="13"/>
    </mx:Panel>

    </mx:Panel>
</mx:Application>

XML File

<?xml version="1.0" encoding="utf-8"?>
<videolist>
<video>
<src>Animal_Face_Off_Anaconda_vs._Jaguar.flv</src>
<title>Billie Jean</title>
<book>assets/images/book_1.jpg</book>
</video>
<video>
<src>Spy_vs_Spy_-_Defection.flv</src>
<title>Smooth Criminal</title>
<book>assets/images/image_po.jpg</book>
</video>
<video>
<src>flowplayer.flv</src>
<title>Dangerous</title>
<book>assets/images/image_eye.jpg</book>
</video>
<video>
<src>Spy_vs_Spy_-_Defection.flv</src>
<title>Dangerous</title>
<book>assets/images/book_1.jpg</book>
</video>
<video>
<src>puzzle.flv</src>
<title>Dangerous</title>
<book>assets/images/book_1.jpg</book>
</video>
<video>
<src>Animal_Face_Off_Anaconda_vs._Jaguar.flv</src>
<title>Dangerous</title>
<book>assets/images/book_1.jpg</book>
</video>
</videolist>

Notes:

Your Icon images and FLV files keep in this format

Output:

Flex, Flash and Web design

Tuesday, March 29, 2011

Server side connection in flex using php

Wednesday, March 23, 2011

Upload File From Flex to PHP

Monday, February 28, 2011

HTML Loder in Flex Air Application

Thursday, September 23, 2010

Dynamically loading data in Data Grid (Flex)

Thursday, August 26, 2010

HTTP Service (Flex)

Monday, August 23, 2010

Image Drag (Flex)

Thursday, August 19, 2010

Video player(Flex)

Blog Archive

Link List