On Thu, Feb 27, 2014 at 1:24 AM, Carlos Rovira < carlos.rov...@codeoscopic.com> wrote:
> Very cool Om! I'll take a look and will try to make my hands dirty with > this stuff :) > > After read your email I think that maybe only getting a SVG version of > spark components skin could be sufficient to create a good looking set of > FlexJS components, so in the end we really doesn't need FXG. I like FXG, > but having SVG, do you think w will need jt anymore in the future?. I'm > assuming that we could use SVG skins for SWF version too, so this will > unify look and feel between JS and SWF. > Currently, embedded SVG gets rasterized during compilation process. If we get a SVG -> Sprite subsystem working, we can definitely get rid if FXG and just use SVG. > > So, If this is true, we could not need to integrate the conversion tool in > the FlexJS compilation process, making it more light. > > Let me know If I'm on the way or maybe I'm missing something. > > Thanks > > Carlos > > > > > > > 2014-02-27 9:50 GMT+01:00 OmPrakash Muppirala <bigosma...@gmail.com>: > > > Thanks Carlos! I created the SVG skins from the current spark component > > skins through a combination of automation and manual coding. One of the > > tools I use is the FXG -> SVG XSLT translator available here [1] > > > > Notice that there are three xslt files, transform.xslt, > transform-over.xslt > > and transform-down.xslt. These correspond to the various states in the > > spark.skins.spark.ButtonSkin.mxml. So, for each state in the skin, you > > will need to slightly tweak the xslt and re-run it. I am hoping to > modify > > my xslt to do this automatically. Or perhaps we can write an ant script > > that does this for us. > > > > To run the XSLT, I just use an online XSLT editor like this [2] As I > said, > > very unsophisticated ;-) > > > > There are some conditions that I dont take care of yet (as noted in the > > TODO list here [3] This requires a change to the XSLT document. If you > > are up to it, please take a shot at fixing/adding stuff. > > > > Also, I am converting only these elements from FXG to SVG now: > > > > Rect (attributes: left, right, top, bottom, defs, id, x, y, width, > height, > > radiusX, radiusY, fill) > > Fill > > Stroke > > SolidColor > > LinearGradient > > LinearGradientStroke > > GradientEntry > > Label > > > > For spark.skins.spark.ButtonSkin, these elements suffice. But for > > spark.skins.spark.CheckBoxSkin, we will need the translation for the Path > > element as well. For spark.skins.spark.RadioButtonSkin, we need the > > translation for the Ellipse element > > > > As I said, the conversion mechanism is very primitive right now. If you > > are able to make progress with other components' skins, that would be a > > huge deal. > > > > Please let me know how I can help. My goal is to make this a pluggable > > tool into the FlexJS compilation step. Still a long way to get there, I > > guess. > > > > Thanks, > > Om > > > > [1] > > > > > https://fisheye6.atlassian.com/browse/~br=develop/flex-asjs/fxg2svg/transform > > [2] http://xslt.online-toolz.com/tools/xslt-transformation.php > > [3] > > > > > https://fisheye6.atlassian.com/browse/~br=develop/flex-asjs/fxg2svg/TODO.txt > > > > > > On Wed, Feb 26, 2014 at 4:16 AM, Carlos Rovira < > > carlos.rov...@codeoscopic.com> wrote: > > > > > Hi Om, > > > > > > very cool! I build the example and button looks pretty now! :) > > > > > > As you, Alex and Erik are looking for some internals, could I help > making > > > other SVG for other component in the meanwhile? (i.e: CheckBox, > > > RadioButton,...) > > > > > > Could you share more info about the methodology behind the SVG > internals > > in > > > order to build one from scratch? > > > > > > Amazing stuff! > > > > > > :) > > > > > > Carlos > > > > > > > > > -- > 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 >
