Tuesday, October 6, 2009

To create a simple website in Flex

To create a simple website in Flex. In this tutorial we will learn to create a four page website.

Step 1: Make New Project :

Create a new project in flex from menu File-->New.
Flex website

  • Give name of project website or whatever you want.

  • Choose application type as web application.

  • Change the location of project if you want to save it other than default location.

  • Click finish.



  •  Step 2: Create workspace :



  • Create a folder images inside src folder by right clicking on src folder and selecting New->Folder.

  • Open the askmeflash.mxml.

  • Switch to design mode by clicking design button if already not selected .


  • Flex Website 
     
     
     

    Step 3: Create states


  • Open STATES pannel Right click on base state which is already there.

  • Select New State. New state window appears . Enter the name and press ok .

  • Similarly create 3 more states and name them accourdingly.


  • States Flex
     
     
    Step4: Create base template :

    Base state flex

  • To create Header of website .Select the base state and place the image component and give source as logoimage. In this case we have placed askmeflash.com logo.

  • Below logo we want to display our flex website page links. So we placed an Hbox below logo and placed link buttons inside it. Change the labels of buttons to page names in our case its Articles,Contact,Questions,Tutorials.

  • In footer we have placed a Hbox and placed Text inside to display copyright information of our Flex Website.

    Step5: Add content to pages or states

    Flex Website

  • To add content to articles page . Select the articles state.

  • Add canvas container to the empty area below links.

  • Now we can add any design elements like Label ,Image Text etc to canvas component.

  • Similarly select each state and add content to it .

    Step6: Link buttons to states

  • Select articles button and Switch to source view by clicking Source button

  • Now add the click event to link button tag and set click="currentState='articles'"
    Here articles is state name . Now do this for all the buttons .





  •  
    Now you can view Your simple website......
     
     
     

    Thursday, October 1, 2009

    how to avoid security problem while using crossdomain in flex

    when u use crossdomain.xml fill while usimg flash and flex domain.. you have possibility to face security error in flex side...on that time use the following code in ur init() method....

      Security.allowDomain("*");
      Security.loadPolicyFile("https://play2beatme.com/crossdomain.xml");

    and dont forget to import package for that security :import flash.system.Security;

    i hope this will help u.........

    How to reduce the size of SWF file in flex

    you are using  flex and you dont know how to reduce the size of the swf file?..here is the solution for that problem ..

    Using RSL in your Project - Runtime Shared Libraries:- Its a flex framework library which contains files required during runtime of flex application. The advantage of RSL is that it’s downloaded once only. RSL simply reduces the file size by approximately 500kb. Implementing RSL is very easy :

    GOTO Project -> Properties -> Flex Build Path -> Library Path and select "Runtime Shared Library (RSL)" from the "Framework linkage" combobox.
    Press OK and you are done. Now application compiles and creates a framework (swz) file along with swf file looks like framework_3.2.0.3958.swz.

    Now you must copy this file to your webserver along with your swf file from where it can be downloaded.
    One most important thing is that you must have swz file extension added to your webserver. So that it can be accessed using url. Check that by using your website paths to framework if it can be saved to your disk then its fine else get it fixed first from you web administrator.


    RSL is not a only solution for reduce the size , lot of ways available for further details read the links...

    http://www.cftips.net/post.cfm/reduce-flex-3-swf-size-by-using-rsl
    http://askmeflash.com/article_m.php?p=article&id=9
    http://forums.adobe.com/message/2235813
    http://labs.adobe.com/wiki/index.php/Flex_3:Feature_Introductions:Flex_3_RSLs