Flex Examples
In a previous entry, “Downloading and installing Flex SDK builds from opensource.adobe.com”, we saw how to download and install nightly builds of the Flex 3 SDK into Flex Builder 3.
Setting up the beta Flex 4 SDK has a couple little “gotchas” which can be a little tricky.
- Download the latest Flex 4 SDK nightly build from opensource.adobe.com and extract the files in the .ZIP archive to your hard drive.
- Follow steps 4 through 6 in the “Downloading and installing Flex SDK builds from opensource.adobe.com” entry to add the Flex SDK build to Flex Builder.
- Create a new Flex project in Flex Builder 3.
- Select Project > Properties in Flex Builder’s main menu to launch the Project Properties dialog box. Select Flex Compiler from the left menu, click the Use a specific SDK radio button, and select the Flex 4 SDK you added in the previous step.
- In the HTML wrapper section of the Flex Compiler settings dialog, set the required Flash Player version to 10.0.0 (see Figure 1). Click OK to close this dialog box.
Figure 1. Flex Builder Project Properties dialog box.
If you forget to change the Flash Player detection to Flash Player 10, you may see the following compiler errors in your Flex Builder Problems tab:
1046: Type was not found or was not a compile-time constant: ContentElement.
1046: Type was not found or was not a compile-time constant: ElementFormat.
1046: Type was not found or was not a compile-time constant: FontMetrics.
1046: Type was not found or was not a compile-time constant: GroupElement.
1046: Type was not found or was not a compile-time constant: TextElement.
1046: Type was not found or was not a compile-time constant: TextLine.
If you haven’t already installed the Flash Player 10 beta yet, you can find the various installers in the downloaded SDK’s /runtimes/player/10/{OS}/ directory.
Now that you have the Flex 4 SDK and Flash Player 10 installed, now it’s time to write a simple test file using the latest Flex SDK.
Full code after the jump.
<?xml version="1.0" encoding="utf-8"?> <!-- http://blog.flexexamples.com/2008/08/02/using-the-beta-gumbo-sdk-in-flex-builder-3/ --> <s:Application name="Gumbo_SDK_test" xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" xmlns:mx="library://ns.adobe.com/flex/halo"> <s:Group id="group" horizontalCenter="0" verticalCenter="0"> <s:Rect id="rect" width="120" height="60"> <s:fill> <s:SolidColor color="red" alpha="0.2" /> </s:fill> <s:stroke> <s:SolidColorStroke color="black" weight="4" /> </s:stroke> </s:Rect> <s:RichText id="textGraphic" color="#000000" fontFamily="Arial" fontWeight="bold" horizontalCenter="0" verticalCenter="0"> <s:content>{Capabilities.version}</s:content> </s:RichText> </s:Group> <mx:Label text="I'm a Halo Label component!" /> </s:Application>
View source is enabled in the following example.
Peter deHaan
Peter deHaan currently works for Adobe on the Flex SDK QA team. While not working on Flex, Flash, and ColdFusion applications, Peter enjoys making up bios and writing in 3rd person. Peter's rarely updated blog can be found at blogs.adobe.com/pdehaan/, actionscriptexamples.com, airexamples.com, and coldfusionexamples.com.
Share
Thanks~!
After, we changer to flash player 10, I’m wondering why it is asking to install flash player 9.
Would you want to tell me why this happened?
Thanks, just had the problem with the Flash Player Detection and compiler errors.
Am working with Gumbo and getting this error “An unknown item is declared as the root of your MXML document. Switch to source mode to correct it”
The application runs fine but i cannot use the designer.
Am also showing this warning:
Design mode: Cannot load text_model.swc (reason: ERROR: Load Verify). It may require classes (such as Adobe AIR components) that are not supported by design mode.
Does anyone have any idea what it is?
hi simon ,
even i am getting the same error , the application is running fine with Gumbo SDK but it is unable to open in the Design mode , can anyone help me out .
and i’m getting the same error ((((
I get the same error in Flex Builder 3.0.1 also (“An unknown item is declared as the root of your MXML document. Switch to source mode to correct it.”)
Can one of you file this in the Flex Bugbase, http://bugs.adobe.com/flex/, and post the bug number here so a few of us can vote on it.
Thanks,
Peter
Thanks for the great info, as always! Does anyone know if the latest SDK builds fix the issue with the FileUpload, where it had a malformed post that caused this error on Tomcat’s error log: “Multipart: final boundary missing”?
Alex C,
I’m not aware of that specific bug, but if it is FileReference related, it would be a Flash Player issue, not a Flex SDK issue.
If the problem still occurs with the latest public version of Flash Player 10 beta, can you file a bug at http://bugs.adobe.com/flashplayer/ if a bug isn’t already filed?
Thanks,
Peter
PS: if you post the bug number here, a few of us can vote on the issue.
Hi, peterd. Thanks for your reply. Here’s the bug on the Flash bug site: https://bugs.adobe.com/jira/browse/FP-292
However, it’s marked as “unresolved” and doesn’t seem to be a high priority. A lot of people have run into the issue; the only solution on an Apache/Tomcat server is to turn off the mod_security on the app — which then opens you up to attacks.
I posted about it on the Flex forum today, where you can view the full details of the problem and its insecure solution: http://www.adobe.com/cfusion/webforums/forum/messageview.cfm?catid=585&threadid=1387645
BTW, I’m using Flash 10 beta on my system and the problem occurs with that as well.
If everyone could vote on the Flash bug page here, we could see some faster resolution to the issue discussed above: https://bugs.adobe.com/jira/browse/FP-292
Thanks :-)
Hi Peter,
I’m trying to use the FileReference API in FB3 with new Gumbo, but I don’t able!!
I’m looking for the solution in several forums but there isn’t anything about this problem.
Maybe my problem is stupid, but have you any suggests for me?
P.S.
I have Flex Builder 3 with SDK 4.0.0.3699
and Flash Player 10.
Alex.B,
Good timing! I just posted an example of FileReference in Gumbo the other day in the comments. Check out “Displaying XML data in a DataGrid”.
And remember to change your SDK version to 4.0.0.3699, and set your Flash Player detection version to 10.0.0.
Peter
Hey there, thanks for all the info. I’ve got an issue getting the example to compile and I’ve followed all instructions.
I’ve got FP10debug version installed, SDK 4.0.0.3827, and compiler settings for this set to the above screenshot. Under Flex build path/Library path, Flex4 is there with all the swcs.
Unfortunatley Flex Builder flags an error for this line”
<mx:Label text=”I’m a Halo Label component!” />
Could not resolve <mx:Label> to a component implementation.
Any ideas please? Thanks
GrayP,
The example is probably just out of date with the API naming changes.
Try this instead:
<FxApplication xmlns="http://ns.adobe.com/mxml/2009" xmlns:mx="http://ns.adobe.com/mxml/2009"> ... </FxApplication>Peter
Hi Peter,
Thanks for the reply, unfortunately that’s not it. I tried on a different machine over the weekend but got the same issue. Am I missing out something?? All I’m doing is:-
1. Download & install gumbo sdk.
2. Create new project, under Project Properties>Flex Compiler, set SDK to Gumbo, set target Flash player = 10.
3. That should be it. However I get the error message I mentioned above, also using Adobe’s test script at the bottom of this page:-
http://opensource.adobe.com/wiki/display/flexsdk/Gumbo+Application?showComments=false
I also get a similar problem,
Could not resolve to a component implementation.
Seems to be an issue with the mx namespace, after xmlns:mx=”library:adobe/flex/halo”
I’ve tried this on OSX and WinXP, same result. I have also written a non-MXML application that uses SDK 4.0 in order to try out the new Flash 10 features, and that is fine, no problem.
I find it odd I seem to be the only one with this issue :-(
Aah, I have just come across this post:
http://blog.simb.net/2008/10/13/gumbo-namespace-changes-revisited/
The small code snippet there has a mix of Halo and Gumbo buttons, and compiles fine for me. Perhaps my Gumbo build – 4.0.0.3827 – is newer, and contains this change to namespaces…?
GrayP,
Correct, the
xmlns:mx="library:adobe/flex/halois old and would require and older Flex Gumbo SDK to compile. If you are using a recent Flex Gumbo SDK, you’d either need to import the 2009 namespace twice (once with the “mx” prefix), or else just use <Label/> instead of <mx:Label/>.The example on the opensource.adobe.com site is old and should be corrected for the latest Flex Gumbo SDK.
Peter
Thanks for clearing that up Peter.
Cheers.
GrayP,
I also updated the example code above (inline, I didn’t republish ZIPs and SWFs), so hopefully that will help.
After re-reading the example, it is important to note that with the latest Flex Gumbo SDK, you do not need to import the “mx” namespace to use the Halo components. You can use the default namespace and use the Halo Label control by typing <Label/>. If you want to use the “mx” namespace for any reason (you just like the way it looks), you can add the mx namespace and use the same namespace URL (http://ns.adobe.com/mxml/2009 — see my previous comment for an example), but the 2009 namespace contains both the Gumbo and Halo components.
Not sure if that made it any clearer, but yeah. Basically, both of these should work and just depends on your personal preference.
Default 2009 namespace:
Default 2009 namespace and mx namespace:
Peter
Peter Thanks Yet Again!
Anyone new to the world of flex who visits this page follow the instructions, its easy and you will be happy. I didn’t realise how easy and important it is to be updating the sdk’s.
unloadAndStop() and FP10….
….SAVED MY LIFE. TY!
Now we can build multiple swf based apps easily, without the nightmare that was FP9 and AS3 combo not garbaging the unloaded swf.
I’m like so happy i want to kill myself right now. This is ecstacy!
Hi.
After reading through the comments above and trying out various things I too still get the error:
‘This component is based on FxApplication, which is not a visual component. Switch to source mode to edit it’
I am using Flex Builder 3.0.194161 and Flex 4 SDK 4.0.0.4025. All I want to do is to use DESIGN view. Any suggestions?
Thanks
Barry.
If you want to use Flex 4 SDK with DESIGN mode ,you should update your Flex Builder to 3.2.
For instructions on upgrading your Flex Builder from 3.0.x to 3.0.2 (with Flex SDK 3.2), check out the following post: “Upgrading to Flex Builder 3.0.2″
Peter
Hello,
I have installed gumbo and now the design mode is inactiv in flex
Have you any idea about this trouble and how to repear it?
Best Regards
I also just installed Gumbo for the first time. Flex 3.0.2 Dec 24 nightly SDK 4.0 and also tried the milestone release Aug 27.
Tried it on two different computers, same problem, no design view with the new namespace.
I’m guessing Design view does not work at all, can someone confirm please.
Thanks
Dear Peter,
From last nigth for about 4-5 hours i spend in working FileReference_load_test in your example,
i upgraded to flex 3.02 version having flex_sdk_4.0.0.4845 and flash player is set to 10.0.0
but i am not at all able to compile, I get the same error in Flex Builder 3.0.2 also (”An unknown item is declared as the root of your MXML document. Switch to source mode to correct it.”)
I read all your comments could not solve it, i am very newbie and using your site to learn a lot, thanks a lot for this amazing help over blogs.
Can you please help me in this issue, i am very basic coder. Just now started learning.
My need is to browse the jpg file preview it and add it.
http://www.mafunet.com/crop/ i saw the above example but there is no souce code :-)
i need to crop the image exactly to the same size and save it before any one uploads to the server
I’m curious why, in all these examples, both the default and mx namespaces are declared with the same value… There’s no reason to use 2 that I can think of, personally I’ve always just used the default. The first thing I’ve always done when creating a new mxml component is change <mx:Component xmlns:mx=”http://www.adobe.com/2006/mxml” > to <Component xmlns=”http://www.adobe.com/2006/mxml” /> just for the sake of saving keystrokes.
I guess my point is that, when, using the example above with both namespaces,
<FxButton label=”Gumbo Button”/>
<mx:Button label=”Halo Button”/>
would be exactly the same as:
<mx:FxButton label=”Gumbo Button”/>
<Button label=”Halo Button”/>
what’s the point in using both? I guess the fact that the majority of the discussion in this topic is pertaining to the design view, which I personally have never used, may be in some way relevant. However, as far as straight coding is concerned I’d recommend just using one namespace or the other, just to keep yourself sane.
Justin Buser,
In this example there is no reason why you would need to declare two namespaces which which resolve to the same URL (unless you explicitly wanted to mx: prefix all your Halo controls, for some reason).
But the SDK recently underwent a big rename (see the “Dropping the Fx Prefix” page on the opensource.adobe.com site for more details), so all these old Gumbo examples will ultimately be rewritten so they’ll compile with the latest nightly Flex Gumbo SDKs).
Peter
How to upgrade from a nightly builder version to latest nightly builder version?
dev.my,
You can download nightly versions of the Flex 3 SDK and Flex 4 SDK from the Adobe Open Source site at http://opensource.adobe.com/wiki/display/flexsdk/Download+Flex+3 and http://opensource.adobe.com/wiki/display/flexsdk/Download+Flex+4.
You can download the latest trial version of Flash Builder 4 (formerly Flex Builder) from the Adobe Labs site at http://labs.adobe.com/technologies/flashbuilder4/, although nightly versions of Builder are not available. And, if you have a valid Flex Builder 3 license, you can watch http://www.adobe.com/go/flashbuilderextension to request a serial number to extend the Flash Builder 4 trial period.
Peter
hey, i m also facing some problems stated by some of you,
My problem is,
Could not resolve to a component implementation.
Please help me
I m using Flex gumbo sdk 4.0.0.7219 and flash player 10.
@Rashmi,
I updated the example above to work in newer Flex 4 builds. I tested it w/ Flex SDK 4.0.0.10008, but it should work on 4.0.0.7219 also.
Peter
i tried ur code but i m still facing same problem.
and error is at “xmlns:mx=”http://ns.adobe.com/mxml/2009″”
For this only i m getting error as,
Could not resolve “Applictaion” to a component implementation.
Are there any other settings for project properties?
@Rashmi,
That line isn’t in my example. It may have been in an earlier, obsolete comment. What happens when you run this code using Flex 4.0.0.10008 or later?
Peter
I am creating bar chart In flex 3 having Y axis value “<1 yr” in xml file but it is not displating whereas “>1 yr” is comming perfectly.
Can anybody face this problem.
Please help me out.
Thanks
Hi , I am able to use flex 4 sdk in flex 3. but there is no intellisense. It happens?