Adobe Flex Training

How to install flex builder 3 on windows

2009-06-26T20:05:00.000-07:00

In this post, We are going to learn how to install flex builder 3 on windows. When we download Flex Builder 3 from Adobe, we find there are four versions currently available, two for windows and two for the Mac. For each operating system there are two versions, one known as standalone installer and other as a plug in installer.

We are going to demonstrate the use of the stand alone installer here. But if you’re already Eclipse user, you might instead use the plug in installer. Now in Flex Builder 2, there was only single installer executable and you make the selection of standalone versus plug in installation, During the installation process. In Flex Builder 3 there is actually two separate installers, and you want to make sure to start with the right one. Now how do you decide which one we want?

While, if you are developer who is already using the Eclipse for other purposes such as JAVA development, you might decide to use the plug in installer. So that you install Flex Builder 3 on top of the existing Eclipse installation. This allows you to keep all your existing plug ins and then simply lay Flex Builder 3 on top of the existing environment.

If your new to the Eclipse though, you probably better off using the stand alone installer, which include a copy of Eclipse. Even if you’re using the standalone installer though, it is important to know that you installing not for the Flex Builder Plug ins but also the complete copy of the Eclipse. And you free then to go other plug ins for other platforms. For instance, ColdFusion developers some times like to go CF Eclipse of free plug in for coldFusion application development. Even if the standalone installer, your still running the basic Eclipse workbench, that means you can go and get the additional plug ins and lay them in on top of Flex Builder installation.

So lets get started, We have downloaded the Flex Builder 3 windows installer and placed on desktop.

To get started, double click and start the installation process.

It takes few moments for the installer to unpack all of the files.

But once it’s done, we’ll be ready to do the installation. We can install the windows version of the Flex Builder3 on windows 2000/Xp/Vista.It is important to make sure we have enough memory. It is recommended minimum of 1GB of RAM on windows machine. And if we also running databases or other heavy duty memory potencive applications, The probably better off the 2 GB of RAM if we can get it.

When the installer finished the unpacking all files on harddisk, you first presented with the informational screen and asks what language we want to use for the installation.

We leave it to the default selection of English and click OK.
After few moments,We see the introduction screen.

Make sure we quit all the programs before we continue with the installation. In particular, we make sure close any browser windows such as Firefox ,or Internet Explorer. As part of this installation, we will be installing the ActiveX and Plug in versions of the Flash Player. And we need to make sure the browser windows are completely closed before we can continue with that process.

We click the next buttion, on the screen, if we accept the Terms of the license agreements. Click the “I accept“ button and click NEXT. And then indicates where we want to install Flex Builder3.

We always use the default settings of Program Files\ Adobe\Flex Builder 3. But we can put Flex 3 anywhere on disk.

On the next screen, we’re asked what the additional soft ware tools to install. We always wanted to include the flash Player. The version of the Flash Player in going to be install this point is the debug Flash Player 9 and this version Flash Player is critical to debugging and otherwise testing our applications. There are also tools additional available called ColdFusion extensions for FlexBuilder. The ColdFusion extensions for FlexBuilder are valuable plug in that can be used for ColdFusion developers. The extension includes RDS capability, Remote Development Services. That allows you to connect ColdFusion servers and get data structure information and generate valuable code.The JSEclipse installation is for JavaScript developers. The JSEclipse plug in is a special use for developers to going to build AIR or desktop applications. And incorporating JavaScript based functionality. We don’t need either of these installations and infact if we don’t install this point it’s okay. Because you will be able to install them later on.

I am a ColdFusion Developers works FlexDevelopers, so I like to install ColdFusion extension for Flex Builder during the initial installation. I also some time do JavaScript application development and it doesn’t hurt have JSEclipse install, so I go ahead and select them as well and click Next.

After few moments we see a summary of the installation selections, and then We click the Install button to complete the installation.

The installation takes a few minutes to run but once it is installed, we then able to start up flexbuilder 3 and start building applications.

When the installation complete, we see the “Congratualations” message. Adobe Flex Builder 3 has been installed successfully and this point we are ready to get started with the applications.

Flex Resources

2009-06-24T08:56:00.000-07:00

Certain flex resources will be valuable to you as you learn how to build applications using the Flex Frameworks. First the Adobe Developers Center. The Developer Center is location for adobe puts all the most impressive information about the Flex Application Development includes articles, tutorials, sample applications and so on.

A large part of the Flex Application Framework has been opensourced and the open source Home Page for this platform is the Flex.org. Here you can find the additional tutorials, information about all source of resources about Flex Application Developers, including information about how to built an applications with Cold Fusion, JAVA, .NET, PHP, RUBY and information about user groups that you can find your area so that is the introductory locate the world Flex Application Developers.

Flex Sample Applications

2009-06-23T12:01:00.000-07:00

To see the example of flex sample applications at work, you can go to couple of different locations.

All these applications includes full source codes, fully commented and they includes applications such as the Flex Store, The Flex Dashboard, and the Component Explorer.
You can find all of the sample applications at Adobe Flex 3 Component Explorer.

I’ll navigate to the browser now, and show you one of the application that component explorers.

The Adobe Flex 3 Component Explorer is an application that contains many other applications. Each of these applications demonstrate the use of one or more components of the Flex Framework.

For instance, this first application showsthe use of the “alert class”. The Alert Class knows how to produce the dialog box or windows and either displays a simple message or create a simple interactions. When you click on the buttons in the sample application, you see the interactive application network.

At the bottom of the screen of each application, you see full source code, you can select and copy any of the source code and try it in your own applications.



<?xml version="1.0"?>

  <!-- Simple example to demonstrate the Alert control. -->

  <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">

 <mx:Script>

  <![CDATA[

  import mx.controls.Alert;

  import mx.events.CloseEvent;

  

  // Event handler function uses a static method to show

  // a pop-up window with the title, message, and requested buttons. 

  private function clickHandler(event:Event):void {

  Alert.show("Do you want to save your changes?", "Save Changes", 3, this, alertClickHandler);

  }

  

  // Event handler function for displaying the selected Alert button.

  private function alertClickHandler(event:CloseEvent):void {

  if (event.detail==Alert.YES)

  status.text="You answered Yes";

  else

  status.text="You answered No";

  }

 // Event handler function changes the default Button labels and sets the

  // Button widths. If you later use an Alert with the default Buttons, 

  // you must reset these values.

  private function secondClickHandler(event:Event):void {

  Alert.buttonWidth = 100;

  Alert.yesLabel = "Magenta";

  Alert.noLabel = "Blue";

  Alert.cancelLabel = "Green";

 Alert.show("Select a color:","Color Selection",1|2|8,this);

  

  // Set the labels back to normal:

  Alert.yesLabel = "Yes";

  Alert.noLabel = "No"; 

  }

  ]]>

  </mx:Script>

 <mx:Panel title="Alert Control Example" width="75%" horizontalAlign="center" paddingTop="10">

  <mx:Text width="100%" color="blue" textAlign="center"

  text="Click the button below to display a simple Alert window."/>

  <mx:Button label="Click Me" click="Alert.show('Hello World!', 'Message');"/>

 <mx:Text width="100%" color="blue" textAlign="center"

  text="Click the button below to display an Alert window and capture the button pressed by the user."/>

  <mx:Button label="Click Me" click="clickHandler(event);"/>

  <mx:Label id="status" fontWeight="bold"/>

 <mx:Text width="100%" color="blue" textAlign="center"

  text="Click the button below to display an Alert window that uses custom Button labels."/>

  <mx:Button label="Click Me" click="secondClickHandler(event);"/>

  </mx:Panel>

</mx:Application>

Create a Flex Application with three steps?

2009-06-23T10:51:00.000-07:00

First you select the predefined visual components. Those are part of the Flex Class library also known as the Flex Framework. You then arrange those components into user interface.
You use styles and skins to customize the application appearance, if you have graphic designers involved in your application development process, they might create, what we call graphical skins, using Flash, Illustrator, or Fireworks.
You then add interactions, to the applications using Event Handling and ActionScript code, this allows you to react to user gestures, such as mouse actions, and the Keyboard.
You connect to data and communication services. You can use one of the services, that I described earlier, or you can use remote services, that are encapsulated in SOAP(Simple Object Access Protocol) or REST(Representational State Transfer) based web services.
5. And then, Finally when we put all the tools together you build and run the application.

What is Flex Application?

2009-06-23T10:39:00.000-07:00

So what exactly is Adobe Flex3?

A Flex Application delivered as a flash *.SWF file when it delivered to the web it wrapped in a generated HTML page, and when the same application is wrapped up and distributed for AIR deployment or in Desktop application, it’s generated down applications that can be installed locally on a windows, MAC or Linux based systems. Flex applications that delivered through the web browsers requires the flash player the client they require the most recent version of the flash player version 10.

Documents that are generated with Flash CS4, the most recent version of the Flash Development Environment. As a flash document, Flex Application gives you complete access to all Flash Tools, which might be used for working with the Flash Environment such as Drawing API and the ActionScript Programming Languages.

Flex Applications use ActionScript3, the most recent version of the ActionScript language and as such the compatible flash documents that might generate in the flash offering environment using ActionScript3.

What is Flex3?

2009-06-23T10:13:00.000-07:00

So what exactly is Adobe Flex3?

Flex is Adobe Platform developing and deploying Rich Internet Applications, and beginning with the Flex 3, It’s also a platform for developing and deploying desktop applications, That would be deploying using the Adobe Integrated Runtime (AIR), known as AIR.

Flex includes both free and commercial tools. The free tools are all parts of something called the Flex 3 SDK, a Software Development Kit. This is the set of tools, that you can download and deploy from the adobe and you can use them for free with out registering or license incurring costs. This SDK includes command line computers, the Flex class library, or the list of components, that are used to build the flex applications, and set of powerful debugging tools that you can use to debug and fine tune yours applications before you deliver them to the users.The commercial tools for Flex includes Flex Builders 3 IDE, That based on Eclipse workbench.

We are primarily using Flex Builder 3 to build Flex application to demonstrate, but all the applications that we develop, could also been built using the SDK, without incurring the licenses and cost.

There are also some server based products that are available from the Adobe, That have strong Flex integration tools, Life Cycle Data Services 2.5, is a java based application designed to run on top of the Java Enterprise Edition or J2EE servers.We can run LifeCycle Data Services on the top of the Web Spehere, Web Logic, JBoss and others J2EE Server Products, The BlazeDS, this is completely free Java based server products, that incorporates many popular features of LifeCycle Data Services, but for free. You can also use Cold Fusion 8 with Flex. Cold Fusion has powerful Flex integration features and we will be learning these features later during this training.

[flexcoders] Re: Fortify Scan on my Application

2009-04-04T14:38:00.001-07:00

From: flexcoders@yahoogro ups.com [mailto:flexcoders@yahoogro ups.com] On

Behalf Of Parkash
Sent: Monday, March 30, 2009 2:43 AM

To: flexcoders@yahoogro ups.com
Subject: [flexcoders] Fortify Scan on my Application.

Hello All,

I ran fortify scan on my application and getting the three hot issues on
history.js and historyFrame. html.

How can I eliminate the problems from these files?

Do I really need these files can I delete these files can any one tell me

the purpose of these files.

The hot issues are listed below.

Issue # 1:

ABSTRACT:

The method addHistoryEntry( ) in history.js sends unvalidated data to a web

browser on line 207, which can result in the browser executing malicious

code.

EXPLANATION:

Cross-site scripting (XSS) vulnerabilities occur when:

1. Data enters a web application through an untrusted source, most

frequently a web request or database.

2. The data is included in dynamic content that is sent to a web user

without being validated for malicious code.

The malicious content sent to the web browser often takes the form of a

segment of JavaScript, but may also include HTML, Flash or any other type of

code that the browser may execute. The variety of attacks based on XSS is

almost limitless, but they commonly include transmitting private data like

cookies or other session information to the attacker, redirecting the victim

to web content controlled by the attacker, or performing other malicious

operations on the user's machine under the guise of the vulnerable site.

Issue # 2:

ABSTRACT:

The method checkForUrlChange( ) in history.js sends unvalidated data to a web

browser on line 283, which can result in the browser executing malicious

code.

EXPLANATION:

Cross-site scripting (XSS) vulnerabilities occur when:

1. Data enters a web application through an untrusted source, most
frequently a web request or database.

2. The data is included in dynamic content that is sent to a web user
without being validated for malicious code.

The malicious content sent to the web browser often takes the form of a
segment of JavaScript, but may also include HTML, Flash or any other type of
code that the browser may execute. The variety of attacks based on XSS is
almost limitless, but they commonly include transmitting private data like
cookies or other session information to the attacker, redirecting the victim
to web content controlled by the attacker, or performing other malicious
operations on the user's machine under the guise of the vulnerable site.

Issue # 3:

ABSTRACT:

The method lambda() in history.js sends unvalidated data to a web browser on
line 509, which can result in the browser executing malicious code.

EXPLANATION:

Cross-site scripting (XSS) vulnerabilities occur when:

1. Data enters a web application through an untrusted source, most
frequently a web request or database.

2. The data is included in dynamic content that is sent to a web user
without being validated for malicious code.
The malicious content sent to the web browser often takes the form of a
segment of JavaScript, but may also include HTML, Flash or any other type of
code that the browser may execute. The variety of attacks based on XSS is
almost limitless, but they commonly include transmitting private data like
cookies or other session information to the attacker, redirecting the victim
to web content controlled by the attacker, or performing other malicious
operations on the user's machine under the guise of the vulnerable site.

Issue # 4:

ABSTRACT:

The method ~file_function( ) in historyFrame. html sends unvalidated data to a
web browser on line 25, which can result in the browser executing malicious
code.

EXPLANATION:
Cross-site scripting (XSS) vulnerabilities occur when:

1. Data enters a web application through an untrusted source, most
frequently a web request or database.

2. The data is included in dynamic content that is sent to a web user
without being validated for malicious code.

In this case the data is sent at write() in historyFrame. html at line 25.

The malicious content sent to the web browser often takes the form of a
segment of JavaScript, but may also include HTML, Flash or any other type of
code that the browser may execute. The variety of attacks based on XSS is
almost limitless, but they commonly include transmitting private data like
cookies or other session information to the attacker, redirecting the victim
to web content controlled by the attacker, or performing other malicious
operations on the user's machine under the guise of the vulnerable site.

Thanks

Parkash

[flexcoders] Re: Ruben's FlexBook component question

2009-04-04T14:25:00.000-07:00

On Tue, Mar 24, 2009 at 10:48 PM, Igor Costa <igorcosta@gmail. com> wrote:

Hi there Guy's

So, hard to ask something before hard searching across web. My question is simple, how many of you guys there tried and extended the Ruben's FlexBook Component since the releases source code?

I found a guy who added a couple of public methods but no one that made the size of book re sizable when the screen gets bigger or less.

I'm fighing agaist this little bug book component. And added some exra methods, doesnt any guys there who want to change your experience with this component with me?

Regards

--

------------ --------- -------

Igor Costa

www.igorcosta. com

www.igorcosta. org

[flexcoders] Re: Portable way to get hostname in AIR app?

2009-04-04T14:14:00.000-07:00

--- In flexcoders@yahoogro ups.com, "Gregor Kiddie" <gkiddie@... wrote:

We ended up having the shortcut have the url we were aiming at as a parameter.

Other solutions include always kicking off the AIR app from a web page (and passing the url as a parameter)

InvokeEvent is what you'll be interested for these things, along with the Flex API with dealing with AIR files.

Gk.

Gregor Kiddie

Senior Developer

INPS

[flexcoders] Re: FlexMDI controlling Tab navigation

2009-04-04T14:02:00.001-07:00

--- In flexcoders@yahoogro ups.com, "raja_s_patil" <kpr.rspatil@ ...> wrote:

hello,

I am in processing of evaluating Flex to be used for migrating our Desktop Delphi database applications to WEB. Till Date we found very positive features and have opinion that Flex is suiting our many requirements. Our existing application is composed of many forms and some them remain open simultaneously in a typical practical use of application. We came across FlexMDI and found that this satisfies this requirement but when we press tab key to navigate between controls in a form then it passes through all controls in that window and then it goes to captions buttons and then goes to next window.

We would like to restrict this tab navigation to same window and may be <CTRL-TAB to switch between different windows. How can we achieve this ? U can think of a typical desktop window behaviour simulation in flex.

Thanks and Best Regards

[flexcoders] Re: Context Menu Bug in FlashPlayer ?

2009-04-04T13:44:00.001-07:00

The code below causes both IE and Firefox to crash (haven't tried others). The problem seems to occure when removing an item from a custom context menu. It doesn't even debug, just crashes the browser.

If I add this one line:

menu.customItems. pop();

then the browser crashes. If I remove it, if functions as expected.

Please help.

Sample code below:

import mx.controls. Alert;
[Bindable] public var menu:ContextMenu;
[Bindable] public var blankMenu:ContextMe nu;

public function mouseOvr(event: MouseEvent) :void {
menu = new ContextMenu;
var addPop:ContextMenuI tem = new ContextMenuItem( "Do Something");
addPop.addEventList ener(ContextMenu Event.MENU_ ITEM_SELECT, newPop);
menu.customItems. push(addPop) ;
myButton.contextMen u = menu;
}
public function newPop (event:ContextMenuE vent):void {
Alert.show(" Hi");
}
public function mouseOt(event: MouseEvent) :void {
myButton.contextMen u = blankMenu;
menu.customItems. pop();
}
]]>

[flexcoders] Re: Flex on mobile devices

2009-04-04T13:27:00.000-07:00

Thanks, Alex. That helps. I've heard that Flash 10 should be available for most smart phones by next year (http://reviews. cnet.com/ 8301-13970_ 7-10164745- 78.html). However, technical difficulties are keeping the iPhone from getting Flash-enabled.

- Alex C

--- In flexcoders@yahoogro ups.com, Alex Harui <aharui@...> wrote:

>

> Roughly 0 handle Flex apps. Work is in progress for a Flash Player that can handle ActionScript 3 and work on a mobile device.

>

> There's supposedly a billion mobile devices that can run Flash apps designed for mobile.

>

> Adobe has every intention to get Flex apps running on mobile devices going forward. Smart companies will be planning for Flex on mobile in their futures even though numbers are zero now.

>

> Alex Harui

> Flex SDK Developer

> Adobe Systems Inc.<http://www.adobe. com/>

> Blog: http://blogs. adobe.com/ aharui

>

> From: flexcoders@yahoogro ups.com [mailto:flexcoders@yahoogro ups.com] On Behalf Of oneworld95

> Sent: Tuesday, March 31, 2009 9:29 AM

> To: flexcoders@yahoogro ups.com

> Subject: [flexcoders] Flex on mobile devices

>

>

> Roughly, what percentage of mobile devices today can handle Flex (Flash) apps? I need some hard numbers to convince my boss to use Flex for more projects. Thanks.

>

> - Alex C

>

[flexcoders] Flex Debug Problem

2009-04-04T09:48:00.000-07:00

I have imported an AIR project to Flex Builder 3.2.0, but I get this error:

Process terminated without establishing connection to debugger.

Command:

"/Applications/ Adobe Flex Builder 3/sdks/3.2.0/ bin/adl" -runtime "/Applications/ Adobe Flex Builder 3/sdks/3.2.0/ runtimes/ air/mac" "/Users/mac_ video/Documents/ Flex Builder 3/PSM Flash2/bin-debug/ psmflash- app.xml" "/Users/mac_ video/Documents/ Flex Builder 3/PSM Flash2/bin-debug"

Output from command:

initial content not found

I have changed the 2nd line of project specs with

<application xmlns="http://ns.adobe. com/air/applicat ion/1.5" >

but it doesn't work...

Anyone have an idea about that? Thank you very much, it's very important for me and for my work.

Getting started with Flex

2009-03-23T07:30:00.000-07:00

Getting started with Flex begins with downloading the Flex Builder 3 integrated development environment (IDE). You can do that for free by going to the Adobe website (http://adobe.com/flex) and clicking on the Try Flex Builder 3 link. It’s
a pretty big download, so while you are waiting you might want to know to get some inspiration regarding what you can do with Flex.

Here, I’m going to give an overview of the world of the Adobe Flex3 Application Development. I start with the description of what Adobe Flex 3 is it? Look at the development environment, and the various tools that Adobe defines for Flex Application Developers. We take a look at how to install and then how to use Flex Builder 3. The Integrated Development Environment(IDE), that builds around the Eclipse work bench. We take a look at how to use Flex Builder Design View, to build application in WYSIWYG(What-You-See-Is-What-You-Get).

We see the basic “Hello World..!” application and we look at now how application is built on the context of the Flex Builder Project would turn store in the workspace. We take a look at the anatomy of an application. What are the application files generated during the completion process and how to deploy those applications to over the web server for use by users.