On 2/26/14 4:59 PM, "Carlos Rovira" <carlos.rov...@codeoscopic.com> wrote:
>So it seems we need to wire up a similar functionality to spark >SkinnableComponent to get parts of a component or view (AS3 class) >match thinks in a skin (SVG, and eventually MXML in flash side), isn't it? > >We need [SkinPart] metadata, right? IMO, we won't be able to do Spark skinning in FlexJS. Well, at least not for this set of components that we've currently built that leverage the built-in HTML widgets. Some heavier component set will try to emulate Spark and MX components someday. Spark skins are a combination of sub components and visuals. In the older browsers, there is no way to inject sub components and certain visuals into the built-in HTML widgets. So, in the FlexJS components we've currently built, we are creating Views which hold the sub components and using CSS for the visuals. SkinPart also had a major flaw: The host component made assumptions about the parts in the skin. In general it removes flexibility when you know something about your view/children. The classic example was when Flex 4 first came out and didn't have an IconButton. There was no way to add an assignable icon property with subclassing Button. In FlexJS, you replace the model and the view. > > > >2014-02-27 1:03 GMT+01:00 OmPrakash Muppirala <bigosma...@gmail.com>: > >> On Wed, Feb 26, 2014 at 9:57 AM, Alex Harui <aha...@adobe.com> wrote: >> >> > Sorry, wasn't clear. >> > >> > Thanks for reminding me that FXG is a class linked into the SWF and >> > referenced as a class by the AS code. On the JS side, do we want that >> FXG >> > class to be a "class" (its own JS file that loads or has SVG data in >>it)? >> > Or is more "conversion" needed. >> > >> > >> I have been thinking of a spark skin (ex. spark button skin) having an >> equivalent SVG document on the JS side. The button class itself will >>have >> an equivalent in js. >> >> Example: >> TextButton.as + TextButtonSkin.mxml === TextButton.js + >>TextButtonSkin.svg >> >> The TextButtonSkin.mxml links all the required FXGs to make up the >>various >> button states' visuals. It also has the code required to switch the >> states, etc. The same thing happens in TextButtonSkin.svg - it contains >> all the SVG elements and the JS code (or SMIL) >> >> I suppose this is quite similar to the spark architecture. >> >> >> > On the JS side, is there is a way to embed SVG data in an HTML page? >> > >> >> There are multiple ways to this - >> * inline svg code in HTML, >> * use <embed> element (what I have used in this case) >> * use <object> element >> * use <img> element >> >> <embed> seems to be safe to use across most modern browsers, whereas >> <object> has browser support issues + security restrictions. <img> >>element >> is useless to us because it causes the SVG to lose its interactivity. >> >> I suppose we can also directly emebed SVG in HTML, it seems safe to use >> these days [1] >> >> [1] http://caniuse.com/#feat=svg-html5 >> >> >> > >> > -Alex >> > >> > On 2/26/14 12:59 AM, "OmPrakash Muppirala" <bigosma...@gmail.com> >>wrote: >> > >> > >On Wed, Feb 26, 2014 at 12:48 AM, Alex Harui <aha...@adobe.com> >>wrote: >> > > >> > >> >> > >> >> > >> On 2/26/14 12:42 AM, "OmPrakash Muppirala" <bigosma...@gmail.com> >> > wrote: >> > >> >> > >> >>3. Falcon should be able to compile FXG now, but I think it will >>use >> > >> >>Spark >> > >> >> components like Group. The compiler either needs to output >> different >> > >> >> primitives or we need to fake up lighter weight Spark >>components. >> > >>I'd >> > >> >> strongly prefer the first option. >> > >> >> >> > >> > >> > >> >I think I understand. Can we break this up into a very simple use >> case >> > >> >and >> > >> >see which direction we want to go? I may need a bit of hand >>holding >> on >> > >> >this one. >> > >> >> > >> Was FXG always embedded? >> > >> >> > >> >> > >You can also instantiate it just like a component in MXML. If you >>embed >> > >it, the compiler seems to rasterize it and you will lose the scaling, >> etc. >> > >properties that makes vectors so attractive. >> > > >> > > >> > >> Is there a way to "embed" SVG? >> > >> >> > > >> > >Yes, just like an image: >> > > >> > >[Embed(source="logo.svg")] >> > >[Bindable] >> > >public var imgCls:Class; >> > > >> > >Adobe had deprecated it. But, at Apache Flex, we un-deprecated it a >> while >> > >ago. >> > > >> > >Thanks, >> > >Om >> > > >> > > >> > >> >> > >> Anyway, yes a simple test case would help us find the desired >>workflow >> > >>and >> > >> fix what is needed. >> > >> >> > >> -Alex >> > >> >> > >> >> > >> > >> > > > >-- >Carlos Rovira >Director de Tecnología >M: +34 607 22 60 05 >F: +34 912 94 80 80 >http://www.codeoscopic.com >http://www.directwriter.es >http://www.avant2.es
