header
ask question
Click here to ask Question Now Its free No registration required. Flash, Flex, Flash Media Server, ActionScript,Adobe Air. Most questions receive a response in an hour.

How to create website in Flex -Tutorial My first Flex website
Posted By : Redni | Posted At: 11/12/2009 1:27:53 PM



Summary:Tutorial to create a simple website in Flex. In this tutorial we will learn to create a four page website.
Requirements: Flex installed
Project Source files :Tutorial to create website in flex.zip

Step 1: Make New Project :

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

  • Give name of project askmeflash 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

    Note:
  • Anything Placed on base state will appear in all child states . This means we will be using it as base template which will contain header and footer of our first flex website.
  • While editing Base state remember always to first select it. Else you will be modifying it for some other page/state.

  • 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 .







  • Members Login

    Email  
    Password
    Forgot Password





    This website focus on: Flash | Flex | FMS | RED5 | WOWZA | Flash Media Server | Adobe AIR | ActionScript,Flash Solutions | Flash Question | Flash Answers | Flash Developers | Flash Problem, Flash Help, Flash bugs, Flash workaround | Flash Blog | Flex Question Answers | Flash Forum | Flex Development | Actionscript development | Flash development | Adobe AIR development
    Copyright © 2008 AskMeFlash.com. All rights reserved. Privacy Policy | Terms & Conditions