Flash Builder 4.7 and design view question

[MrJesse34]

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?

[MrJesse34]

There is still a chance Adobe could bring it back, IMHO.  We just have to explain the situation and why the sales of Flash Builder should go way down without DV.

I tried flash develop and it doesn't really do anything.  NO design view there either.

[qf3l3k]

Of course no design view... but they don't ask for the money.

[iBr3nt]

If you're already using Flash Builder 4.6, there's nothing stopping you from keeping it installed at the same time as FB 4.7. I've got both installed side-by-side and they work just fine, as long as you're not opening the same project in both. Once a project is opened and saved in 4.7 it's difficult to get it back to 4.6.

The main point is this - if you need Design view, then keep using 4.6. The changes in 4.7 relate to some new debugging options for installing directly to the iOS device as well as the new ASC 2 compiler (for ActionScript projects only). Other than that, FB 4.7 uses the exact same Flex 4.6 SDK as FB 4.6. You can continue to overlay the newer AIR SDKs with Flash Builder 4.6 (in fact it seems easier with FB 4.6 anyway).

iBrent

[tamak1234]

late to this discussion, but I agree with iBrent (huge fan, your youtube videos got me off and running with FB -- thanks)...

I run both versions... but am working on forcing myself to learn how to get used to strictly using code and NOT design view... I think it just makes me a stronger developer and forces me to think through things that otherwise I would just rely on the software to handle / do... if that makes sense.

[Leo Kanel]

Hi guys! i am also frustrated with the dicision to take out the design view from 4.7. I ve been using flex since version 3.6, and i even got two awards for innovations for a flex mobile platform i designed. When i first got flash builder 4.7 and i saw the luck of design view i turned to other options like native android.. i hope we will soon get an update containing what made flash builder different than other available tools...

[PastaPrimavera]

@ tamak1234

It is good to always strive to be a better programmer. However the sole purpose for me and DV was to move things around to so as to get the best placement for them on the page. To change the x,y values in code alone is just to time consuming of a task compared to how fast you can do in with DV. Not to mention changing font sizes and colors. 

[gsd_cg]

Yep, I've already gone back to 4.6.  I only worry about just how long term a solution this is, eventually it won't be compatible with something... but *hopefully* it will be quite a while before that problem comes up.

[iBr3nt]

Wellllll, considering Flash Builder 5 won't support Flex anymore, there's also that scenario...

Adobe has donated Flex to the Apache foundation and they are updating their tooling accordingly. ApachFlex is strong and will continue to grow through it's awesome community. But Flash Builder will continue to be updated as an ActionScript development tool, one of the reasons why Design veiw was removed. Design view is a Flex only tool.

iBrent

[fB3]

"Wellllll, considering Flash Builder 5 won't support Flex anymore"

Where did you hear that?

Why would anyone use Flash Builder 5 over Flash?

[MrJesse34]

The point here is that Adobe has control over the IDE now, while Apache handles the actual SDK code behind the scenes.  Without having to worry about working on the SDK code that should free up Adobe to focus on making the IDE better for those programming in the language.  And perhaps most importantly, to keep the IDE up to date with the packaging options for the 3 major mobile platforms - iOS, Android, and Blackberry.

The ability to program once, for any of those three platforms and any device (tablet / phone) makes it SUCH a powerful tool.  Make it a little better, put back design view, and throw a little advertising behind the product and Adobe has a home run on their hands.

[moccamaximum]

Maybe this can help: DesignView

[Guest]

Sorry to rehash this old thread, but you are absolutely spot on. The power of FB4.6 was that I could easily see how all my targets worked in various resolutions and orientations, and importantly, states. When I make a config panel, for example, that may be easily done with a bunch of labels, buttons, textboxes, etc., and yeah, I could do it in code, but why? MrJ's right in saying that it is laborious.

So, we now have a big risk introduced to thousands of businesses - that is, Adobe is capable of doing anything at the drop of a hat. Example: palming off flex to apache. Example: removing design view and saying 'that WILL be fine with you'. How long will FB4.6 be serviced by Adobe? When that's no longer compatible (for whatever reason), what do the developers do? What happens when you get a squabble amongst the apache flex developers and they split the project, ( eg a bit like openoffice and libreoffice.)?

If I had to wrangle code just to make GUIs then I would have looked further afield. It's a great platform but I think it cannot be relied upon. Adobe is showing contempt for its developer customers by removing design view, I think, because it is quite difficult to maintain. But then, I'm not a multibillion dollar company...

[Guest]

Actually, to be more constructive, where should I be looking? I was tempted to try out JavaFX but that looks pretty unsupported to me. Any ideas, do I go c# or java or something? What's everyone else doing to mitigate this risk?

[MrJesse34]

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:VGroup>

</s:HGroup>

<s:VGroup width="98%" height="45%" verticalAlign="top" paddingLeft="5"

>

<s:Label fontSize="11" text="Vehicle Model" fontSize.tablet="24"

/>

<s:List id="lstModel" width="98%" borderVisible="true

"

dataProvider="

{modelCollection}" labelFunction="lblFunct

"

fontSize.tablet="

24" allowMultipleSelection="false

"

click="doModelSelected(event)" fontSize="

12"

>

<s:layout>

<s:VerticalLayout horizontalAlign="contentJustify" requestedMaxRowCount.portraitTablet="7" requestedMaxRowCount.phone="6" requestedMaxRowCount.landscapeTablet="4

"

gap="

0" rowHeight.phone="28" variableRowHeight="false

"

verticalAlign="

middle" rowHeight.tablet="55

"

/>

</s:layout>

</s:List>

</s:VGroup>

</s:VGroup>

[JKunkel99999999]

They REMOVED Design View?!! Are they CRAAZY! I don't care a flip if "real" programmers find it more convienent to code objects in MX rather than use DV; I find DV far more convenient. The ease of use of components is the only attraction of Flash Builder for me. No DV, no Flash Builder for me.

Back to using FlashDevelop.

[k-antwi]

Why on earth will somebody just decid to remove something that works, or was there a loud cry out from the flex community for it to be removed. That is the only feature that got me to buy a flash builder, if not then I will just download the SDK and run it on eclipse.

This is very INSANE!

What happened to rapid development? I don't believe one bit that typing is faster than drag-and-drop

Whoever made this decision should quickly call for a board meeting to get this restored without hesitation.

[pauland]

Design view was probably expensive to produce and maintain and many, if not most developers, myself included, stopped using it in any event after becoming comfortable with MXML.

Given that Adobe has stopped development of the Flex framework and the design view is all about the flex framework, it seems quite logical for them to cease development of that part of the product.

For pure flash development, it's superfluous and Adobe is gradually forgetting about Flex.

[rtalton]

Disclaimer: The following is my opinion. I'm sure you have an opinion, too. Maybe quite different from mine.

This is an interesting thread -- not only because of the obvious frustration expressed by most, but also because of the lack of any response by an Adobe employee.

Yes, Adobe are the culprit here as they have no intentions of keeping Flash Builder and it's Design View in sync with whatever changes/improvements Apache Flex makes. And the Apache Flex project leaders have never stated that they will ever offer an IDE/design view to replace Flash Builder, so don't hold your breath. Adobe won't offer anything, either. Why should they continue development on the very thing they killed? It might somehow threaten adoption of whatever new and exciting HTML5 animation software they come up with.  Like Adobe Edge Reflow, which features, of course, a design-view type of UI. Now we can make a pretty picture move across the screen! Just like FutureSplash (which would become Flash) could do back in 1995! And remember that Adobe's current CEO used to work at Apple. Draw your own conclusions.

The way I see it, another third-party would have to offer an IDE which is compatible with Apache Flex because I don't think AF has any muscle or talent to do that now--and my conspiracy theory is that they wouldn't want to p*** off the people at Adobe by doing so; they are still connected to one another. Adobe does not really want competition from AF, and vice-versa. The only way AF will survive is to work on bringing the Falcon JS compiler to market.

IntelliJ IDEA offers a primitive (in comparison the FB) Android UI designer. So maybe someone will come up with something similar for Flex.

Full disclosure: I've purchased Sencha Complete, which features something like Design View, and am learning the brave new world of building web sites based on Javascript technology from the 1990's. This is the new normal. As a former Flex developer, I accept the need to lower my expectations and how great I used to have it with Flex, but it really is all gone now. The types of things I could accomplish so quickly, easily and cheaply in Flex will have no replacement for several years (including using Design View--critical in my opinion). But you might as well start getting used to coding in Javascript now, as whatever happens in the next 3-5 years that will make you money will be based on JS, not ActionScript/MXML.

It was a fun ride while it lasted. But we are now "back from the future". It will be a while before we get to that future we used to live in.

[PastaPrimavera]

I agree with many here that the removal of DV in 4.7 was a huge misteak.

Tweaking objects is far faster in DV than anyone can do in code. Not to menion you get to see the results instantly.

Adobe gets enough money from their products to keep its development up. Stop taking features out!

[Guest]

Reading all of these comments I notice the discussion has gone toward a debate on how someone should program, as opposed to what happened to the design view option.  I'm using the trial version to see if it is worth purchasing enough licenses for several people at work, and so far using the 4.7 IDE doesn't seem to give me much benefit.  I've already write mxml applications in Linux using mxmlc and vim which are free and quickly installed with yum.  The help files are handy, but not any more handy then google.  %s finds variables just as quickly as clicking the components....  So is there something I'm missing?  I couldn't care less about being a "better" programmer, I get paid to deliver software as quickly as reasonably allowable.  If a design view helps me organize layouts quickly and more efficiently than using vim I would purchase that.  Thats why people use programs like LabView, QT Creator, Visual C++, etc....  You can write configuration gui's quickly and efficiently by dragging the components and then adding the code.

With that said, I do have a question that is relevant to the title of this thread.  Does anyone here have a link to any disussions or official releases explaining why design view has been removed, and whether or not there are other tools avalable for purchase that will include it?  Or, from reading some of the comments, is writing apps using flex and/or mxml just a waste of time because it is going to no longer be supported?

[k-antwi]

Well, Adobe simply thinks it can't afford the cost of maintaining the Design View in FB any longer. I don't blame them cos they've already made their millions out of it. It's just frustrating

[pauland]

I think the truth is quite mundane. They couldn't make Flex pay well enough to fund the development of the SDK or design view.

[pauland]

Cerekay, Adobe said that DV would be dropped a long time ago and since they've given away the SDK, they now have only a minimal interest in the future of Flex. You'll find that companies invest money where they can get a return on the investment, not where it costs them money.

Design view was all about Flex layouts. Flex builder was about Flex. Flash builder was about Flex and Flash. Now Flash Builder is usable from the Flash IDE and Design View has no value there and is gone.

How clear do things need to be?

That said, many FB users didn't bother with Design View in any case, even if many others relied upon it.

I think UI design is about  a lot more than dragging components onto a screen as quickly as possible.

Whatever your view about DV, there is no financial reason for Adobe to invest in it. If there was it wouldn't have gone.

[Pother]

Well obviously the Design View was never intended for full detailed UI/UX design.  (Catalyst was their attempt at that.)  But DV enabled the RAD process, just like the same in old VB6 or currently like Google has in the Android development tools.

But hey Adobe has made bad decisions before and this is just another one.

I'm sure if Flex keeps alive in Apache-land, that eventually if not already, something will recreate the RAD process from pre-FB4.7, and the desire to use any Adobe products for development will wane further.

They could have supported Flash/Flex and copied the Microsoft development tool model... but no their first thought was to charge $12,000 for Flex 1.0 and aim it at Enterprises only... and finally when they appeared to have it sane... they joined Steve Jobs in his efforts to kill their product.

I wonder how much they're

making on Edge and Muse...

[pauland]

their first thought was to charge $12,000 for Flex 1.0 and aim it at Enterprises only.

That was pretty smart on their part - it was Macromedia then and not Adobe.

I originally thought they were crazy and asked one of the company guys why they did this crazy thing - I had clients that would have loved the product, but not at that price. I was told that  it was the first generation of the product and they wanted clients that would seriously invest time and money in development and would work with Macromedia on any issues. The entry barrier kept support issues manageable and ensured that the companies buying the product would also invest in hardware that would make the product run at a decent speed. You may have forgotten that Flex 1.0 was compiled on demand on the server.

I thought they were pretty smart.

Flex 1.5 made the software more accessible, but Flex 2.0 is where it really took off - the price fell and the architecture changed from being on demand compilation on the server to compilation via development.

$12,000 for Version 1.0 was smart.