Flash Builder Design view

Hi all,
I have also an issue when trying to view a component in the Flash Builder 4 Design View (running on Eclipse 3.5 SP-2).
The design view does not open and I get an error message. When I look into the Eclipse "Error Log" view I see the following stack trace and session data as shown below...
I appreciate any hint what is going wrong here...
Thanks!
Paul
java.lang.NullPointerException
at com.adobe.flexbuilder.mxml.editor.design.internal.MXMLDesignView4Commander.getDesignSurfa ce(MXMLDesignView4Commander.java:61)
at com.adobe.flexbuilder.mxml.editor.design.internal.MXMLDesignView4Commander.setFrameRate(M XMLDesignView4Commander.java:124)
at com.adobe.flexbuilder.designview.DesignViewPart$DesignShellListener.shellActivated(Design ViewPart.java:353)
at org.eclipse.swt.widgets.TypedListener.handleEvent(TypedListener.java:82)
at org.eclipse.swt.widgets.EventTable.sendEvent(EventTable.java:84)
at org.eclipse.swt.widgets.Widget.sendEvent(Widget.java:1003)
at org.eclipse.swt.widgets.Widget.sendEvent(Widget.java:1027)
at org.eclipse.swt.widgets.Widget.sendEvent(Widget.java:1008)
at org.eclipse.swt.widgets.Decorations.WM_ACTIVATE(Decorations.java:1615)
at org.eclipse.swt.widgets.Shell.WM_ACTIVATE(Shell.java:2086)
at org.eclipse.swt.widgets.Control.windowProc(Control.java:3943)
at org.eclipse.swt.widgets.Canvas.windowProc(Canvas.java:342)
at org.eclipse.swt.widgets.Decorations.windowProc(Decorations.java:1578)
at org.eclipse.swt.widgets.Shell.windowProc(Shell.java:2010)
at org.eclipse.swt.widgets.Display.windowProc(Display.java:4619)
at org.eclipse.swt.internal.win32.OS.MessageBoxW(Native Method)
at org.eclipse.swt.internal.win32.OS.MessageBox(OS.java:2892)
at org.eclipse.swt.widgets.MessageBox.open(MessageBox.java:207)
at com.adobe.flexbuilder.mxml.editor.design.MXMLDesignPart.startDesignView(MXMLDesignPart.ja va:208)
at com.adobe.flexbuilder.mxml.editor.design.MXMLDesignPart.<init>(MXMLDesignPart.java:68)
at com.adobe.flexbuilder.mxml.editor.design.MXMLDesignEditor.initializePlayer(MXMLDesignEdit or.java:1411)
at com.adobe.flexbuilder.mxml.editor.design.MXMLDesignEditor.initializeDesignView(MXMLDesign Editor.java:1576)
at com.adobe.flexbuilder.mxml.editor.design.MXMLDesignEditor.setFocus(MXMLDesignEditor.java: 1736)
at org.eclipse.ui.part.MultiPageEditorPart.setFocus(MultiPageEditorPart.java:1119)
at org.eclipse.ui.part.MultiPageEditorPart.setFocus(MultiPageEditorPart.java:1101)
at com.adobe.flexbuilder.mxml.editor.MXMLEditor.setFocusIfActive(MXMLEditor.java:674)
at com.adobe.flexbuilder.mxml.editor.MXMLEditor.activateDesignEditor(MXMLEditor.java:638)
at com.adobe.flexbuilder.mxml.editor.MXMLEditor.activateDesignEditor(MXMLEditor.java:621)
at com.adobe.flexbuilder.mxml.editor.MXMLEditor.pageChange(MXMLEditor.java:489)
at com.adobe.flexbuilder.editorcore.editor.CodeAndDesignEditor.setActivePage(CodeAndDesignEd itor.java:684)
at com.adobe.flexbuilder.mxml.editor.MXMLEditor.setActivePage(MXMLEditor.java:544)
at com.adobe.flexbuilder.editorcore.editor.CodeAndDesignEditor$1.clicked(CodeAndDesignEditor .java:454)
at com.adobe.flexide.editorcore.ui.controls.ButtonBar.clicked(ButtonBar.java:289)
at com.adobe.flexide.editorcore.ui.controls.AbstractButton.sendClickEvent(AbstractButton.jav a:41)
at com.adobe.flexide.editorcore.ui.controls.ToggleButton.handleChange(ToggleButton.java:79)
at com.adobe.flexide.editorcore.ui.controls.ToggleButton.mouseDown(ToggleButton.java:66)
at org.eclipse.swt.widgets.TypedListener.handleEvent(TypedListener.java:179)
at org.eclipse.swt.widgets.EventTable.sendEvent(EventTable.java:84)
at org.eclipse.swt.widgets.Widget.sendEvent(Widget.java:1003)
at org.eclipse.swt.widgets.Display.runDeferredEvents(Display.java:3910)
at org.eclipse.swt.widgets.Display.readAndDispatch(Display.java:3503)
at org.eclipse.ui.internal.Workbench.runEventLoop(Workbench.java:2405)
at org.eclipse.ui.internal.Workbench.runUI(Workbench.java:2369)
at org.eclipse.ui.internal.Workbench.access$4(Workbench.java:2221)
at org.eclipse.ui.internal.Workbench$5.run(Workbench.java:500)
at org.eclipse.core.databinding.observable.Realm.runWithDefault(Realm.java:332)
at org.eclipse.ui.internal.Workbench.createAndRunWorkbench(Workbench.java:493)
at org.eclipse.ui.PlatformUI.createAndRunWorkbench(PlatformUI.java:149)
at org.eclipse.ui.internal.ide.application.IDEApplication.start(IDEApplication.java:113)
at org.eclipse.equinox.internal.app.EclipseAppHandle.run(EclipseAppHandle.java:194)
at org.eclipse.core.runtime.internal.adaptor.EclipseAppLauncher.runApplication(EclipseAppLau ncher.java:110)
at org.eclipse.core.runtime.internal.adaptor.EclipseAppLauncher.start(EclipseAppLauncher.jav a:79)
at org.eclipse.core.runtime.adaptor.EclipseStarter.run(EclipseStarter.java:368)
at org.eclipse.core.runtime.adaptor.EclipseStarter.run(EclipseStarter.java:179)
at sun.reflect.NativeMethodAccessorImpl.invoke0(Native Method)
at sun.reflect.NativeMethodAccessorImpl.invoke(Unknown Source)
at sun.reflect.DelegatingMethodAccessorImpl.invoke(Unknown Source)
at java.lang.reflect.Method.invoke(Unknown Source)
at org.eclipse.equinox.launcher.Main.invokeFramework(Main.java:559)
at org.eclipse.equinox.launcher.Main.basicRun(Main.java:514)
at org.eclipse.equinox.launcher.Main.run(Main.java:1311)
at org.eclipse.equinox.launcher.Main.main(Main.java:1287)
Session Data:
eclipse.buildId=unknown
java.version=1.6.0_16
java.vendor=Sun Microsystems Inc.
BootLoader constants: OS=win32, ARCH=x86, WS=win32, NL=de_DE
Framework arguments: -product org.eclipse.epp.package.jee.product
Command-line arguments: -os win32 -ws win32 -arch x86 -product org.eclipse.epp.package.jee.product

I have the same problem, and can not get answer.
Today I try to use a standalone version, it‘s running good.
So, it may tell us that the problem may be only happen in the situation that using a plugin version FB4 and running on win 7.
If you just need flex and do not use j2ee, I suggest you using a standalone FB.

Similar Messages

Flash Builder - Design View - can't resize/move objects anymore.

So, I've downloaded the 60 day trial of Flash Builder 4. I've been working with it for about 2 days and everything has been going fine. However, for some unknown reason, my design view panel just suddenly stopped working properly. I see the components (and the gray outlines of my containers) I'm working with, but when I try to click on them, I do not get that blue resizing outline with the handles. I see the properties panel change when I click different components, but I get no outline. So, I can no longer resize in this view. I also can't move components/containers around. I can only click on them and watch the properties panel change. I do not believe I've hit any sort of option in the menus. I closed the application and started it up again with the same result. I even rebooted my machine and tried again. As of right now, this problem seems to be permanent. Any ideas? Thanks for your time.

I would recommend you post on the Flash Builder forum: http://forums.adobe.com/community/flash_builder

Custom Components and Properties in Flex Builder Design View

How do I create a custom component with custom properties
that renders well in Flex Builder design view?
This is a simple HelloWorld example of what I am trying
below. Here is the HelloWorld.mxml file:
<?xml version="1.0" encoding="utf-8"?>
<mx:Canvas xmlns:mx="
http://www.adobe.com/2006/mxml"
width="500" height="500">
<mx:Script><![CDATA[
[Bindable]
public var message:String;
]]></mx:Script>
<mx:Label x="100" y="100" text="{message}" />
</mx:Canvas>
And then when I use it in another mxml file, the design view
does not show the label with the 'Hello World' value - instead it
just shows {message} in design view where the label is located.
When I run it as a compiled app in flash, the 'Hello World' is
displayed correctly:
-- HelloWorldTest.mxml --
<?xml version="1.0" encoding="utf-8"?>
<mx:Canvas xmlns:mx="
http://www.adobe.com/2006/mxml"
xmlns:views="mypackage.*" width="500" height="500">
<views:SimpleLine message="Hello World."/>
</mx:Canvas>

design view does not do any variable assignments or function
evaluations, so you won't be able to see it even if you don't use a
custom component.

Flex Builder Design View programmatic skinning

I am writing programmatic skins, by extending
ProgrammaticSkin class. If i apply these skins to mx:Button, i can
see the skin in Flex Builder design view. But when i style my
custom component with programmatic skins, Flex Builder design view
does not show the skin, though the skin is applied when i run the
application. Is there a way for me to write my custom classes
(class Node extends UIComponent), and apply skins, so that i can
see the skins in Flex Builder design view.

Actually I found the answer to my question. You can find it
in my blog.
programmatic
skinning in Flex Builder Design view

Flash Builder Design Mode Bug Workaround (!!!)

I've been fighting this annoyance since FB4 came out, and while I still don't think that custom/embedded fonts in design view are fixed by this, I've been able to reproduce this "fix" (workaround) to get design view to show fonts/theme correctly under some very specific circumstances on two separate PCs.
If anyone from Adobe sees this I'd like to know whether this sounds familiar or is possibly logged as a bug already somewhere in JIRA.. if not I could probably do that as long as it won't be a wasted effort.
The problem:
You're using a Halo theme but certain CSS settings (specifically and possibly limited to FONTS) don't work properly in design view even though they work fine in Flash. Essentially this makes design view practically useless since choice of font family, size, and weight can effect component sizing if you aren't hard-coding component sizes (ugh)... ruining your efforts to use design view for UI design if your UI has any level of complexity (or uses absolute positioning at all).
The specific circumstances seem to be:
You're using the Halo theme (you have no special 'skinning' requirements and want Halo defaults w/only CSS customizations)
You've upgraded a Flex 3 project to Flex 4 SDK (not sure if this is needed to reproduce the issue)
Using a regular non-embedded font (embedded fonts still do crap out, but even this 'workaround' doesn't fix that problem)
You're using swc library files such as the Swiz lib, Mate, Flexlib, etc. (I think it's ANY swc, not specific to any one)
This may also only apply when using an "mx only" project (no Spark), since we're using Halo here
The two part fix (as far as I can tell you need BOTH before design view works correctly):
In .actionScriptProperties, add the following bolded line after the compiler tag like so:
</compiler>
<theme themeIsDefault="false" themeIsSDK="true" themeLocation="${SDK_THEMES_DIR}/frameworks/themes/Halo"/>
<applications>
(I think this may only apply to 'upgraded' projects, as the line does seem to be present in newly created FB4 Halo projects. My guess is that an "upgraded" project should have such a line added, but doesn't get it due to an oversight/bug.)
The somewhat painful, and definitely odd part. Remove all your SWC library files from /libs. Grab the source code for the libraries and drop them into your project's /src folder as if you'd written them yourself. (This may require some research and knowledge on special requirements to build the libs, such as with Swiz's compiler metadata compiler settings which you need to put into your project's settings.) After you get things set up right and the project compiles again, doing a refresh of design view should finally give you proper looking Halo controls and fonts so they look identical to the Flash runtime view.
Why this works, I've no idea. I suspect it has something to do with that stupid and annoying (and supposedly 'harmless') design mode warning message you get when you include a library like Swiz or Mate in your project. (Design mode could not load xxxxxxxxxxxxx.swc. It may be incompatible with this SDK, or invalid. (DesignAssetLoader.CompleteTimeout)) - this warning doesn't break your application, people seem to think it's just a harmless warning..but is it breaking design view?
If anyone has any idea what's going on here, why this 'fixes' the problem (a better work around), or has any other insight I'd love to hear it. The combo of needing to do two things (in my specific case) to fix the problem really made this a ROYAL PAIN, I still can't believe I found it.

Hi Fernando, sorry for the delayed response. CSS Design Mode is not available for Flex 4 projects, but it is still available in Flex 3 projects. The reason for this is that designing components in Flex 4 is often a lot different, since it relies highly on the new spark skinning architecture. There is, however, an Appearance panel available in design view which supplies a set of the main inheriting styles. Setting these styles in the Appearance panel will result in assigning values to a global style selector.
I hope this helps,
Rob

Flash Builder Design Preview Not Working With Catalyst Objects On Stage

Hi there,
I'm working with a flash catalyst component from a flex project library, and it will not preview in desing mode. Anyone ever run into this? It seems that it may be a memory issue as the custom components themselves will preview, but now a bunch of custom components all displayed in a view.
Any insight would be greatly appreciated! For now I'm back to guessing x & y coords...

Going to answer my own thread here. This issue doesn't seem to be with Flash Builder, I think the issue lies in the browser not being able to register the button modes, namely Firefox 4. I've seen it happen in other browsers too, like Chrome, where the fix is to embed the swf as param.wmode = "window". Hope this helps someone out.

Flash Builder Design Mode: sea of grey w/ blue boxes...why?

Gentlepersons,
I added various controls to a tiny test application's MXML file in Flash Builder (Gumbo)'s design mode, ran the app, and all was well. Then I opened the file in design mode again, and all I could see was a sea of grey, with no controls visible. When I clicked on a control, a blue border would appear around it, but no other sign of the control was visible. I could drag new controls onto the sea of grey, but they were invisible too.
I have attached a screen shot of the "sea of grey," named "SeaOfGrey.tiff".
What the heck is this? Is there some "sea of grey" mode that I accidentally got into? How do I get out of it?
Thanks! :-)
Jim

Flash Builder Design Issue!

This is a very annoying issue that im having. I have had Flash Builder 4 installed since the launch of CS5 and just started to use it. The problem im having is with the designer when constraining an object to the corners of the document.
Whats happens in the object goes off the canvas when constraing it to the right, left and top.
Here is an image of what im talking about.
http://papillongrafix.com/fb.png
whats happening and how can i fix it?

The issue does not seem to be present in FB 4.5 so i cannot give exact reason of the issue. Anyway you can see that the right alignment value is showing negative number in the text box. So you can adjust the value to a positive number which is suitable for your requirement

Flash Builder, Design area resolution gone?...

Hi, maybe is a simple one but trying with no luck in the Flash Builder Trial, looking in the documentation,
cannot see where is the design area, in flex 3 was easy lets say know how the components looked like
in 2000x1000 for example just putting there the value.
where is this located in Flash Builder
thanks.

Nope, he's right, it's not there for me either.
This is what he is talking about. I do anticipate this being an annoyance for me once I switch to FB4 at work.
In this case, just a VBox container with width/height both set to 100%. The main Application container had no w/h set, but I don't imagine that mattering.

In Flash Builder: "No Disk" Error when trying to switch to Design View

Just had Flash Builder Beta 1 uninstalled and Beta 2 installed instead.
When I try to switch to Design View or open a link from Start Page in Flash Builder Beta 2, the application freezes and "No Disk" error message pops up.

You have some other problem with your boot drive that has corrupted data backed up to the TimeMacine drive.
My advice is to boot into each operating system and manually backup just your Users files each to separate regular external drives (no Timemachine or backup software) and disconnect.
Make a note of any serial numbers, emails, address book contacts, export bookmarks etc. that isn't typically in your users folders data.
You might be able to Winclone 3 the Windows as a whole thing as it's appearing not to have issues but it's your MacintoshHD partition that is so that will have to be rebuilt from scratch.
Most commonly used backup methods
If your OS X parititon doesn't boot, you can use this to recover files.
Create a data recovery/undelete external boot drive
Without any further detail about your machine I can't advise specifically what to do, but it involves using Disk Utility to Zero Erase (move slider one spot to the right or in 10.6 using Security Option) the ENTIRE boot drive and reformatting, then installing OSX fresh and then setting up BootCamp again.
If you wish to switch your boot drive for something better, this is a good time to do this.
Install/upgrade RAM or storage drive in Mac's
If your machine is capable of Internet Recovery, then use that, then upgrade.
If your machine came with 10.6 or earlier, then use the 10.6 install disks and work up from there.
Erase, formatting, OS X installs on Mac's

Flash Builder 4 - design view - states basedOn + design area widget

Hello,
Since i updated my project from Flex 3 to Flash Builder (4), i have very annoying issues in the design area.
The one in Flex 3 was quite usefull, but the new version is not easy, and straight forward usable.
Here are the 3 issues:
- when i have states designed from another one, i use the basedOn mxml attribute, which was used in Flex 3 and still exist in SDK 4 states system.
But the designer view in Flash Builder don't take those basedOn properties in account!
What can i do? and is it a known bug?
- When i have at least one precific state, i must define a defautl state, in the new SDK. Ok, but in design view, i cant add a new component without making the change only for one state. I can only make the change for the default state, but it will not be taken in account for all the other states, like i can do in Flex 3.
What i want to be able to do this: making changes in design view without selecting ANY state.
Is it possible? How can i do?
- In flex 3, there were a design area widget to select the resolution used for the preview design.
It was very usefull when the application has very dynamic width and height.
In Flash Builder, this widget has been removed.
Why has it been removed? and how can i preview my mxml views wihtout changing width and height values?
Thanks.
Seb

The update has been improved in every other areas, so it is not that much important.
I just hope that the new release will fix that (as it has been answered to my post).
The only thing i don't like in new releases of FB is that when the architecture of SDK is aimed to seperate the work between design and code, they focused only on catalyst to create the tools to manipulate design, and they forgot to keep an easy way to do design app directly in FB (with the design view and the style properties of MXML in FB3). But i'm confident that they will give such a tool soon.
But for now, if you don't like the restriction of the new release, you can continue to work with Flex 3 for 0$! And even in Flex 4, you can create MX components for which the design view will work as before. The fact that tools can manage a mix between MX and Spark components is a great thing. It is up to you to choose which you need which its own advantages and drawbacks.
Xcode is real pain to use with outdated ergonomy. It is only usefull to code in Objective C which is another real pain to do.
XCode can be cheapper because all Apple products are quite expansive, so the software to create softwares for them can be much more cheapper.
And Apple get a good revenue share from AppStore, so again they can give a cheap soft to create apps. You also have to pay 100$ to be able to send app to appstore, in ly opinion the good price for XCode should be 0$, not even 80$!
Flash builder 4 is very stable, but if you don't like it, you can choose another tool. Main competitor has no designer at all!

Flash Builder 4 - Beta / Design view sporadic at best

Okay, so I have installed the beta, and running through the Catalyst / Flash BUilder 4 tutorial, all is well, unitl i try to get the imprted fxp file to consistently display in the design mode. Not only that, but switching from code view to design view will break it just about 95% of the time, and then it will not display the created items that the tutorial has you put on them (i.e. the databinds to the names, etc etc).
Has anyone else experienced this? Other than a few little things like this, so far so good guys(ADOBE).
Thanks,
Craig Newroth

eh_adobe wrote:
Please be aware that using a newer SDK with Flash Builder Beta's Design View may have unpredictable results. I can't say specifically since I don't know what version you tried and what your document contained, but... let's pretend for a second that the SDK changed something in a component - its name, its package, or any method or properties in it. Design View was compiled with a specific version of the SDK, and would not know about that change, and so might not react very well to the document. Yes this is not ideal, but it's hard to avoid when the SDK is changing rapidly (at some point it will settle down, and this won't be an issue). We can look at ways to mitigate this.
I have had less unpredicatable results with recent builds of the SDK the latest being build 7988- I basically update from the svn trunk every 2-3 days look through the changes run the checkintests just to make sure all is ok then see what happens to be small testbed apps, I have been doing this for several months. I don't mind the IDE not dealing with the changes as long as it tells me why it can't. But the code should not break the IDE. Also i'm getting a little confused as some of the responses to some issues (not the design mode one) in this forum have suggested seeing what happens with updated SDK's.
Anyway I have reverted everything back to a standard FB4 install and the first thing that happened yet another new flaw in design mode rears its head, no errors but this time a visually definable issue. The component appears as a 1 dimension line in the top left hand corner of the design editor window, not even on the design view working canvas. Attached is a screen shot and the associated code that caused it. Please note the IDE didn't draw the big red ring around the visual glitch so thats one less bug to worry about.
     the app.
<?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/halo" minWidth="1024" minHeight="768">
     <s:HSlider x="50" y="50" width="200" height="30" skinClass="skins.HSliderSkin"/>
</s:Application>
     skin part A.
<?xml version="1.0" encoding="utf-8"?>


<s:SparkSkin xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark"
       minHeight="11" minWidth="100"
       alpha.disabled="0.5">
    <fx:Metadata>
    <![CDATA[
      * @copy spark.skins.default.ApplicationSkin#hostComponent
         [HostComponent("spark.components.HSlider")]
    ]]>
    </fx:Metadata>
    <fx:Script>
        /* Define the skin elements that should not be colorized.
           For slider, the skin itself is colorized but the individual parts are not. */
        static private const exclusions:Array = ["track", "thumb"];
      * @copy spark.skins.SparkSkin#colorizeExclusions
        override public function get colorizeExclusions():Array {return exclusions;}
    </fx:Script>
    <s:states>
         <s:State name="normal" />
         <s:State name="disabled" />
    </s:states>
    <fx:Declarations>
     
        <fx:Component id="dataTip">
            <s:MXMLComponent minHeight="24" minWidth="40" y="-34">
                <s:Rect top="0" left="0" right="0" bottom="0">
                         <s:fill>
                              <s:SolidColor color="0x000000" alpha=".9"/>
                         </s:fill>
                         <s:filters>
                             <s:DropShadowFilter angle="90" color="0x999999" distance="3"/>
                        </s:filters>
                    </s:Rect>
                    <s:SimpleText id="labelElement" text="{data}"
                         horizontalCenter="0" verticalCenter="1"
                         left="5" right="5" top="5" bottom="5"
                         textAlign="center" verticalAlign="middle"
                         fontWeight="normal" color="white" fontSize="11">
                </s:SimpleText>
            </s:MXMLComponent>
        </fx:Component>
     </fx:Declarations>
    
    <s:Button id="track" left="0" right="0" top="0" bottom="0"
              skinClass="skins.HSliderTrackSkin"/>
    
    <s:Button id="thumb" top="1" bottom="1" width="{hostComponent.height*1.5}" skinClass="skins.HSliderThumbSkin"/>
</s:SparkSkin>
     Skin Part B
<?xml version="1.0" encoding="utf-8"?>


<s:SparkSkin xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark">
    <fx:Metadata>
    <![CDATA[
      * @copy spark.skins.default.ApplicationSkin#hostComponent
         [HostComponent("spark.components.Button")]
    ]]>
    </fx:Metadata>
    <s:states>
        <s:State name="up" />
        <s:State name="over" />
        <s:State name="down" />
        <s:State name="disabled" />
    </s:states>
    
    <s:Rect left="0" right="0" top="0" bottom="0" radiusX="{hostComponent.height/2}" radiusY="{hostComponent.height/2}">
        <s:fill>
            <s:SolidColor color="0x4F4F4F" />
        </s:fill>
    </s:Rect>
     
     <s:Rect left="0.5" right="0.5" top="0.5" bottom="0.5" radiusX="{hostComponent.height/2}" radiusY="{hostComponent.height/2}">
          <s:stroke>
               <s:LinearGradientStroke rotation="90" weight="1">
                    <s:GradientEntry color="0x000000" alpha="0" />
                    <s:GradientEntry color="0x000000" alpha="0.33" />
               </s:LinearGradientStroke>
          </s:stroke>
          <s:fill>
               <s:LinearGradient rotation="90">
                    <s:GradientEntry color="0xFFFFFF"
                                      color.over="0xE5E5E5"
                                      color.down="0x999999" />
                    <s:GradientEntry color="0xD8D8D8"
                                      color.over="0x7D7D7D"
                                      color.down="0x555555" />
               </s:LinearGradient>
          </s:fill>
     </s:Rect>
     
</s:SparkSkin>
     Skin Part C
<?xml version="1.0" encoding="utf-8"?>


<s:SparkSkin xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark">
    <fx:Metadata>
    <![CDATA[
      * @copy spark.skins.default.ApplicationSkin#hostComponent
         [HostComponent("spark.components.Button")]
    ]]>
    </fx:Metadata>
    <s:states>
        <s:State name="up" />
        <s:State name="down" />
        <s:State name="over" />
        <s:State name="disabled" />
    </s:states>
     
    <s:Rect left="-1" right="-1" top="0" bottom="-1" radiusX="{hostComponent.height/2}" radiusY="{hostComponent.height/2}">
        <s:fill>
            <s:LinearGradient rotation="90" >
                 <s:GradientEntry color="0x000000" alpha="0.55" />
                 <s:GradientEntry color="0xFFFFFF" alpha="0.55" ratio="0.8" />
            </s:LinearGradient>
        </s:fill>
    </s:Rect>
    
    <s:Rect left="0" right="0" top="1" bottom="0" radiusX="{hostComponent.height/2}" radiusY="{hostComponent.height/2}">
        <s:fill>
            <s:SolidColor color="0xCACACA" />
        </s:fill>
    </s:Rect>
     
     <s:Rect left="0" right="0" top="0" bottom="0" radiusX="{hostComponent.height/2}" radiusY="{hostComponent.height/2}">
          <s:fill>
               <s:SolidColor alpha="0"/>
          </s:fill>
     </s:Rect>
</s:SparkSkin>

Flash Builder 4.7 and design view question

I have programmed a large, commercial level mobile application using Flash Builder 4.6. It is working GREAT when ran on both iOS and Android devices.
I was using the trial version of Flash Builder 4.6 to develop this application. I used the states feature that FB has built in to handle Portrait, Landscape, and Phone / Tablet configs. This means that I built 4 different layouts for all 8 of my views in my mobile application. Using the design view in FB 4.6 was what allowed me to do this.
I have to say that I LOVE Flash Builder so far. GREAT tool.
My trial ended just last week. I had to purchase version 4.7 of the software, only to find out that they REMOVED the design view from the software.
All complaining aside, what have other programmers who are in the same boat as me done as a solution? I would like to continue to program in AS and Flash Builder as I have taken the time to write the application and learn the whole platform.
As it stands now, I am in the process of downgrading my liscence keys from 4.7 to 4.6, but in order to do this I had to RETURN my retail version of FB 4.7 premium (bought online) and buy a volume liscening version (NOT through adobe, only allowed to do this through a reseller such as CDW). then once I have a key for 4.7 through volume liscencing, it can be downgraded to 4.6.
I'm hoping to get input from others in the same boat. Did you change Programming languages? if so, to what? Did you change IDE's? If so, to what?

Joe -
     I actually never completed the downgrade to 4.6 so I've been using 4.7 without the design view.    In 4.6, I would put a control on the view within design view. Then I would change each state, move it around, and it would be placed that way. In my case, each view has 4 states - portraitPhone, landscapePhone, portraitTablet, and landscapeTablet.   I had to do this 4 times for each control under 4.6
     So I went back and looked at my code in 4.7 and all the resulting code was these explicit x, y, height, and width values. See the code below:
<s:states> <s:State name="portraitPhone" stateGroups="phone,portrait"
/>
<s:State name="landscapePhone" stateGroups="phone,landscape"/>
<s:State name="portraitTablet" stateGroups="tablet,portrait"/>
<s:State name="landscapeTablet" stateGroups="tablet,landscape"/>
</s:states>
<s:List id="lstMake" x="10" y="19" height="25%" allowMultipleSelection="false"borderVisible="
true" click="changeMake(event)" labelField="label"width.landscapePhone="
295" height.landscapePhone="105"x.landscapeTablet="
25" y.landscapeTablet="54" width.landscapeTablet="461"height.landscapeTablet="
292" fontSize.landscapeTablet="24"width.portraitPhone="
182" height.portraitPhone="175"x.portraitTablet="
16" y.portraitTablet="35" width.portraitTablet="399"height.portraitTablet="
360" fontSize.portraitTablet="24">
<s:dataProvider>
<s:ArrayList id="makeCollection">
<fx:Object label="Cadillac" data="18"/>
<fx:Object label="Chevrolet" data="1"/>
<fx:Object label="Dodge" data="2"/>
<fx:Object label="Ford" data="3"/>
<fx:Object label="GMC" data="4"/>
<fx:Object label="Isuzu" data="6"/>
<fx:Object label="Jeep" data="7"/>
<fx:Object label="Licoln" data="8"/>
<fx:Object label="Mazda" data="9"/>
<fx:Object label="Mercury" data="10"/>
<fx:Object label="Nissan" data="11"/>
<fx:Object label="Oldsmobile" data="12"/>
<fx:Object label="Sterling" data="20"/>
<fx:Object label="Suzuki" data="13"/>
<fx:Object label="Toyota" data="14"/>
</s:ArrayList>
</s:dataProvider>
</s:List>
<s:Label x="10" y="8" fontSize="11" text="Vehicle Make"x.landscapeTablet="
10" y.landscapeTablet="23" fontSize.landscapeTablet="24"fontSize.portraitTablet="
24"/>
<s:Label x="143" y="11" fontSize="11" text="Vehicle Year"x.landscapePhone="
354" y.landscapePhone="10"x.landscapeTablet="
517" y.landscapeTablet="23" width.landscapeTablet="143"height.landscapeTablet="
26" fontSize.landscapeTablet="24"x.portraitPhone="
204" y.portraitPhone="8"x.portraitTablet="
446" y.portraitTablet="11" fontSize.portraitTablet="24"/>
<s:List id="lstYear" x="145" y="20" height="25%" allowMultipleSelection="false"borderVisible="
true" click="doYearChange(event)" dataProvider="{yearCollection}"labelField="
value"x.landscapePhone="
313" y.landscapePhone="19" width.landscapePhone="157"height.landscapePhone="
105"x.landscapeTablet="
524" y.landscapeTablet="54" width.landscapeTablet="343"height.landscapeTablet="
292" fontSize.landscapeTablet="24"x.portraitPhone="
200" y.portraitPhone="19" height.portraitPhone="194"x.portraitTablet="
453" y.portraitTablet="37" width.portraitTablet="276"height.portraitTablet="
358" fontSize.portraitTablet="24">
</s:List>
<s:List id="lstModel" x="10" y="147" height="30%" borderVisible="true"dataProvider="
{modelCollection}" labelFunction="lblFunct"width.landscapePhone="
460" height.landscapePhone="99"x.landscapeTablet="
13" y.landscapeTablet="384" width.landscapeTablet="992"height.landscapeTablet="
309" fontSize.landscapeTablet="24"x.portraitPhone="
10" y.portraitPhone="221" width.portraitPhone="301"height.portraitPhone="
184" allowMultipleSelection="false"click="doModelSelected(event)" fontSize.portraitPhone="
12"x.portraitTablet="
16" y.portraitTablet="428" width.portraitTablet="742"height.portraitTablet="
521" fontSize.portraitTablet="24"></s:List>
<s:Label x="12" y="132" fontSize="11" text="Vehicle Model"x.landscapeTablet="
10" y.landscapeTablet="354" fontSize.landscapeTablet="24"x.portraitPhone="
10" y.portraitPhone="207"x.portraitTablet="
10" y.portraitTablet="401" width.portraitTablet="154"height.portraitTablet="
21" fontSize.portraitTablet="24"/>
So instead of continuing to try and modify these values by hand, then run the program, using trial and error, I took a different tact.   I removed ALL x y height and width values. Then, I wrapped all the mxml code in either <s:HGroup or <s:Vghroup tags depending on what I wanted. Then I would just set the vertical and horizontal align on these groups. This allows everything to scale correctly based on the size of the view (each device really is a little different).   Finally, I hand entered things like font sizes by using State Groups like this:   fontSize.phone="12" fontSize.tablet="22".    It still took testing on the screen to see how my layouts worked but it just makes the UI so much easier to change around and works so much better with out all the static stuff in it.
If you have some time , I would suggest taking one of your 4.6 views that has all these static variables and trying to modify it to work like I said above.    My modified code (to do the same thing as above) is below:
<s:states> <s:State name="portraitPhone" stateGroups="phone,portrait"
/>
<s:State name="landscapePhone" stateGroups="phone,landscape"/>
<s:State name="portraitTablet" stateGroups="tablet,portrait"/>
<s:State name="landscapeTablet" stateGroups="tablet,landscape"/>
</s:states>
<s:VGroup height="100%" width="100%" verticalAlign="top">
<s:HGroup paddingTop="10" width="100%" height="50%">
<s:VGroup width="60%" paddingLeft="5">
<s:Label fontSize="11" text="Vehicle Make"fontSize.tablet="
24"/>
<s:List id="lstMake" width="100%" allowMultipleSelection="false"borderVisible="
true" click="changeMake(event)" labelField="label"fontSize.tablet="
24" fontSize.phone="12">
<s:layout>
<s:VerticalLayout horizontalAlign="contentJustify" requestedMaxRowCount.portraitTablet="8" requestedMaxRowCount.phone="6" requestedMaxRowCount.landscapeTablet="4"gap="
0" rowHeight.phone="28" variableRowHeight="false" rowHeight="55"verticalAlign="
middle"/>
</s:layout>
<s:dataProvider>
<s:ArrayList id="makeCollection">
<fx:Object label="Cadillac" data="18"/>
<fx:Object label="Chevrolet" data="1"/>
<fx:Object label="Dodge" data="2"/>
<fx:Object label="Ford" data="3"/>
<fx:Object label="GMC" data="4"/>
<fx:Object label="Isuzu" data="6"/>
<fx:Object label="Jeep" data="7"/>
<fx:Object label="Lincoln" data="8"/>
<fx:Object label="Mazda" data="9"/>
<fx:Object label="Mercury" data="10"/>
<fx:Object label="Nissan" data="11"/>
<fx:Object label="Oldsmobile" data="12"/>
<fx:Object label="Sterling" data="20"/>
<fx:Object label="Suzuki" data="13"/>
<fx:Object label="Toyota" data="14"/>
</s:ArrayList>
</s:dataProvider>
</s:List>
</s:VGroup>
<s:VGroup width="30%">
<s:Label fontSize="11" text="Vehicle Year"fontSize.tablet="
24"/>
<s:List id="lstYear" width="100%" allowMultipleSelection="false" borderVisible="
true" click="doYearChange(event)" dataProvider="{yearCollection}"labelField="
value" fontSize.phone="12" fontSize.tablet="24">
<s:layout>
<s:VerticalLayout horizontalAlign="contentJustify" requestedMaxRowCount.portraitTablet="8" requestedMaxRowCount.phone="6" requestedMaxRowCount.landscapeTablet="4"gap="
0" rowHeight.phone="28" variableRowHeight="false" rowHeight.tablet="55"verticalAlign="
middle"
/>
</s:layout>
</s:List>
</s:V

Going back to Flash builder 4 on Mac because of the design view

I've got installed the Flash builder 4.6 in a Mountain Lion Mac.
I have imported a project that I did some years ago with Flex 3. Everything seems to be ok until I try to see the design view. I can't see anything, it is just empty. I know that it is not necessary but it helps me a lot.
I've been searching in this forum and my conclusion is that I've got to go back to Flash Builder 4.
I would be very grateful if anyone could help me with the next questions:
1- Can I work with Flas Builder 4 with my current serial from flash builder 4.6?
2- Should I uninstall 4.6 before using 4?
Thanks!

Hi Chris
Thanks for your reply.
I had already seen that post, and the answers were not applicable to me. But thankfully I have found the solution now!
I Googled the error message: "org.apache.xerces.dom.DeferredElementImpl.getTextContent()Ljava/lang/ String", and came across the following bug report:
http://code.google.com/p/alkwarel/issues/detail?id=10
As suggested in the link above, I deleted the xerces.jar located in user.home/Library/Java/Extensions/. I then cleaned my project, and FB4 for Mac finally exported the release build!
That bug has been annoying me for MONTHS. I'm so happy it's fixed now!
All the best,
Zabeen

How does one access MX components -- e.g. DataGrid -- in Design View in Flash Builder Burrito

Hi,
Is there a way to access the mx version of components in Design View (Flash Builder Burrito), for those components that have both a Spark and a Halo/MX version, e.g. DataGrid?
Thanks

... I know I can go to Source View and type in part of it, and switch to design view, however I'm doing a bunch of tutorials where the mx components are used, where one is simply dropping data services onto the components, apparently not supported yet on the newer Spark components?

Flash Builder Design view

Similar Messages

Maybe you are looking for