You are viewing a plain text version of this content. The canonical link for it is here.
Posted to dev@flex.apache.org by Frank Pepermans <fr...@hotmail.com> on 2013/02/02 14:17:06 UTC
[Dart] - playing around
I've been playing around with Dart for a day,
been doing a huge Flex project for 2 years, but the next one will have to be HTML,
so I decided to give it a good look, as I always do, by developing a small project.
I chose to try and build a very small Flex-like framework and see how far I could get.
Doing so, I really started liking this Dart, and the mini Flex stuff is doing what it is supposed to do.
Some things that I decided to create :
- framework events
// Dart has DOM events, but nothing outside of DOM objects
- list collection
// Like ArrayCollection, it takes an Iterator as source, and dispatches events on add, remove, ... to facilitate a dataProvider functionality in a component
- layouts
// vertical and horizontal layouts to position elements within a DIV
- group, hgroup, vgroup
// They represent a container, in my case a DIV, and have a layout to position elements that are added to it
- combo box
// wraps around a HTML select
UI components, like their Flex counterparts, would have a life cycle,
and functionality to invalidate a component after properties are set, or the layout needs updating.
Dart has operator overloads, so my invalidateProperties for example looks like this :
set foo(Bar value) {
_foo = value;
// on the next update cycle, trigger commitProperties and handle the new property value
later > commitProperties;
}
The ListCollection has similar overloads, so you can do :
ListCollection list = new List();
// add 2 elements to the list
list + foo;
list + bar;
// invert the list
list = -list;
ComboBox box = new ComboBox();
box + foo; // adds foo to the internal dataProvider of box
As in Flex, assign a ListCollection to a ComboBox, and any direct changes to the list will update the ComboBox as well.
Bring them all together and you get something like :
void main() {
// assign a DIV to a VGroup
// VGroup auto has vertical layout
VGroup container = new VGroup('#html_div_id');
ComboBox comboBox = new ComboBox();
ComboBox anotherComboBox = new ComboBox();
container.add(comboBox);
container.add(anotherComboBox);
comboBox + {label: 'item 1'};
comboBox + {label: 'item 2'};
anotherComboBox + {label: 'item 3'};
anotherComboBox + {label: 'item 4'};
}
I'm only a good day in Dart, but liking it a lot.
Dunno if someone is already doing a dart flex project, could very well be, I just wanted to get my hands dirty for now,
would a dart flex framework be something worth considering for the Apache Flex project?
I am well aware of the FalconJS effords, but they could be evaluated in parallel?
Re: [Dart] - playing around
Posted by Frank Pepermans <fr...@hotmail.com>.
also added an event to the example, triggers when you select something in
the first (top-left, next to the lorem ipsum text) combo box
boxA is a Combo Box, it's super class has an overloader, and you can write
boxA['selectedItemChanged'] = ((FrameworkEvent event) => label.text =
control_labelHandler(event.relatedObject));
or you can choose the Flash way as well, the above method does the same as :
boxA.addEventListener(
'selectedItemChanged',
((FrameworkEvent event) => label.text =
control_labelHandler(event.relatedObject))
);
=> or point to an actual function, instead of the inline notation here
-----Original Message-----
From: Frank Pepermans
Sent: Saturday, February 02, 2013 11:01 PM
To: dev@flex.apache.org
Subject: Re: [Dart] - playing around
Spotted that project as well,
Only downside is, that it targets the HTML5 canvas (well, if you consider
that a downside at all).
I've a ComboBox and RichText up and running that target HTML select and span
in the background,
but with a Flex-y API.
Will dig in some more,
early demo at http://www.igindo.com/dart/dartPlay.html
the main dart for that page looks like this,
basically, it's a lot of combo boxes and a rich text, added to HGroups and a
VGroup,
most are at 100% width and height, some are fixed size :
VGroup container = new VGroup(elementId: '#sample_container_id')
..percentWidth = 100.0
..percentHeight = 100.0;
HGroup topContainer = new HGroup()
..percentWidth = 100.0
..percentHeight = 100.0;
HGroup middleContainer = new HGroup()
..percentWidth = 100.0
..height = 100;
HGroup bottomContainer = new HGroup()
..percentWidth = 100.0
..height = 50;
RichText label = new RichText()
..text = 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut
justo ligula, suscipit id venenatis eu, dictum eu augue. Vestibulum et nibh
arcu. Nullam gravida risus ac ipsum congue nec ullamcorper lorem iaculis.
Vestibulum tellus sapien, interdum ut mollis eget, consequat a elit.
Vestibulum eu libero ac leo aliquet blandit. Suspendisse eget erat vitae
risus mattis bibendum. Integer diam nibh, egestas nec commodo quis, rutrum
ut lacus. Duis pellentesque metus sit amet mauris facilisis sed aliquet sem
ultrices. Suspendisse eget nisi nulla. Praesent rutrum, lorem at malesuada
fringilla, est mi malesuada dui, eleifend cursus velit augue sed dolor. Nunc
viverra risus a elit rutrum feugiat.'
..width = 100
..percentHeight = 100.0;
ComboBox boxA = new ComboBox()
..labelFunction = control_labelHandler
..percentWidth = 100.0
..percentHeight = 100.0
..dataProvider = createDataProvider();
ComboBox boxB = new ComboBox()
..labelFunction = control_labelHandler
..percentWidth = 100.0
..percentHeight = 100.0
..dataProvider = createDataProvider();
ComboBox boxC = new ComboBox()
..labelFunction = control_labelHandler
..percentWidth = 100.0
..percentHeight = 100.0
..dataProvider = createDataProvider();
ComboBox boxD = new ComboBox()
..labelFunction = control_labelHandler
..percentWidth = 100.0
..percentHeight = 100.0
..dataProvider = createDataProvider();
ComboBox boxE = new ComboBox()
..labelFunction = control_labelHandler
..percentWidth = 100.0
..percentHeight = 100.0
..dataProvider = createDataProvider();
ComboBox boxF = new ComboBox()
..labelFunction = control_labelHandler
..percentWidth = 100.0
..percentHeight = 100.0
..dataProvider = createDataProvider();
container.add(topContainer);
container.add(middleContainer);
container.add(bottomContainer);
topContainer.add(label);
topContainer.add(boxA);
topContainer.add(boxB);
bottomContainer.add(boxC);
bottomContainer.add(boxD);
middleContainer.add(boxE);
middleContainer.add(boxF);
-----Original Message-----
From: Nick Tsitlakidis
Sent: Saturday, February 02, 2013 7:49 PM
To: dev@flex.apache.org
Subject: Re: [Dart] - playing around
I've been also checking out Dart lately. And I decided to do so after
discovering this : http://www.dartflash.com/
Based on dartflash I started implementing a small ui framework which will
have most of the functionality of the Flex ui components (skinning, similar
api etc).
It's still VERY early to see how this will go but I have some ideas and I
plan to do it in github with a colleague of mine as soon as we find time.
The plan is to add some basic ui components on top of dartflash and if this
succeeds then we can take it a step further.
On Sat, Feb 2, 2013 at 3:17 PM, Frank Pepermans
<fr...@hotmail.com>wrote:
> I've been playing around with Dart for a day,
> been doing a huge Flex project for 2 years, but the next one will have to
> be HTML,
> so I decided to give it a good look, as I always do, by developing a small
> project.
>
> I chose to try and build a very small Flex-like framework and see how far
> I could get.
> Doing so, I really started liking this Dart, and the mini Flex stuff is
> doing what it is supposed to do.
>
> Some things that I decided to create :
> - framework events
> // Dart has DOM events, but nothing outside of DOM objects
> - list collection
> // Like ArrayCollection, it takes an Iterator as source, and dispatches
> events on add, remove, ... to facilitate a dataProvider functionality in a
> component
> - layouts
> // vertical and horizontal layouts to position elements within a DIV
> - group, hgroup, vgroup
> // They represent a container, in my case a DIV, and have a layout to
> position elements that are added to it
> - combo box
> // wraps around a HTML select
>
> UI components, like their Flex counterparts, would have a life cycle,
> and functionality to invalidate a component after properties are set, or
> the layout needs updating.
>
> Dart has operator overloads, so my invalidateProperties for example looks
> like this :
>
> set foo(Bar value) {
> _foo = value;
>
> // on the next update cycle, trigger commitProperties and handle the
> new property value
> later > commitProperties;
> }
>
> The ListCollection has similar overloads, so you can do :
>
> ListCollection list = new List();
>
> // add 2 elements to the list
> list + foo;
> list + bar;
>
> // invert the list
> list = -list;
>
> ComboBox box = new ComboBox();
>
> box + foo; // adds foo to the internal dataProvider of box
>
> As in Flex, assign a ListCollection to a ComboBox, and any direct changes
> to the list will update the ComboBox as well.
>
> Bring them all together and you get something like :
>
> void main() {
> // assign a DIV to a VGroup
> // VGroup auto has vertical layout
> VGroup container = new VGroup('#html_div_id');
>
> ComboBox comboBox = new ComboBox();
> ComboBox anotherComboBox = new ComboBox();
>
> container.add(comboBox);
> container.add(anotherComboBox);
>
> comboBox + {label: 'item 1'};
> comboBox + {label: 'item 2'};
>
> anotherComboBox + {label: 'item 3'};
> anotherComboBox + {label: 'item 4'};
> }
>
> I'm only a good day in Dart, but liking it a lot.
>
> Dunno if someone is already doing a dart flex project, could very well be,
> I just wanted to get my hands dirty for now,
> would a dart flex framework be something worth considering for the Apache
> Flex project?
> I am well aware of the FalconJS effords, but they could be evaluated in
> parallel?
--
Nick Tsitlakidis,
CEO and Software Architect at Perfect Edge LTD.
www.perfectedz.com
Re: [Dart] - playing around
Posted by Christophe Herreman <ch...@gmail.com>.
I have been working on a POC that uses Dart, Dart Web Components and
Twitter Bootstrap in order to create a declarative MXML-like (UI) framework.
More info:
https://github.com/cherreman/dart-playground/tree/master/bootstrap_components
regards,
Christophe
2013/2/3 Frank Wienberg <fr...@jangaroo.net>
> On Sun, Feb 3, 2013 at 6:29 AM, Om <bi...@gmail.com> wrote:
>
> > Dart is supported only on IE9+
> >
> >
> I can understand this decision. Implementing high-level language features
> in a JS version that does not even allow get/set functions or
> non-enumerable custom properties really is a pain.
> But to be enterprise-friendly, we so far plan to try and support IE7+
> (well, at least IE8) with Apache Flex/JS.
>
--
Christophe Herreman
http://www.herrodius.com
http://www.springactionscript.org
http://www.as3commons.org
Re: [Dart] - playing around
Posted by Frank Wienberg <fr...@jangaroo.net>.
On Sun, Feb 3, 2013 at 6:29 AM, Om <bi...@gmail.com> wrote:
> Dart is supported only on IE9+
>
>
I can understand this decision. Implementing high-level language features
in a JS version that does not even allow get/set functions or
non-enumerable custom properties really is a pain.
But to be enterprise-friendly, we so far plan to try and support IE7+
(well, at least IE8) with Apache Flex/JS.
Re: [Dart] - playing around
Posted by Om <bi...@gmail.com>.
On Sat, Feb 2, 2013 at 9:14 PM, Alex Harui <ah...@adobe.com> wrote:
>
>
>
> On 2/2/13 9:06 PM, "Alain Ekambi" <ja...@gmail.com> wrote:
>
> > Well Dart compiles to JavaScript. So it will work there too
> Hmm. Maybe there's FUD out there then. Like this:
>
>
> http://stackoverflow.com/questions/11209668/does-google-dart-produce-es5-fri
> endly-javascript-and-does-that-include-or-exclud
>
>
>
I don think that is FUD. The question was answered by one of the guys
working on the Dart. Dart is supported only on IE9+
Om
Re: [Dart] - playing around
Posted by Alain Ekambi <ja...@gmail.com>.
Well actually it's not true for ie 6 :)
On Feb 3, 2013 6:06 AM, "Alain Ekambi" <ja...@gmail.com> wrote:
> Well Dart compiles to JavaScript. So it will work there too
> On Feb 3, 2013 5:58 AM, "Alex Harui" <ah...@adobe.com> wrote:
>
>>
>>
>>
>> On 2/2/13 3:02 PM, "Frank Pepermans" <fr...@hotmail.com> wrote:
>>
>> > Dart as a language may be more accessible to non-Flex coders,
>> > if it really kicks off that is.
>> That's the main reason I stayed with plain old JavaScript. It isn't clear
>> to me that Dart will run in the places we need it to run, especially in
>> enterprises stuck on some older version of IE.
>> >
>>
>>
>> --
>> Alex Harui
>> Flex SDK Team
>> Adobe Systems, Inc.
>> http://blogs.adobe.com/aharui
>>
>>
Re: [Dart] - playing around
Posted by Alex Harui <ah...@adobe.com>.
On 2/2/13 9:06 PM, "Alain Ekambi" <ja...@gmail.com> wrote:
> Well Dart compiles to JavaScript. So it will work there too
Hmm. Maybe there's FUD out there then. Like this:
http://stackoverflow.com/questions/11209668/does-google-dart-produce-es5-fri
endly-javascript-and-does-that-include-or-exclud
--
Alex Harui
Flex SDK Team
Adobe Systems, Inc.
http://blogs.adobe.com/aharui
Re: [Dart] - playing around
Posted by Alain Ekambi <ja...@gmail.com>.
Well Dart compiles to JavaScript. So it will work there too
On Feb 3, 2013 5:58 AM, "Alex Harui" <ah...@adobe.com> wrote:
>
>
>
> On 2/2/13 3:02 PM, "Frank Pepermans" <fr...@hotmail.com> wrote:
>
> > Dart as a language may be more accessible to non-Flex coders,
> > if it really kicks off that is.
> That's the main reason I stayed with plain old JavaScript. It isn't clear
> to me that Dart will run in the places we need it to run, especially in
> enterprises stuck on some older version of IE.
> >
>
>
> --
> Alex Harui
> Flex SDK Team
> Adobe Systems, Inc.
> http://blogs.adobe.com/aharui
>
>
RE: [Dart] - playing around
Posted by Frank Pepermans <fr...@hotmail.com>.
Anything below IE9 would be hard to support,
by the time Dart and Apache Flex mature, it may indeed be no longer a very big issue.
For Flex, you could do the opposite of Dart,Dart will use the DartVM if the browser supports it,and fall back to js for others
Flex could target recent browsers, and switch to swf for older ones.
Might be less of a nightmare to support?
@Christophe, looking nice already, I love the web UI myself, looking forward to dig in some more
> Subject: RE: [Dart] - playing around
> Date: Mon, 4 Feb 2013 07:33:16 -0500
> From: mark.kessler.ctr@usmc.mil
> To: dev@flex.apache.org
>
> *hit the nail on the head*
>
> IE7 / 8 still here in the MC. But besides government use, a lot of statistics show a dramatic decline in IE use thank goodness. Even though DISA has approved IE9 it will be a while before it's pushed through. I believe IE10 will be the first HTML5 compatible IE version.
>
> http://gs.statcounter.com/
> http://www.netmarketshare.com/browser-market-share.aspx?qprid=1
> http://en.wikipedia.org/wiki/Usage_share_of_web_browsers
>
> -Mark
>
> -----Original Message-----
> From: Alex Harui [mailto:aharui@adobe.com]
> Sent: Saturday, February 02, 2013 11:58 PM
> To: dev@flex.apache.org
> Subject: Re: [Dart] - playing around
>
>
>
>
> On 2/2/13 3:02 PM, "Frank Pepermans" <fr...@hotmail.com> wrote:
>
> > Dart as a language may be more accessible to non-Flex coders,
> > if it really kicks off that is.
> That's the main reason I stayed with plain old JavaScript. It isn't clear
> to me that Dart will run in the places we need it to run, especially in
> enterprises stuck on some older version of IE.
> >
>
>
> --
> Alex Harui
> Flex SDK Team
> Adobe Systems, Inc.
> http://blogs.adobe.com/aharui
>
RE: [Dart] - playing around
Posted by Kessler CTR Mark J <ma...@usmc.mil>.
*hit the nail on the head*
IE7 / 8 still here in the MC. But besides government use, a lot of statistics show a dramatic decline in IE use thank goodness. Even though DISA has approved IE9 it will be a while before it's pushed through. I believe IE10 will be the first HTML5 compatible IE version.
http://gs.statcounter.com/
http://www.netmarketshare.com/browser-market-share.aspx?qprid=1
http://en.wikipedia.org/wiki/Usage_share_of_web_browsers
-Mark
-----Original Message-----
From: Alex Harui [mailto:aharui@adobe.com]
Sent: Saturday, February 02, 2013 11:58 PM
To: dev@flex.apache.org
Subject: Re: [Dart] - playing around
On 2/2/13 3:02 PM, "Frank Pepermans" <fr...@hotmail.com> wrote:
> Dart as a language may be more accessible to non-Flex coders,
> if it really kicks off that is.
That's the main reason I stayed with plain old JavaScript. It isn't clear
to me that Dart will run in the places we need it to run, especially in
enterprises stuck on some older version of IE.
>
--
Alex Harui
Flex SDK Team
Adobe Systems, Inc.
http://blogs.adobe.com/aharui
Re: [Dart] - playing around
Posted by Alex Harui <ah...@adobe.com>.
On 2/2/13 3:02 PM, "Frank Pepermans" <fr...@hotmail.com> wrote:
> Dart as a language may be more accessible to non-Flex coders,
> if it really kicks off that is.
That's the main reason I stayed with plain old JavaScript. It isn't clear
to me that Dart will run in the places we need it to run, especially in
enterprises stuck on some older version of IE.
>
--
Alex Harui
Flex SDK Team
Adobe Systems, Inc.
http://blogs.adobe.com/aharui
Re: [Dart] - playing around
Posted by Frank Pepermans <fr...@hotmail.com>.
Dart as a language may be more accessible to non-Flex coders,
if it really kicks off that is.
I've nothing against Actionscript myself, but perhaps it will always turn
off people because it used to be 1 - on - 1 to Flash?
and Dart also has JavaScript interop support,
has really nice language features (factory, future, overloading, ...).
Those can all be added via Falcon of course.
-----Original Message-----
From: Frank Wienberg
Sent: Saturday, February 02, 2013 11:53 PM
To: dev@flex.apache.org
Subject: Re: [Dart] - playing around
Something like dartflash is also available in ActionScript, namely
JooFlash<https://github.com/CoreMedia/jangaroo-libs/tree/master/jooflash/src/main/joo>,
which again is compiled to JavaScript, currently by the Jangaroo compiler
and hopefully soon by FalconJx.
So what exactly is the advantage of using Dart instead of ActionScript for
something Flex-like?
Just asking,
-Frank-
Re: [Dart] - playing around
Posted by Nick Tsitlakidis <ni...@perfectedz.com>.
missed a word there.
*doesnt *use *markup
On Sun, Feb 3, 2013 at 1:40 AM, Nick Tsitlakidis <ni...@perfectedz.com>wrote:
> To be honest, I didnt know about JooFlash.
> The reason why I started messing around with Dart is because I wanted to
> see how it works and I was looking for a language which is similar to AS3.
> Dart is similar in many parts of it and dartflash made it even more.
>
> I think that it doesn't have a specific advantage compared to AS if you
> want to build something like Flex. On the other hand, what I'm trying to
> build isn't Flex. I would describe it as a small ui framework that looks
> like Flex when it comes to components but it doesn't markup and it
> certainly doesn't provide you with all the possibilities that Flex does.
>
> The moment I'll feel I need to do something like this, I think I'll join
> Eric or Alex with their prototypes. :)
>
>
>
> On Sun, Feb 3, 2013 at 12:53 AM, Frank Wienberg <fr...@jangaroo.net>wrote:
>
>> Something like dartflash is also available in ActionScript, namely
>> JooFlash<
>> https://github.com/CoreMedia/jangaroo-libs/tree/master/jooflash/src/main/joo
>> >,
>> which again is compiled to JavaScript, currently by the Jangaroo compiler
>> and hopefully soon by FalconJx.
>> So what exactly is the advantage of using Dart instead of ActionScript for
>> something Flex-like?
>> Just asking,
>> -Frank-
>>
>
>
>
> --
> Nick Tsitlakidis,
>
> CEO and Software Architect at Perfect Edge LTD.
> www.perfectedz.com
>
--
Nick Tsitlakidis,
CEO and Software Architect at Perfect Edge LTD.
www.perfectedz.com
Re: [Dart] - playing around
Posted by Nick Tsitlakidis <ni...@perfectedz.com>.
To be honest, I didnt know about JooFlash.
The reason why I started messing around with Dart is because I wanted to
see how it works and I was looking for a language which is similar to AS3.
Dart is similar in many parts of it and dartflash made it even more.
I think that it doesn't have a specific advantage compared to AS if you
want to build something like Flex. On the other hand, what I'm trying to
build isn't Flex. I would describe it as a small ui framework that looks
like Flex when it comes to components but it doesn't markup and it
certainly doesn't provide you with all the possibilities that Flex does.
The moment I'll feel I need to do something like this, I think I'll join
Eric or Alex with their prototypes. :)
On Sun, Feb 3, 2013 at 12:53 AM, Frank Wienberg <fr...@jangaroo.net> wrote:
> Something like dartflash is also available in ActionScript, namely
> JooFlash<
> https://github.com/CoreMedia/jangaroo-libs/tree/master/jooflash/src/main/joo
> >,
> which again is compiled to JavaScript, currently by the Jangaroo compiler
> and hopefully soon by FalconJx.
> So what exactly is the advantage of using Dart instead of ActionScript for
> something Flex-like?
> Just asking,
> -Frank-
>
--
Nick Tsitlakidis,
CEO and Software Architect at Perfect Edge LTD.
www.perfectedz.com
Re: [Dart] - playing around
Posted by Frank Wienberg <fr...@jangaroo.net>.
Something like dartflash is also available in ActionScript, namely
JooFlash<https://github.com/CoreMedia/jangaroo-libs/tree/master/jooflash/src/main/joo>,
which again is compiled to JavaScript, currently by the Jangaroo compiler
and hopefully soon by FalconJx.
So what exactly is the advantage of using Dart instead of ActionScript for
something Flex-like?
Just asking,
-Frank-
Re: [Dart] - playing around
Posted by Frank Pepermans <fr...@hotmail.com>.
Spotted that project as well,
Only downside is, that it targets the HTML5 canvas (well, if you consider
that a downside at all).
I've a ComboBox and RichText up and running that target HTML select and span
in the background,
but with a Flex-y API.
Will dig in some more,
early demo at http://www.igindo.com/dart/dartPlay.html
the main dart for that page looks like this,
basically, it's a lot of combo boxes and a rich text, added to HGroups and a
VGroup,
most are at 100% width and height, some are fixed size :
VGroup container = new VGroup(elementId: '#sample_container_id')
..percentWidth = 100.0
..percentHeight = 100.0;
HGroup topContainer = new HGroup()
..percentWidth = 100.0
..percentHeight = 100.0;
HGroup middleContainer = new HGroup()
..percentWidth = 100.0
..height = 100;
HGroup bottomContainer = new HGroup()
..percentWidth = 100.0
..height = 50;
RichText label = new RichText()
..text = 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut
justo ligula, suscipit id venenatis eu, dictum eu augue. Vestibulum et nibh
arcu. Nullam gravida risus ac ipsum congue nec ullamcorper lorem iaculis.
Vestibulum tellus sapien, interdum ut mollis eget, consequat a elit.
Vestibulum eu libero ac leo aliquet blandit. Suspendisse eget erat vitae
risus mattis bibendum. Integer diam nibh, egestas nec commodo quis, rutrum
ut lacus. Duis pellentesque metus sit amet mauris facilisis sed aliquet sem
ultrices. Suspendisse eget nisi nulla. Praesent rutrum, lorem at malesuada
fringilla, est mi malesuada dui, eleifend cursus velit augue sed dolor. Nunc
viverra risus a elit rutrum feugiat.'
..width = 100
..percentHeight = 100.0;
ComboBox boxA = new ComboBox()
..labelFunction = control_labelHandler
..percentWidth = 100.0
..percentHeight = 100.0
..dataProvider = createDataProvider();
ComboBox boxB = new ComboBox()
..labelFunction = control_labelHandler
..percentWidth = 100.0
..percentHeight = 100.0
..dataProvider = createDataProvider();
ComboBox boxC = new ComboBox()
..labelFunction = control_labelHandler
..percentWidth = 100.0
..percentHeight = 100.0
..dataProvider = createDataProvider();
ComboBox boxD = new ComboBox()
..labelFunction = control_labelHandler
..percentWidth = 100.0
..percentHeight = 100.0
..dataProvider = createDataProvider();
ComboBox boxE = new ComboBox()
..labelFunction = control_labelHandler
..percentWidth = 100.0
..percentHeight = 100.0
..dataProvider = createDataProvider();
ComboBox boxF = new ComboBox()
..labelFunction = control_labelHandler
..percentWidth = 100.0
..percentHeight = 100.0
..dataProvider = createDataProvider();
container.add(topContainer);
container.add(middleContainer);
container.add(bottomContainer);
topContainer.add(label);
topContainer.add(boxA);
topContainer.add(boxB);
bottomContainer.add(boxC);
bottomContainer.add(boxD);
middleContainer.add(boxE);
middleContainer.add(boxF);
-----Original Message-----
From: Nick Tsitlakidis
Sent: Saturday, February 02, 2013 7:49 PM
To: dev@flex.apache.org
Subject: Re: [Dart] - playing around
I've been also checking out Dart lately. And I decided to do so after
discovering this : http://www.dartflash.com/
Based on dartflash I started implementing a small ui framework which will
have most of the functionality of the Flex ui components (skinning, similar
api etc).
It's still VERY early to see how this will go but I have some ideas and I
plan to do it in github with a colleague of mine as soon as we find time.
The plan is to add some basic ui components on top of dartflash and if this
succeeds then we can take it a step further.
On Sat, Feb 2, 2013 at 3:17 PM, Frank Pepermans
<fr...@hotmail.com>wrote:
> I've been playing around with Dart for a day,
> been doing a huge Flex project for 2 years, but the next one will have to
> be HTML,
> so I decided to give it a good look, as I always do, by developing a small
> project.
>
> I chose to try and build a very small Flex-like framework and see how far
> I could get.
> Doing so, I really started liking this Dart, and the mini Flex stuff is
> doing what it is supposed to do.
>
> Some things that I decided to create :
> - framework events
> // Dart has DOM events, but nothing outside of DOM objects
> - list collection
> // Like ArrayCollection, it takes an Iterator as source, and dispatches
> events on add, remove, ... to facilitate a dataProvider functionality in a
> component
> - layouts
> // vertical and horizontal layouts to position elements within a DIV
> - group, hgroup, vgroup
> // They represent a container, in my case a DIV, and have a layout to
> position elements that are added to it
> - combo box
> // wraps around a HTML select
>
> UI components, like their Flex counterparts, would have a life cycle,
> and functionality to invalidate a component after properties are set, or
> the layout needs updating.
>
> Dart has operator overloads, so my invalidateProperties for example looks
> like this :
>
> set foo(Bar value) {
> _foo = value;
>
> // on the next update cycle, trigger commitProperties and handle the
> new property value
> later > commitProperties;
> }
>
> The ListCollection has similar overloads, so you can do :
>
> ListCollection list = new List();
>
> // add 2 elements to the list
> list + foo;
> list + bar;
>
> // invert the list
> list = -list;
>
> ComboBox box = new ComboBox();
>
> box + foo; // adds foo to the internal dataProvider of box
>
> As in Flex, assign a ListCollection to a ComboBox, and any direct changes
> to the list will update the ComboBox as well.
>
> Bring them all together and you get something like :
>
> void main() {
> // assign a DIV to a VGroup
> // VGroup auto has vertical layout
> VGroup container = new VGroup('#html_div_id');
>
> ComboBox comboBox = new ComboBox();
> ComboBox anotherComboBox = new ComboBox();
>
> container.add(comboBox);
> container.add(anotherComboBox);
>
> comboBox + {label: 'item 1'};
> comboBox + {label: 'item 2'};
>
> anotherComboBox + {label: 'item 3'};
> anotherComboBox + {label: 'item 4'};
> }
>
> I'm only a good day in Dart, but liking it a lot.
>
> Dunno if someone is already doing a dart flex project, could very well be,
> I just wanted to get my hands dirty for now,
> would a dart flex framework be something worth considering for the Apache
> Flex project?
> I am well aware of the FalconJS effords, but they could be evaluated in
> parallel?
--
Nick Tsitlakidis,
CEO and Software Architect at Perfect Edge LTD.
www.perfectedz.com
Re: [Dart] - playing around
Posted by Nick Tsitlakidis <ni...@perfectedz.com>.
I've been also checking out Dart lately. And I decided to do so after
discovering this : http://www.dartflash.com/
Based on dartflash I started implementing a small ui framework which will
have most of the functionality of the Flex ui components (skinning, similar
api etc).
It's still VERY early to see how this will go but I have some ideas and I
plan to do it in github with a colleague of mine as soon as we find time.
The plan is to add some basic ui components on top of dartflash and if this
succeeds then we can take it a step further.
On Sat, Feb 2, 2013 at 3:17 PM, Frank Pepermans <fr...@hotmail.com>wrote:
> I've been playing around with Dart for a day,
> been doing a huge Flex project for 2 years, but the next one will have to
> be HTML,
> so I decided to give it a good look, as I always do, by developing a small
> project.
>
> I chose to try and build a very small Flex-like framework and see how far
> I could get.
> Doing so, I really started liking this Dart, and the mini Flex stuff is
> doing what it is supposed to do.
>
> Some things that I decided to create :
> - framework events
> // Dart has DOM events, but nothing outside of DOM objects
> - list collection
> // Like ArrayCollection, it takes an Iterator as source, and dispatches
> events on add, remove, ... to facilitate a dataProvider functionality in a
> component
> - layouts
> // vertical and horizontal layouts to position elements within a DIV
> - group, hgroup, vgroup
> // They represent a container, in my case a DIV, and have a layout to
> position elements that are added to it
> - combo box
> // wraps around a HTML select
>
> UI components, like their Flex counterparts, would have a life cycle,
> and functionality to invalidate a component after properties are set, or
> the layout needs updating.
>
> Dart has operator overloads, so my invalidateProperties for example looks
> like this :
>
> set foo(Bar value) {
> _foo = value;
>
> // on the next update cycle, trigger commitProperties and handle the
> new property value
> later > commitProperties;
> }
>
> The ListCollection has similar overloads, so you can do :
>
> ListCollection list = new List();
>
> // add 2 elements to the list
> list + foo;
> list + bar;
>
> // invert the list
> list = -list;
>
> ComboBox box = new ComboBox();
>
> box + foo; // adds foo to the internal dataProvider of box
>
> As in Flex, assign a ListCollection to a ComboBox, and any direct changes
> to the list will update the ComboBox as well.
>
> Bring them all together and you get something like :
>
> void main() {
> // assign a DIV to a VGroup
> // VGroup auto has vertical layout
> VGroup container = new VGroup('#html_div_id');
>
> ComboBox comboBox = new ComboBox();
> ComboBox anotherComboBox = new ComboBox();
>
> container.add(comboBox);
> container.add(anotherComboBox);
>
> comboBox + {label: 'item 1'};
> comboBox + {label: 'item 2'};
>
> anotherComboBox + {label: 'item 3'};
> anotherComboBox + {label: 'item 4'};
> }
>
> I'm only a good day in Dart, but liking it a lot.
>
> Dunno if someone is already doing a dart flex project, could very well be,
> I just wanted to get my hands dirty for now,
> would a dart flex framework be something worth considering for the Apache
> Flex project?
> I am well aware of the FalconJS effords, but they could be evaluated in
> parallel?
--
Nick Tsitlakidis,
CEO and Software Architect at Perfect Edge LTD.
www.perfectedz.com