How to Remedy Flex Error #2148

Posted by Brett Widmann on Mar 6, 2010 in Flash Builder, Flex 3 | 22 comments

One of the most common (and least favorite) errors I see classmates encounter when they initially start out using Adobe Flex technologies is error #2148. Here is the latest run-time error read out I receive:

SecurityError: Error #2148: SWF file file:///C:/Documents and Settings/Brett/Adobe Flash Builder Beta 2/Hello World Flex4/bin-debug/main.swf cannot access local resource file:///C:/Documents and Settings/Brett/Adobe Flash Builder Beta 2/Hello World Flex4/bin-debug/textLayout_4.0.0.10485.swf. Only local-with-filesystem and trusted local SWF files may access local resources.

From the looks of it, that’s a lot to take in. To simplify, what’s happening is that when the application is compiled or tested, it is being accessed by the bin folder, which is a special directory in this instance. One of the first things I do is I access the Global Security Settings Panel to make sure that I have added my work folders to the Always Trust list.

Adobe Flash Player Global Security Settings How to Remedy Flex Error #2148

My Adobe Flash Player Global Security Settings Panel

You’ll notice that both my Flex 3 and Flash Builder workspaces have been added to the list. You can add yours by selecting the appropriate option under the Edit locations… dropdown menu.

An On the Fly Alternative

If you are looking for an on the fly, or project specific alternative to solving this issue is to add the argument -use-network=false to the compiler properties. This can be done by going under Project > Properties > Flex Compiler

Flex Compiler Properties with argument addition highlighted

I usually don’t recommend this latter option, but if for some reason security settings are really tight on your development machine and you cannot get the previous method to work, this will result in a quick to your problem.

Comments and questions are always welcome.

Happy coding!

How to Create a Hello World Application in Flash Builder

Posted by Brett Widmann on Mar 6, 2010 in Flash Builder | 0 comments

This tutorial is very similar to my previous post on the same concept in Flex 3, except I am going to spend a little more time highlighting some of the key differences in Flash Builder and its predecessor Flex 3.

Initial Observations

One of the first things you’ll notice visually is the new default styling Flash Builder brings to the table. The default styling is not only a more fresh approach, but more appealing than Flex 2 and 3. The buttons are more polished and refined, and the overall styling is much slicker. Also, no more default blue background! The screenshot below is the code from my Flash Builder project. You can download the source files here.

The Code

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx"
width="436" height="248" creationComplete="mainFunction()">
<fx:Script>
<![CDATA[
import mx.controls.Alert;
// main function that fires when creation is complete
/* adds event listener to the button with the id "hello2"
* that listens for a mouseclick event and designates
* a function to be called when the mouse is clicked. */
private function mainFunction():void
{
this.hello2.addEventListener(MouseEvent.CLICK, helloFunction);
}
//function that is fired on click
private function helloFunction():void
{
Alert.show(‘Hello World!’, ‘Message 2′);
}
]]>
</fx:Script>
<!–Hello World Example 1 using inline MXML click events –>
<s:Label y="30" text="Hello World Example 1" color="#000000"
fontWeight="bold" horizontalCenter="2"/>
<s:Button y="50" label="Hello World 1"
click="Alert.show(‘Hello World!’, ‘Message’)"
id="hello1" color="#000000" horizontalCenter="1"/>
<!– Hello World Example 2 using event handlers in AS3 –>
<s:Label y="96" text="Hello World Example 2" color="#000000"
fontWeight="bold" horizontalCenter="2"/>
<s:Button y="125" label="Hello World 2"
id="hello2" color="#000000" horizontalCenter="1"/>
</s:Application>

You’ll notice that much of the code is very similar to Flex 3, if not the same. The only difference is that the mx namespace has been replaced with an s or an fx and that there are more XML namespace declarations in the Application tag. The neat thing with beta 2 of Flash Builder is the fact that you can still use the mx namespace, but Flash Builder kindly suggests to transition to the Spark library by stating:

I think that by going this route Adobe makes it easier for previous Flex users to migrate and become more comfortable with some of the new changes on older components within the platform.

As always, comments and questions are always welcome.

Happy coding!

How to Create a Hello World Application in Adobe Flex 3

Posted by Brett Widmann on Mar 6, 2010 in Flex 3 | 0 comments

What is Flex?

Adobe Flex is a powerful and user friendly platform for developing and deploying rich internet applications (RIAs) for Adobe’s overarching Flash platform. One of the strengths of Flex is its ability to integrate with many web services such as ColdFusion, J2EE, and LiveCycle Data Services. For more information, please visit Adobe’s Flex 3 site. If you have any questions about Flex, please feel free to contact me as I would like to focus mainly on the code for the Hello World application in this post.

Creating a Hello World Application

As you can see, there are actually two examples of a basic Hello World application in the above Flex project. That’s because I created the example using two different approaches of how Flex handles events within code. Below is a screenshot for the source code. You can download the source here.

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"
width="436" height="248" creationComplete="mainFunction()">
<mx:Script>
<![CDATA[
import mx.controls.Alert;
//main function to run at application startup
/* adds event listener to the 'hello2' button
* that listens for a user mouseclick. */
private function mainFunction(): void
{
this.hello2.addEventListener(MouseEvent.CLICK, helloFunction);
}
//event function that fires an alert window on click
private function helloFunction(): void
{
Alert.show('Hello World!', 'Message 2');
}
]]>
</mx:Script>
<!– Hello World Example 1 utilizing in line MXML click events –>
<mx:Label y="36" text="Hello World Example 1" color="#FFFFFF"
fontWeight="bold" horizontalCenter="0"/>
<mx:Button y="62" label="Hello World 1"
click="Alert.show(‘Hello World!’, ‘Message’)"
id="hello1" color="#000000" horizontalCenter="0"/>
<!– Hello World Example 2 using event handlers in AS3 –>
<mx:Button y="125" label="Hello World 2"
id="hello2" horizontalCenter="0"/>
<mx:Label y="99" text="Hello World Example 2" color="#FFFFFF"
fontWeight="bold" horizontalCenter="0"/>
</mx:Application>

EDIT: For some reason, the plugin I use adds an odd string in the helloFunction() Alert text. Ignore the string of text http://brettwidmann.com.nyud.net/2010/03/ as this could be a conflict with my CDN.

The most important concepts to understand in this example is the relationship between Flex’s MXML markup and ActionScript 3.0. As you can see, the first example fires an Alert window event using the click attribute, which also contains the formatting for the window. The second example demonstrates how one would code the same thing using AS3 event handlers. You’ll notice the second approach is more verbose than the first, but keeps MXML and AS3 separate from each other.

Finally, notice that in the Application tag, I have the creationComplete attribute firing a function called “mainFunction”. The purpose of this function is to create the event listener on the second button, so that when the button is clicked, the listener tells the button to fire the function called “helloFunction”.

If you have any questions or comments, please feel free to leave them on here.

EDIT: For a Flash Builder version of this post, click here.

Page 3 of 31 23