Specify the GUI declaratively in ActionScript like in JavaFX Script instead of MXML

Question

After reading a bit about JavaFX Script (which is actually remarkebly close to ActionScript 3) as a developer I thought the way one can specify the GUI declaratively in JavaFX Script via JSON-like notation for the components is pretty cool. It would be nice to have something like that in Flex/ActionScript too. The advantages I see over MXML are:
1) a more compact notation than XML which is nice from a developers view point who actually writes this kind of code. Of course the idea would be that designers still design the GUI with graphical tools that generate this code but if you have to dive in and edit the code it's nice not to have to deal with verbose XML and I think even designers can easily understand JSON-like code; don't just assume that designers love XML because HTML was based on SGML! I'm not so sure if today many designers really still know raw HTML that well (like in 1997, the early days...). Server side developers probably know it better because they have to adapt it to jsp or asp or whatever framework.
2) The fact that it's all ActionScript gives a seamless integration between just composing the components to form the GUI and adding scripts to add additionial behavior instead of mixing XML with actionscript code => no more need for those nasty CDATA blocks! It would also be easy for development tools like Flexbuilder to give a seamsless experience with code completion and zooming in on the code because it's all Actionscript! There's also no need for a separate expression language to tie the MXML to the underlying Actionscript. It would it also make easier to create custom components (not just simple composition components which is really easy in MXML) because you don't have to implement separate XML tags.
here's a short JavaFX Script example:
Frame {
content: GroupPanel {
var myRow = Row { alignment: BASELINE }
var label_col = Column { alignment: TRAILING }
var field_col = Column { alignment: LEADING }
rows: [myRow]
columns: [label_col, field_col]
content:
[SimpleLabel {
row: myRow
column: label_col
text: "Type your text here:"
TextField {
row: myRow
column: field_col
columns: 50
visible: true
Note that this shouldn't be confused with programmatically specifying the GUI in Actionscript (which is possible today as an alternative to MXML). What I propose is at a (slightly) higher level: you don't give a detailed sequence of methods/functions to call to construct the GUI (i.e. HOW to do it) but just specify WHAT you want.
Hopefully some Adobe Flex will see this and think about it. Although I think MXML is not too bad and I can live with it if I have to ;)

Answer 1

I like that idea Sean. A standard and well-supported way to separate MXML and code would be good. I'd love to have builder support a MVC style triad for MXML files, with the
model.as being simply an all-public-all-bindable class full of VOs and view-specific information, any view-manipulation and view<->app communications in the
controller.as, and nothing but bindings and layour in the MXML. There's (almost) nothing stopping you doing this by hand at the moment, but it's a pain, and developers wouldn't stick to it for very long, when they need to create and maintain 3 separate files for that simple "error dialog" without a hand from Builder.
Then again, I'd rather Adobe spent the time that would take on opening and better-documenting builder's APIs, so we can write our own plugins easily, but that's my greedy side- A standard builder-supported MVC pattern for custom MXML components would be aweseome for people that aren't me :)
-Josh
As for JavaFX, I don't care for it.
On Tue, Sep 30, 2008 at 7:56 AM, Sean Christmann
<
[email protected]> wrote:
A new message was posted by Sean Christmann in
Developers --
  specify the GUI declaratively in ActionScript like in JavaFX Script instead of MXML
Jason you bring up a good point on a concept that I think Adobe should
poach from a different framework, Silverlight. In Silverlight the
code-behind pattern is automatic and very nice to work with. Every
interface can be composed of both a layout file and a script file, and
they get composited into the SAME class at compile time. So you can
have both a FileDialog.mxml and FileDialog.as file that know about each
other automatically, without the need to subclass one from the other.
Sean
Jason Stafford wrote:
A new message was posted by Jason Stafford in
Developers --
  specify the GUI declaratively in ActionScript like in JavaFX Script instead of MXML
Personally, I like the separation between the MXML and ActionScript.
We're working on a large project, and so we have all the ActionScript
separate from the MXML files.  For example we'll have something like
filedialoglayout.mxml, and then
filedialog.as that is a subclass of
filedialoglayout.  All event handlers and the like are setup in the
filedialog.as file - the mxml file doesn't know about any function names.
Advantages:
MXML files become layout only - and are more easily shared and worked on
with non-technical people
ActionScript is all in *.as files: no CDATA blocks and no FlexBuilder
quirks where editing ActionScript inside a CDATA block doesn't work
quite like in a real AS file.
For simple experiments, and for learning, it's obviously nice to have
everything in one mxml file, but in a big project like ours, the
separation helps keep things clearer and more maintainable.
Why use the mxml at all?  The MXML files are nice to edit with the
visual editor in Flex Builder, and it's much easier to apply styles and
embed assets in MXML than it is in pure ActionScript.
I think two ways to talk about the same thing (XML and ActionScript) is
already almost one too many - adding a third (JSON) would really be too
much.
Just my thoughts.
-Jason Stafford
Sean Christmann wrote:
A new message was posted by Sean Christmann in
Developers --
specify the GUI declaratively in ActionScript like in JavaFX Script
instead of MXML
This reminds me of a certain workflow pattern that has emerged for us
which might help provide some insight on this topic. I'm working on a
project with a couple other developers which connects to a webservice
for supplying clientside data. This data is available in both json
notation and xml notation. The thing is, while the developers have
overwhelmingly agreed that we should be consuming the json version
since it can be parsed faster and provide more meaningful context for
objects (ie strings vs ints vs arrays etc...), all these same
developers rely exclusively on the xml notation when asking questions
about the data or passing structures around to discuss.
I see the same thing when looking at JavaFX and MXML. JavaFX might
allow for more accurate structures and might be able to be compiled
faster, but MXML is better for being self documenting even if it
requires more verbosity.
Sean
Matt Chotin wrote:
A new message was posted by Matt Chotin in
Developers --
  specify the GUI declaratively in ActionScript like in JavaFX Script
instead of MXML
I'd be curious what other people think.  I see MXML as a distinct
advantage over doing the pseudo-script stuff.  I really don't like
the JavaFX system actually.
Matt
On 9/28/08 10:33 AM, "neo7471"
<[email protected]> wrote:
A new discussion was started by neo7471 in
Developers --
  specify the GUI declaratively in ActionScript like in JavaFX Script
instead of MXML
After reading a bit about JavaFX Script (which is actually remarkebly
close to ActionScript 3) as a developer I thought the way one can
specify the GUI declaratively in JavaFX Script via JSON-like notation
for the components is pretty cool. It would be nice to have something
like that in Flex/ActionScript too. The advantages I see over MXML are:
1) a more compact notation than XML which is nice from a developers
view point who actually writes this kind of code. Of course the idea
would be that designers still design the GUI with graphical tools
that generate this code but if you have to dive in and edit the code
it's nice not to have to deal with verbose XML and I think even
designers can easily understand JSON-like code; don't just assume
that designers love XML because HTML was based on SGML! I'm not so
sure if today many designers really still know raw HTML that well
(like in the 1997, the early days...). Server side developers
probably know it better because they! have to adapt it to jsp or asp
or whatever framework.
2) The fact that it's all ActionScript gives a seamless integration
between just composing the components to form the GUI and adding
scripts to add additionial behavior instead of mixing XML with
actionscript code => no more need for those naster CDATA blocks! It
would also be easy for development tools like Flexbuilder to give a
seamsless experience with code completion and zooming in on the code
because it's all Actionscript! There's also no need for a separate
expression language to tie the MXML to the underlying Actionscript.
It would it also make easier to create custom components (not just
simple composition components which is really easy in MXML) because
you don't have to implement separate XML tags.
here's a short JavaFX Script example:
Frame {
    content: GroupPanel {
    var myRow = Row { alignment: BASELINE }
    var label_col = Column { alignment: TRAILING }
    var field_col = Column { alignment: LEADING  }
    rows: [myRow]
    columns: [label_col, field_col]
    content:
    [SimpleLabel {
    row: myRow
    column: label_col
    text: "Type your text here:"
    TextField {
    row: myRow
    column: field_col
    columns: 50
    visible: true
Note that this shouldn't be confused with programmatically specifying
the GUI in Actionscript (which is possible today as an alternative to
MXML). What I propose is at a (slightly) higher level: you don't give
a detailed sequence of methods/functions to call to construct the GUI
(i.e. HOW to do it) but just specify WHAT you want.
Hopefully some Adobe Flex will see this and think about it. Although
I think MXML is not too bad and I can live with it if I have to ;)
View/reply at specify the GUI declaratively in ActionScript like in
JavaFX Script instead of MXML
<
http://www.adobeforums.com/webx?13@@.59b69b42>
Replies by email are OK.
Use the unsubscribe
<
http://www.adobeforums.com/webx?280@@.59b69b42!folder=.3c060fa3>
form to cancel your email subscription.
View/reply at
<
http://www.adobeforums.com/webx?13@@.59b69b42/0>
Replies by email are OK.
Use the unsubscribe form at
<
http://www.adobeforums.com/webx?280@@.59b69b42!folder=.3c060fa3> to
cancel your email subscription.
<div><div></div><div>
Jason Stafford
Principal Developer
Inspiration Software, Inc.
The leader in visual thinking & learning
Now available - Kidspiration(r) 3, the visual way to explore and understand words, numbers and concepts.
Learn more at
www.inspiration.com/kidspiration.
503-297-3004 Extension 119
503-297-4676 (Fax)
9400 SW Beaverton-Hillsdale Highway
Suite 300
Beaverton, OR 97005-3300
View/reply at
<
http://www.adobeforums.com/webx?13@@.59b69b42/2>
Replies by email are OK.
Use the unsubscribe form at
<
http://www.adobeforums.com/webx?280@@.59b69b42!folder=.3c060fa3></div>
</div> to cancel your email subscription.
Sean Christmann | Experience Architect | EffectiveUI | 720.937.2696
View/reply at
specify the GUI declaratively in ActionScript like in JavaFX Script instead of MXML
Replies by email are OK.
Use the
unsubscribe form to cancel your email subscription.
"Therefore, send not to know For whom the bell tolls. It tolls for thee."
http://flex.joshmcdonald.info/
:: Josh 'G-Funk' McDonald
:: 0437 221 380 ::
[email protected]