You are viewing a plain text version of this content. The canonical link for it is here.
Posted to users@flex.apache.org by pnayak <na...@yahoo.com> on 2014/08/01 00:48:04 UTC
Re: Design tools for creating Flex 4 skins
Hi,
Did you ever find an answer to this question? I'm looking for something.
Illustrator doesn't support saving as FXG. Fireworks is apparently getting
phased out. Guess Adobe is trying hard to make sure Flex is dead.
--
View this message in context: http://apache-flex-users.2333346.n4.nabble.com/Design-tools-for-creating-Flex-4-skins-tp1140p7436.html
Sent from the Apache Flex Users mailing list archive at Nabble.com.
Re: Design tools for creating Flex 4 skins
Posted by OmPrakash Muppirala <bi...@gmail.com>.
I have stuck to Illustrator CS5 and it seems to work well with .AI
documents created in more recent versions of Illustrator.
My graphic designer uses the latest version of Illustrator and I, as a
developer use CS5 to convert it into FXG as needed.
Hope this helps.
Thanks,
Om
On Thu, Jul 31, 2014 at 3:48 PM, pnayak <na...@yahoo.com> wrote:
> Hi,
>
> Did you ever find an answer to this question? I'm looking for something.
> Illustrator doesn't support saving as FXG. Fireworks is apparently getting
> phased out. Guess Adobe is trying hard to make sure Flex is dead.
>
>
>
> --
> View this message in context:
> http://apache-flex-users.2333346.n4.nabble.com/Design-tools-for-creating-Flex-4-skins-tp1140p7436.html
> Sent from the Apache Flex Users mailing list archive at Nabble.com.
>
Re: Design tools for creating Flex 4 skins
Posted by jude <fl...@gmail.com>.
BTW There is an open source FXG tool online here,
http://fxgeditor.7jigen.net/. I was hoping to incorporate this into Radii8
to allow it to create skins. Basically, when you double click on a
component in Radii8 the jigen editor would open (in the app) and you could
modify the skin. When you were done editing, the editor would close and a
new skin would be available to choose from. The jigen editor also creates
the SVG and FXG so both an SVG and FXG skin would be created. Since Radii8
generates both HTML and MXML from whatever design you give it generating
both the SVG and FXG you would have custom skins for both targets.
On Tue, Aug 5, 2014 at 6:06 PM, jude <fl...@gmail.com> wrote:
> Nice! I have had to manually remove all of that whenever I create a new
> skin.
>
>
> On Tue, Aug 5, 2014 at 5:53 PM, OmPrakash Muppirala <bi...@gmail.com>
> wrote:
>
>> On Tue, Aug 5, 2014 at 3:45 PM, jude <fl...@gmail.com> wrote:
>>
>> > How is FXG broken? Do you mean when you paste it into each of these
>> > different places they all render differently? If that's true that's
>> because
>> > they are converting to their own internal representation. Flash Catalyst
>> > was great at cleaning up the exported FXG from Illustrator. I would
>> create
>> > a vector in Illustrator, go to save (as FXG) and copy the FXG to the
>> > clipboard, then in FC paste and it would pop open a dialog that let you
>> > choose how to handle the import. For example, it would rasterize some
>> > things if you didn't tell it not to.
>> >
>> > But I agree that it would not always look the same as the original in
>> > Illustrator. I think FXG is supposed to be better than SVG (at least 1.0
>> > SVG).
>> >
>> >
>> I wrote this tool [1] that cleans up FXG created by Illustrator. I have
>> been using it successfully for my personal projects and for the Android
>> 4.x
>> skinning I have been working on for Apache Flex.
>>
>> The tool does the following:
>>
>> 1. For each Symbol in the Symbols library, creates a new .FXG file
>> 2. Removes all unnecessary AI related stuff
>> 3. Removes unnecessary nested Groups.
>>
>> I hope others will find this tool useful as well.
>>
>> Thanks,
>> Om
>>
>> [1]
>>
>> https://github.com/apache/flex-utilities/blob/develop/FXGTools/src/WriteFXG.mxml
>>
>>
>>
>> >
>> > On Tue, Aug 5, 2014 at 1:59 PM, Jason Taylor <ja...@dedoose.com> wrote:
>> >
>> > > I have found inscape to be very good. FXG is a broken format afaik as
>> > > flash, illustrator, and flex seem to all do different things
>> depending on
>> > > the version. The route I then chose was to go with SVG. Flex's native
>> > > support of SVG initially was a bit lacking so we developed a
>> component to
>> > > better support that. Once vector SVGs were handled well, it has been
>> > easy
>> > > to make vector based skins in either Illustrator, or Inkscape (the
>> only
>> > 2 I
>> > > tried). When saving the svg from inkscape, as as Optimized SVG.
>> > >
>> > > Following is the VectorImage I use for displaying SVG's in flex. Some
>> of
>> > > this code was borrowed from a stack overflow answer, and a lot was
>> > modified
>> > > to make it work in our use cases. Good luck!
>> > >
>> > > ~ JT
>> > >
>> > >
>> > > import flash.display.DisplayObject;
>> > > import flash.geom.Rectangle;
>> > > import mx.core.UIComponent;
>> > > import spark.primitives.Rect;
>> > >
>> > > public class VectorImage extends UIComponent
>> > > {
>> > > private var _scaleUniform:Boolean = true;
>> > >
>> > > public function VectorImage(source:Class = null)
>> > > {
>> > > if(source){
>> > > this.source = source;
>> > > }
>> > > super();
>> > > }
>> > >
>> > > private var _source : Class;
>> > > protected var sourceChanged :Boolean = true;
>> > >
>> > >
>> > > public function get source():Class
>> > > {
>> > > return _source;
>> > > }
>> > >
>> > > public function set source(value:Class):void
>> > > {
>> > > _source = value;
>> > > sourceChanged = true;
>> > > this.commitProperties();
>> > > invalidateDisplayList();
>> > > }
>> > >
>> > > protected var imageInstance : DisplayObject;
>> > >
>> > >
>> > > override protected function createChildren():void{
>> > > super.createChildren();
>> > >
>> > > // if the source has changed we want to create, or
>> > > recreate, the image instance
>> > > if(this.sourceChanged){
>> > > // if the instance has a value, then delete it
>> > > if(this.imageInstance){
>> > > this.removeChild(this.imageInstance);
>> > > this.imageInstance = null;
>> > > }
>> > >
>> > > // if we have a source value; create the
>> source
>> > > if(this.source){
>> > > this.imageInstance = new source();
>> > > this.addChild(this.imageInstance);
>> > > }
>> > > this.sourceChanged = false;
>> > >
>> > > }
>> > > }
>> > >
>> > > /**
>> > > * @private
>> > > */
>> > > override protected function commitProperties():void{
>> > > super.commitProperties();
>> > >
>> > > if(this.sourceChanged){
>> > > // if the source changed re-created it; which
>> is
>> > > done in createChildren();
>> > > this.createChildren();
>> > > }
>> > > }
>> > >
>> > > override protected function measure():void
>> > > {
>> > > if(imageInstance != null)
>> > > {
>> > > this.measuredWidth = imageInstance.width;
>> > > this.measuredHeight = imageInstance.height;
>> > > this.minWidth = 5;
>> > > this.minHeight = 5;
>> > > }
>> > > }
>> > >
>> > > override public function setActualSize(width:Number,
>> > > height:Number):void
>> > > {
>> > > this.width = width;
>> > > this.height = height;
>> > > ScaleImage(width, height);
>> > > }
>> > >
>> > > /**
>> > > * @private
>> > > */
>> > > override protected function
>> > > updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void{
>> > > super.updateDisplayList(unscaledWidth,
>> unscaledHeight);
>> > >
>> > > // size the element.
>> > > // I don't remember why I Wrote the code to check for
>> > > unscaledHeight and unscaledWidth being 0
>> > >
>> > > if(imageInstance != null)
>> > > {
>> > >
>> > > //scale properly
>> > > ScaleImage(unscaledWidth, unscaledHeight);
>> > > }
>> > > }
>> > >
>> > > protected function ScaleImage(width:Number, height:Number)
>> > > {
>> > > if(imageInstance != null)
>> > > {
>> > > if(_scaleUniform == true)
>> > > {
>> > > var scale:Number =
>> > > Math.min(width/imageInstance.width, height/imageInstance.height);
>> > >
>> > > var scaleWidth:Number =
>> > > (int)(imageInstance.width * scale);
>> > > var scaleHeight:Number =
>> > > (int)(imageInstance.height * scale);
>> > >
>> > > imageInstance.width = scaleWidth;
>> > > imageInstance.height = scaleHeight;
>> > >
>> > > imageInstance.x = (width -
>> > > imageInstance.width) *.5;
>> > > imageInstance.y = (height-
>> > > imageInstance.height) *.5;
>> > > }
>> > > else
>> > > {
>> > > imageInstance.width = width;
>> > > imageInstance.height = height;
>> > > }
>> > >
>> > > }
>> > > }
>> > >
>> > > public function get ScaleUniform():Boolean
>> > > {
>> > > return _scaleUniform;
>> > > }
>> > >
>> > > public function set ScaleUniform(value:Boolean):void
>> > > {
>> > > _scaleUniform = value;
>> > > }
>> > > }
>> > >
>> > >
>> > >
>> > > -----Original Message-----
>> > > From: Kessler CTR Mark J [mailto:mark.kessler.ctr@usmc.mil]
>> > > Sent: Friday, August 01, 2014 4:11 AM
>> > > To: users@flex.apache.org
>> > > Subject: RE: Design tools for creating Flex 4 skins
>> > >
>> > > Inkscape is what I'm waiting on personally. But they've taken years
>> to
>> > > work towards this next major release. You can track release progress
>> > [1].
>> > > So a few more months it looks like.
>> > >
>> > >
>> > > [1] http://www.inkscape.org/en/develop/next-release/
>> > >
>> > > -Mark
>> > >
>> > > -----Original Message-----
>> > > From: Sascha Ahrend [mailto:sahrend@icloud.com]
>> > > Sent: Friday, August 01, 2014 3:49 AM
>> > > To: users@flex.apache.org
>> > > Cc: users@flex.apache.org
>> > > Subject: Re: Design tools for creating Flex 4 skins
>> > >
>> > > Inkscape may be an alternative.
>> > > Check out this article describing the workflow:
>> > >
>> > >
>> > >
>> >
>> http://blog.devinholloway.com/2013/08/using-inkscape-to-generate-fxg-from.html?m=1
>> > >
>> >
>>
>
>
Re: Design tools for creating Flex 4 skins
Posted by jude <fl...@gmail.com>.
Nice! I have had to manually remove all of that whenever I create a new
skin.
On Tue, Aug 5, 2014 at 5:53 PM, OmPrakash Muppirala <bi...@gmail.com>
wrote:
> On Tue, Aug 5, 2014 at 3:45 PM, jude <fl...@gmail.com> wrote:
>
> > How is FXG broken? Do you mean when you paste it into each of these
> > different places they all render differently? If that's true that's
> because
> > they are converting to their own internal representation. Flash Catalyst
> > was great at cleaning up the exported FXG from Illustrator. I would
> create
> > a vector in Illustrator, go to save (as FXG) and copy the FXG to the
> > clipboard, then in FC paste and it would pop open a dialog that let you
> > choose how to handle the import. For example, it would rasterize some
> > things if you didn't tell it not to.
> >
> > But I agree that it would not always look the same as the original in
> > Illustrator. I think FXG is supposed to be better than SVG (at least 1.0
> > SVG).
> >
> >
> I wrote this tool [1] that cleans up FXG created by Illustrator. I have
> been using it successfully for my personal projects and for the Android 4.x
> skinning I have been working on for Apache Flex.
>
> The tool does the following:
>
> 1. For each Symbol in the Symbols library, creates a new .FXG file
> 2. Removes all unnecessary AI related stuff
> 3. Removes unnecessary nested Groups.
>
> I hope others will find this tool useful as well.
>
> Thanks,
> Om
>
> [1]
>
> https://github.com/apache/flex-utilities/blob/develop/FXGTools/src/WriteFXG.mxml
>
>
>
> >
> > On Tue, Aug 5, 2014 at 1:59 PM, Jason Taylor <ja...@dedoose.com> wrote:
> >
> > > I have found inscape to be very good. FXG is a broken format afaik as
> > > flash, illustrator, and flex seem to all do different things depending
> on
> > > the version. The route I then chose was to go with SVG. Flex's native
> > > support of SVG initially was a bit lacking so we developed a component
> to
> > > better support that. Once vector SVGs were handled well, it has been
> > easy
> > > to make vector based skins in either Illustrator, or Inkscape (the only
> > 2 I
> > > tried). When saving the svg from inkscape, as as Optimized SVG.
> > >
> > > Following is the VectorImage I use for displaying SVG's in flex. Some
> of
> > > this code was borrowed from a stack overflow answer, and a lot was
> > modified
> > > to make it work in our use cases. Good luck!
> > >
> > > ~ JT
> > >
> > >
> > > import flash.display.DisplayObject;
> > > import flash.geom.Rectangle;
> > > import mx.core.UIComponent;
> > > import spark.primitives.Rect;
> > >
> > > public class VectorImage extends UIComponent
> > > {
> > > private var _scaleUniform:Boolean = true;
> > >
> > > public function VectorImage(source:Class = null)
> > > {
> > > if(source){
> > > this.source = source;
> > > }
> > > super();
> > > }
> > >
> > > private var _source : Class;
> > > protected var sourceChanged :Boolean = true;
> > >
> > >
> > > public function get source():Class
> > > {
> > > return _source;
> > > }
> > >
> > > public function set source(value:Class):void
> > > {
> > > _source = value;
> > > sourceChanged = true;
> > > this.commitProperties();
> > > invalidateDisplayList();
> > > }
> > >
> > > protected var imageInstance : DisplayObject;
> > >
> > >
> > > override protected function createChildren():void{
> > > super.createChildren();
> > >
> > > // if the source has changed we want to create, or
> > > recreate, the image instance
> > > if(this.sourceChanged){
> > > // if the instance has a value, then delete it
> > > if(this.imageInstance){
> > > this.removeChild(this.imageInstance);
> > > this.imageInstance = null;
> > > }
> > >
> > > // if we have a source value; create the source
> > > if(this.source){
> > > this.imageInstance = new source();
> > > this.addChild(this.imageInstance);
> > > }
> > > this.sourceChanged = false;
> > >
> > > }
> > > }
> > >
> > > /**
> > > * @private
> > > */
> > > override protected function commitProperties():void{
> > > super.commitProperties();
> > >
> > > if(this.sourceChanged){
> > > // if the source changed re-created it; which
> is
> > > done in createChildren();
> > > this.createChildren();
> > > }
> > > }
> > >
> > > override protected function measure():void
> > > {
> > > if(imageInstance != null)
> > > {
> > > this.measuredWidth = imageInstance.width;
> > > this.measuredHeight = imageInstance.height;
> > > this.minWidth = 5;
> > > this.minHeight = 5;
> > > }
> > > }
> > >
> > > override public function setActualSize(width:Number,
> > > height:Number):void
> > > {
> > > this.width = width;
> > > this.height = height;
> > > ScaleImage(width, height);
> > > }
> > >
> > > /**
> > > * @private
> > > */
> > > override protected function
> > > updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void{
> > > super.updateDisplayList(unscaledWidth, unscaledHeight);
> > >
> > > // size the element.
> > > // I don't remember why I Wrote the code to check for
> > > unscaledHeight and unscaledWidth being 0
> > >
> > > if(imageInstance != null)
> > > {
> > >
> > > //scale properly
> > > ScaleImage(unscaledWidth, unscaledHeight);
> > > }
> > > }
> > >
> > > protected function ScaleImage(width:Number, height:Number)
> > > {
> > > if(imageInstance != null)
> > > {
> > > if(_scaleUniform == true)
> > > {
> > > var scale:Number =
> > > Math.min(width/imageInstance.width, height/imageInstance.height);
> > >
> > > var scaleWidth:Number =
> > > (int)(imageInstance.width * scale);
> > > var scaleHeight:Number =
> > > (int)(imageInstance.height * scale);
> > >
> > > imageInstance.width = scaleWidth;
> > > imageInstance.height = scaleHeight;
> > >
> > > imageInstance.x = (width -
> > > imageInstance.width) *.5;
> > > imageInstance.y = (height-
> > > imageInstance.height) *.5;
> > > }
> > > else
> > > {
> > > imageInstance.width = width;
> > > imageInstance.height = height;
> > > }
> > >
> > > }
> > > }
> > >
> > > public function get ScaleUniform():Boolean
> > > {
> > > return _scaleUniform;
> > > }
> > >
> > > public function set ScaleUniform(value:Boolean):void
> > > {
> > > _scaleUniform = value;
> > > }
> > > }
> > >
> > >
> > >
> > > -----Original Message-----
> > > From: Kessler CTR Mark J [mailto:mark.kessler.ctr@usmc.mil]
> > > Sent: Friday, August 01, 2014 4:11 AM
> > > To: users@flex.apache.org
> > > Subject: RE: Design tools for creating Flex 4 skins
> > >
> > > Inkscape is what I'm waiting on personally. But they've taken years
> to
> > > work towards this next major release. You can track release progress
> > [1].
> > > So a few more months it looks like.
> > >
> > >
> > > [1] http://www.inkscape.org/en/develop/next-release/
> > >
> > > -Mark
> > >
> > > -----Original Message-----
> > > From: Sascha Ahrend [mailto:sahrend@icloud.com]
> > > Sent: Friday, August 01, 2014 3:49 AM
> > > To: users@flex.apache.org
> > > Cc: users@flex.apache.org
> > > Subject: Re: Design tools for creating Flex 4 skins
> > >
> > > Inkscape may be an alternative.
> > > Check out this article describing the workflow:
> > >
> > >
> > >
> >
> http://blog.devinholloway.com/2013/08/using-inkscape-to-generate-fxg-from.html?m=1
> > >
> >
>
Re: Design tools for creating Flex 4 skins
Posted by OmPrakash Muppirala <bi...@gmail.com>.
On Tue, Aug 5, 2014 at 3:45 PM, jude <fl...@gmail.com> wrote:
> How is FXG broken? Do you mean when you paste it into each of these
> different places they all render differently? If that's true that's because
> they are converting to their own internal representation. Flash Catalyst
> was great at cleaning up the exported FXG from Illustrator. I would create
> a vector in Illustrator, go to save (as FXG) and copy the FXG to the
> clipboard, then in FC paste and it would pop open a dialog that let you
> choose how to handle the import. For example, it would rasterize some
> things if you didn't tell it not to.
>
> But I agree that it would not always look the same as the original in
> Illustrator. I think FXG is supposed to be better than SVG (at least 1.0
> SVG).
>
>
I wrote this tool [1] that cleans up FXG created by Illustrator. I have
been using it successfully for my personal projects and for the Android 4.x
skinning I have been working on for Apache Flex.
The tool does the following:
1. For each Symbol in the Symbols library, creates a new .FXG file
2. Removes all unnecessary AI related stuff
3. Removes unnecessary nested Groups.
I hope others will find this tool useful as well.
Thanks,
Om
[1]
https://github.com/apache/flex-utilities/blob/develop/FXGTools/src/WriteFXG.mxml
>
> On Tue, Aug 5, 2014 at 1:59 PM, Jason Taylor <ja...@dedoose.com> wrote:
>
> > I have found inscape to be very good. FXG is a broken format afaik as
> > flash, illustrator, and flex seem to all do different things depending on
> > the version. The route I then chose was to go with SVG. Flex's native
> > support of SVG initially was a bit lacking so we developed a component to
> > better support that. Once vector SVGs were handled well, it has been
> easy
> > to make vector based skins in either Illustrator, or Inkscape (the only
> 2 I
> > tried). When saving the svg from inkscape, as as Optimized SVG.
> >
> > Following is the VectorImage I use for displaying SVG's in flex. Some of
> > this code was borrowed from a stack overflow answer, and a lot was
> modified
> > to make it work in our use cases. Good luck!
> >
> > ~ JT
> >
> >
> > import flash.display.DisplayObject;
> > import flash.geom.Rectangle;
> > import mx.core.UIComponent;
> > import spark.primitives.Rect;
> >
> > public class VectorImage extends UIComponent
> > {
> > private var _scaleUniform:Boolean = true;
> >
> > public function VectorImage(source:Class = null)
> > {
> > if(source){
> > this.source = source;
> > }
> > super();
> > }
> >
> > private var _source : Class;
> > protected var sourceChanged :Boolean = true;
> >
> >
> > public function get source():Class
> > {
> > return _source;
> > }
> >
> > public function set source(value:Class):void
> > {
> > _source = value;
> > sourceChanged = true;
> > this.commitProperties();
> > invalidateDisplayList();
> > }
> >
> > protected var imageInstance : DisplayObject;
> >
> >
> > override protected function createChildren():void{
> > super.createChildren();
> >
> > // if the source has changed we want to create, or
> > recreate, the image instance
> > if(this.sourceChanged){
> > // if the instance has a value, then delete it
> > if(this.imageInstance){
> > this.removeChild(this.imageInstance);
> > this.imageInstance = null;
> > }
> >
> > // if we have a source value; create the source
> > if(this.source){
> > this.imageInstance = new source();
> > this.addChild(this.imageInstance);
> > }
> > this.sourceChanged = false;
> >
> > }
> > }
> >
> > /**
> > * @private
> > */
> > override protected function commitProperties():void{
> > super.commitProperties();
> >
> > if(this.sourceChanged){
> > // if the source changed re-created it; which is
> > done in createChildren();
> > this.createChildren();
> > }
> > }
> >
> > override protected function measure():void
> > {
> > if(imageInstance != null)
> > {
> > this.measuredWidth = imageInstance.width;
> > this.measuredHeight = imageInstance.height;
> > this.minWidth = 5;
> > this.minHeight = 5;
> > }
> > }
> >
> > override public function setActualSize(width:Number,
> > height:Number):void
> > {
> > this.width = width;
> > this.height = height;
> > ScaleImage(width, height);
> > }
> >
> > /**
> > * @private
> > */
> > override protected function
> > updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void{
> > super.updateDisplayList(unscaledWidth, unscaledHeight);
> >
> > // size the element.
> > // I don't remember why I Wrote the code to check for
> > unscaledHeight and unscaledWidth being 0
> >
> > if(imageInstance != null)
> > {
> >
> > //scale properly
> > ScaleImage(unscaledWidth, unscaledHeight);
> > }
> > }
> >
> > protected function ScaleImage(width:Number, height:Number)
> > {
> > if(imageInstance != null)
> > {
> > if(_scaleUniform == true)
> > {
> > var scale:Number =
> > Math.min(width/imageInstance.width, height/imageInstance.height);
> >
> > var scaleWidth:Number =
> > (int)(imageInstance.width * scale);
> > var scaleHeight:Number =
> > (int)(imageInstance.height * scale);
> >
> > imageInstance.width = scaleWidth;
> > imageInstance.height = scaleHeight;
> >
> > imageInstance.x = (width -
> > imageInstance.width) *.5;
> > imageInstance.y = (height-
> > imageInstance.height) *.5;
> > }
> > else
> > {
> > imageInstance.width = width;
> > imageInstance.height = height;
> > }
> >
> > }
> > }
> >
> > public function get ScaleUniform():Boolean
> > {
> > return _scaleUniform;
> > }
> >
> > public function set ScaleUniform(value:Boolean):void
> > {
> > _scaleUniform = value;
> > }
> > }
> >
> >
> >
> > -----Original Message-----
> > From: Kessler CTR Mark J [mailto:mark.kessler.ctr@usmc.mil]
> > Sent: Friday, August 01, 2014 4:11 AM
> > To: users@flex.apache.org
> > Subject: RE: Design tools for creating Flex 4 skins
> >
> > Inkscape is what I'm waiting on personally. But they've taken years to
> > work towards this next major release. You can track release progress
> [1].
> > So a few more months it looks like.
> >
> >
> > [1] http://www.inkscape.org/en/develop/next-release/
> >
> > -Mark
> >
> > -----Original Message-----
> > From: Sascha Ahrend [mailto:sahrend@icloud.com]
> > Sent: Friday, August 01, 2014 3:49 AM
> > To: users@flex.apache.org
> > Cc: users@flex.apache.org
> > Subject: Re: Design tools for creating Flex 4 skins
> >
> > Inkscape may be an alternative.
> > Check out this article describing the workflow:
> >
> >
> >
> http://blog.devinholloway.com/2013/08/using-inkscape-to-generate-fxg-from.html?m=1
> >
>
Re: Design tools for creating Flex 4 skins
Posted by Scott Matheson <sm...@intralinks.com>.
Does the SVGA file proved vector object like FXG
I often take the output from the graphic designer and copy this in to a skin so I can add a degree of coddling to the image change colour, make small change etc
Sent from my iPhone
> On 6 Aug 2014, at 00:59, "Jason Taylor" <ja...@dedoose.com> wrote:
>
> why continue to use a format that requires you to jump through hoops and is only supported inside a few particular projects? Save yourself the hassle and just use SVG (1.1+). It makes it a heck of a lot easier to switch between html and flex development. Now that SVG is working properly in Flex, I see no reason to continue forward with FXG.
> Just my $.02
> ~ JT
>
> -----Original Message-----
> From: jude [mailto:flexcapacitor@gmail.com]
> Sent: Tuesday, August 05, 2014 3:46 PM
> To: users@flex.apache.org
> Subject: Re: Design tools for creating Flex 4 skins
>
> How is FXG broken? Do you mean when you paste it into each of these different places they all render differently? If that's true that's because they are converting to their own internal representation. Flash Catalyst was great at cleaning up the exported FXG from Illustrator. I would create a vector in Illustrator, go to save (as FXG) and copy the FXG to the clipboard, then in FC paste and it would pop open a dialog that let you choose how to handle the import. For example, it would rasterize some things if you didn't tell it not to.
>
> But I agree that it would not always look the same as the original in Illustrator. I think FXG is supposed to be better than SVG (at least 1.0 SVG).
>
>
>> On Tue, Aug 5, 2014 at 1:59 PM, Jason Taylor <ja...@dedoose.com> wrote:
>>
>> I have found inscape to be very good. FXG is a broken format afaik as
>> flash, illustrator, and flex seem to all do different things depending
>> on the version. The route I then chose was to go with SVG. Flex's
>> native support of SVG initially was a bit lacking so we developed a
>> component to better support that. Once vector SVGs were handled well,
>> it has been easy to make vector based skins in either Illustrator, or
>> Inkscape (the only 2 I tried). When saving the svg from inkscape, as as Optimized SVG.
>>
>> Following is the VectorImage I use for displaying SVG's in flex. Some
>> of this code was borrowed from a stack overflow answer, and a lot was
>> modified to make it work in our use cases. Good luck!
>>
>> ~ JT
>>
>>
>> import flash.display.DisplayObject;
>> import flash.geom.Rectangle;
>> import mx.core.UIComponent;
>> import spark.primitives.Rect;
>>
>> public class VectorImage extends UIComponent {
>> private var _scaleUniform:Boolean = true;
>>
>> public function VectorImage(source:Class = null)
>> {
>> if(source){
>> this.source = source;
>> }
>> super();
>> }
>>
>> private var _source : Class;
>> protected var sourceChanged :Boolean = true;
>>
>>
>> public function get source():Class
>> {
>> return _source;
>> }
>>
>> public function set source(value:Class):void
>> {
>> _source = value;
>> sourceChanged = true;
>> this.commitProperties();
>> invalidateDisplayList();
>> }
>>
>> protected var imageInstance : DisplayObject;
>>
>>
>> override protected function createChildren():void{
>> super.createChildren();
>>
>> // if the source has changed we want to create, or
>> recreate, the image instance
>> if(this.sourceChanged){
>> // if the instance has a value, then delete it
>> if(this.imageInstance){
>> this.removeChild(this.imageInstance);
>> this.imageInstance = null;
>> }
>>
>> // if we have a source value; create the source
>> if(this.source){
>> this.imageInstance = new source();
>> this.addChild(this.imageInstance);
>> }
>> this.sourceChanged = false;
>>
>> }
>> }
>>
>> /**
>> * @private
>> */
>> override protected function commitProperties():void{
>> super.commitProperties();
>>
>> if(this.sourceChanged){
>> // if the source changed re-created it; which
>> is done in createChildren();
>> this.createChildren();
>> }
>> }
>>
>> override protected function measure():void
>> {
>> if(imageInstance != null)
>> {
>> this.measuredWidth = imageInstance.width;
>> this.measuredHeight = imageInstance.height;
>> this.minWidth = 5;
>> this.minHeight = 5;
>> }
>> }
>>
>> override public function setActualSize(width:Number,
>> height:Number):void
>> {
>> this.width = width;
>> this.height = height;
>> ScaleImage(width, height);
>> }
>>
>> /**
>> * @private
>> */
>> override protected function
>> updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void{
>> super.updateDisplayList(unscaledWidth,
>> unscaledHeight);
>>
>> // size the element.
>> // I don't remember why I Wrote the code to check for
>> unscaledHeight and unscaledWidth being 0
>>
>> if(imageInstance != null)
>> {
>>
>> //scale properly
>> ScaleImage(unscaledWidth, unscaledHeight);
>> }
>> }
>>
>> protected function ScaleImage(width:Number, height:Number)
>> {
>> if(imageInstance != null)
>> {
>> if(_scaleUniform == true)
>> {
>> var scale:Number =
>> Math.min(width/imageInstance.width, height/imageInstance.height);
>>
>> var scaleWidth:Number =
>> (int)(imageInstance.width * scale);
>> var scaleHeight:Number =
>> (int)(imageInstance.height * scale);
>>
>> imageInstance.width = scaleWidth;
>> imageInstance.height = scaleHeight;
>>
>> imageInstance.x = (width -
>> imageInstance.width) *.5;
>> imageInstance.y = (height-
>> imageInstance.height) *.5;
>> }
>> else
>> {
>> imageInstance.width = width;
>> imageInstance.height = height;
>> }
>>
>> }
>> }
>>
>> public function get ScaleUniform():Boolean
>> {
>> return _scaleUniform;
>> }
>>
>> public function set ScaleUniform(value:Boolean):void
>> {
>> _scaleUniform = value;
>> }
>> }
>>
>>
>>
>> -----Original Message-----
>> From: Kessler CTR Mark J [mailto:mark.kessler.ctr@usmc.mil]
>> Sent: Friday, August 01, 2014 4:11 AM
>> To: users@flex.apache.org
>> Subject: RE: Design tools for creating Flex 4 skins
>>
>> Inkscape is what I'm waiting on personally. But they've taken years to
>> work towards this next major release. You can track release progress [1].
>> So a few more months it looks like.
>>
>>
>> [1] http://www.inkscape.org/en/develop/next-release/
>>
>> -Mark
>>
>> -----Original Message-----
>> From: Sascha Ahrend [mailto:sahrend@icloud.com]
>> Sent: Friday, August 01, 2014 3:49 AM
>> To: users@flex.apache.org
>> Cc: users@flex.apache.org
>> Subject: Re: Design tools for creating Flex 4 skins
>>
>> Inkscape may be an alternative.
>> Check out this article describing the workflow:
>>
>>
>> http://blog.devinholloway.com/2013/08/using-inkscape-to-generate-fxg-f
>> rom.html?m=1
>>
________________________________
Disclaimer: This electronic mail and any attachments are confidential and may be privileged. If you are not the intended recipient, please notify the sender immediately by replying to this email, and destroy all copies of this email and any attachments. Thank you.
Re: Design tools for creating Flex 4 skins
Posted by OmPrakash Muppirala <bi...@gmail.com>.
On Tue, Aug 5, 2014 at 4:58 PM, Jason Taylor <ja...@dedoose.com> wrote:
> why continue to use a format that requires you to jump through hoops and
> is only supported inside a few particular projects? Save yourself the
> hassle and just use SVG (1.1+). It makes it a heck of a lot easier to
> switch between html and flex development. Now that SVG is working properly
> in Flex, I see no reason to continue forward with FXG.
> Just my $.02
>
I agree with you. I think we need to update Apache Flex to use SVG instead
of FXG natively for skinning. I might put some work into that sometime in
the future.
Although, there are some structural problems with SVG (like missing 9-slice
skinning, etc.) that needs to be overcome first.
In the meantime, look for some of these concepts in FlexJS. Since it is a
new framework, the risk is low to implement SVG based skinning here.
Thanks,
Om
> ~ JT
>
> -----Original Message-----
> From: jude [mailto:flexcapacitor@gmail.com]
> Sent: Tuesday, August 05, 2014 3:46 PM
> To: users@flex.apache.org
> Subject: Re: Design tools for creating Flex 4 skins
>
> How is FXG broken? Do you mean when you paste it into each of these
> different places they all render differently? If that's true that's because
> they are converting to their own internal representation. Flash Catalyst
> was great at cleaning up the exported FXG from Illustrator. I would create
> a vector in Illustrator, go to save (as FXG) and copy the FXG to the
> clipboard, then in FC paste and it would pop open a dialog that let you
> choose how to handle the import. For example, it would rasterize some
> things if you didn't tell it not to.
>
> But I agree that it would not always look the same as the original in
> Illustrator. I think FXG is supposed to be better than SVG (at least 1.0
> SVG).
>
>
> On Tue, Aug 5, 2014 at 1:59 PM, Jason Taylor <ja...@dedoose.com> wrote:
>
> > I have found inscape to be very good. FXG is a broken format afaik as
> > flash, illustrator, and flex seem to all do different things depending
> > on the version. The route I then chose was to go with SVG. Flex's
> > native support of SVG initially was a bit lacking so we developed a
> > component to better support that. Once vector SVGs were handled well,
> > it has been easy to make vector based skins in either Illustrator, or
> > Inkscape (the only 2 I tried). When saving the svg from inkscape, as as
> Optimized SVG.
> >
> > Following is the VectorImage I use for displaying SVG's in flex. Some
> > of this code was borrowed from a stack overflow answer, and a lot was
> > modified to make it work in our use cases. Good luck!
> >
> > ~ JT
> >
> >
> > import flash.display.DisplayObject;
> > import flash.geom.Rectangle;
> > import mx.core.UIComponent;
> > import spark.primitives.Rect;
> >
> > public class VectorImage extends UIComponent {
> > private var _scaleUniform:Boolean = true;
> >
> > public function VectorImage(source:Class = null)
> > {
> > if(source){
> > this.source = source;
> > }
> > super();
> > }
> >
> > private var _source : Class;
> > protected var sourceChanged :Boolean = true;
> >
> >
> > public function get source():Class
> > {
> > return _source;
> > }
> >
> > public function set source(value:Class):void
> > {
> > _source = value;
> > sourceChanged = true;
> > this.commitProperties();
> > invalidateDisplayList();
> > }
> >
> > protected var imageInstance : DisplayObject;
> >
> >
> > override protected function createChildren():void{
> > super.createChildren();
> >
> > // if the source has changed we want to create, or
> > recreate, the image instance
> > if(this.sourceChanged){
> > // if the instance has a value, then delete it
> > if(this.imageInstance){
> > this.removeChild(this.imageInstance);
> > this.imageInstance = null;
> > }
> >
> > // if we have a source value; create the source
> > if(this.source){
> > this.imageInstance = new source();
> > this.addChild(this.imageInstance);
> > }
> > this.sourceChanged = false;
> >
> > }
> > }
> >
> > /**
> > * @private
> > */
> > override protected function commitProperties():void{
> > super.commitProperties();
> >
> > if(this.sourceChanged){
> > // if the source changed re-created it; which
> > is done in createChildren();
> > this.createChildren();
> > }
> > }
> >
> > override protected function measure():void
> > {
> > if(imageInstance != null)
> > {
> > this.measuredWidth = imageInstance.width;
> > this.measuredHeight = imageInstance.height;
> > this.minWidth = 5;
> > this.minHeight = 5;
> > }
> > }
> >
> > override public function setActualSize(width:Number,
> > height:Number):void
> > {
> > this.width = width;
> > this.height = height;
> > ScaleImage(width, height);
> > }
> >
> > /**
> > * @private
> > */
> > override protected function
> > updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void{
> > super.updateDisplayList(unscaledWidth,
> > unscaledHeight);
> >
> > // size the element.
> > // I don't remember why I Wrote the code to check for
> > unscaledHeight and unscaledWidth being 0
> >
> > if(imageInstance != null)
> > {
> >
> > //scale properly
> > ScaleImage(unscaledWidth, unscaledHeight);
> > }
> > }
> >
> > protected function ScaleImage(width:Number, height:Number)
> > {
> > if(imageInstance != null)
> > {
> > if(_scaleUniform == true)
> > {
> > var scale:Number =
> > Math.min(width/imageInstance.width, height/imageInstance.height);
> >
> > var scaleWidth:Number =
> > (int)(imageInstance.width * scale);
> > var scaleHeight:Number =
> > (int)(imageInstance.height * scale);
> >
> > imageInstance.width = scaleWidth;
> > imageInstance.height = scaleHeight;
> >
> > imageInstance.x = (width -
> > imageInstance.width) *.5;
> > imageInstance.y = (height-
> > imageInstance.height) *.5;
> > }
> > else
> > {
> > imageInstance.width = width;
> > imageInstance.height = height;
> > }
> >
> > }
> > }
> >
> > public function get ScaleUniform():Boolean
> > {
> > return _scaleUniform;
> > }
> >
> > public function set ScaleUniform(value:Boolean):void
> > {
> > _scaleUniform = value;
> > }
> > }
> >
> >
> >
> > -----Original Message-----
> > From: Kessler CTR Mark J [mailto:mark.kessler.ctr@usmc.mil]
> > Sent: Friday, August 01, 2014 4:11 AM
> > To: users@flex.apache.org
> > Subject: RE: Design tools for creating Flex 4 skins
> >
> > Inkscape is what I'm waiting on personally. But they've taken years to
> > work towards this next major release. You can track release progress
> [1].
> > So a few more months it looks like.
> >
> >
> > [1] http://www.inkscape.org/en/develop/next-release/
> >
> > -Mark
> >
> > -----Original Message-----
> > From: Sascha Ahrend [mailto:sahrend@icloud.com]
> > Sent: Friday, August 01, 2014 3:49 AM
> > To: users@flex.apache.org
> > Cc: users@flex.apache.org
> > Subject: Re: Design tools for creating Flex 4 skins
> >
> > Inkscape may be an alternative.
> > Check out this article describing the workflow:
> >
> >
> > http://blog.devinholloway.com/2013/08/using-inkscape-to-generate-fxg-f
> > rom.html?m=1
> >
>
RE: Design tools for creating Flex 4 skins
Posted by Jason Taylor <ja...@dedoose.com>.
why continue to use a format that requires you to jump through hoops and is only supported inside a few particular projects? Save yourself the hassle and just use SVG (1.1+). It makes it a heck of a lot easier to switch between html and flex development. Now that SVG is working properly in Flex, I see no reason to continue forward with FXG.
Just my $.02
~ JT
-----Original Message-----
From: jude [mailto:flexcapacitor@gmail.com]
Sent: Tuesday, August 05, 2014 3:46 PM
To: users@flex.apache.org
Subject: Re: Design tools for creating Flex 4 skins
How is FXG broken? Do you mean when you paste it into each of these different places they all render differently? If that's true that's because they are converting to their own internal representation. Flash Catalyst was great at cleaning up the exported FXG from Illustrator. I would create a vector in Illustrator, go to save (as FXG) and copy the FXG to the clipboard, then in FC paste and it would pop open a dialog that let you choose how to handle the import. For example, it would rasterize some things if you didn't tell it not to.
But I agree that it would not always look the same as the original in Illustrator. I think FXG is supposed to be better than SVG (at least 1.0 SVG).
On Tue, Aug 5, 2014 at 1:59 PM, Jason Taylor <ja...@dedoose.com> wrote:
> I have found inscape to be very good. FXG is a broken format afaik as
> flash, illustrator, and flex seem to all do different things depending
> on the version. The route I then chose was to go with SVG. Flex's
> native support of SVG initially was a bit lacking so we developed a
> component to better support that. Once vector SVGs were handled well,
> it has been easy to make vector based skins in either Illustrator, or
> Inkscape (the only 2 I tried). When saving the svg from inkscape, as as Optimized SVG.
>
> Following is the VectorImage I use for displaying SVG's in flex. Some
> of this code was borrowed from a stack overflow answer, and a lot was
> modified to make it work in our use cases. Good luck!
>
> ~ JT
>
>
> import flash.display.DisplayObject;
> import flash.geom.Rectangle;
> import mx.core.UIComponent;
> import spark.primitives.Rect;
>
> public class VectorImage extends UIComponent {
> private var _scaleUniform:Boolean = true;
>
> public function VectorImage(source:Class = null)
> {
> if(source){
> this.source = source;
> }
> super();
> }
>
> private var _source : Class;
> protected var sourceChanged :Boolean = true;
>
>
> public function get source():Class
> {
> return _source;
> }
>
> public function set source(value:Class):void
> {
> _source = value;
> sourceChanged = true;
> this.commitProperties();
> invalidateDisplayList();
> }
>
> protected var imageInstance : DisplayObject;
>
>
> override protected function createChildren():void{
> super.createChildren();
>
> // if the source has changed we want to create, or
> recreate, the image instance
> if(this.sourceChanged){
> // if the instance has a value, then delete it
> if(this.imageInstance){
> this.removeChild(this.imageInstance);
> this.imageInstance = null;
> }
>
> // if we have a source value; create the source
> if(this.source){
> this.imageInstance = new source();
> this.addChild(this.imageInstance);
> }
> this.sourceChanged = false;
>
> }
> }
>
> /**
> * @private
> */
> override protected function commitProperties():void{
> super.commitProperties();
>
> if(this.sourceChanged){
> // if the source changed re-created it; which
> is done in createChildren();
> this.createChildren();
> }
> }
>
> override protected function measure():void
> {
> if(imageInstance != null)
> {
> this.measuredWidth = imageInstance.width;
> this.measuredHeight = imageInstance.height;
> this.minWidth = 5;
> this.minHeight = 5;
> }
> }
>
> override public function setActualSize(width:Number,
> height:Number):void
> {
> this.width = width;
> this.height = height;
> ScaleImage(width, height);
> }
>
> /**
> * @private
> */
> override protected function
> updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void{
> super.updateDisplayList(unscaledWidth,
> unscaledHeight);
>
> // size the element.
> // I don't remember why I Wrote the code to check for
> unscaledHeight and unscaledWidth being 0
>
> if(imageInstance != null)
> {
>
> //scale properly
> ScaleImage(unscaledWidth, unscaledHeight);
> }
> }
>
> protected function ScaleImage(width:Number, height:Number)
> {
> if(imageInstance != null)
> {
> if(_scaleUniform == true)
> {
> var scale:Number =
> Math.min(width/imageInstance.width, height/imageInstance.height);
>
> var scaleWidth:Number =
> (int)(imageInstance.width * scale);
> var scaleHeight:Number =
> (int)(imageInstance.height * scale);
>
> imageInstance.width = scaleWidth;
> imageInstance.height = scaleHeight;
>
> imageInstance.x = (width -
> imageInstance.width) *.5;
> imageInstance.y = (height-
> imageInstance.height) *.5;
> }
> else
> {
> imageInstance.width = width;
> imageInstance.height = height;
> }
>
> }
> }
>
> public function get ScaleUniform():Boolean
> {
> return _scaleUniform;
> }
>
> public function set ScaleUniform(value:Boolean):void
> {
> _scaleUniform = value;
> }
> }
>
>
>
> -----Original Message-----
> From: Kessler CTR Mark J [mailto:mark.kessler.ctr@usmc.mil]
> Sent: Friday, August 01, 2014 4:11 AM
> To: users@flex.apache.org
> Subject: RE: Design tools for creating Flex 4 skins
>
> Inkscape is what I'm waiting on personally. But they've taken years to
> work towards this next major release. You can track release progress [1].
> So a few more months it looks like.
>
>
> [1] http://www.inkscape.org/en/develop/next-release/
>
> -Mark
>
> -----Original Message-----
> From: Sascha Ahrend [mailto:sahrend@icloud.com]
> Sent: Friday, August 01, 2014 3:49 AM
> To: users@flex.apache.org
> Cc: users@flex.apache.org
> Subject: Re: Design tools for creating Flex 4 skins
>
> Inkscape may be an alternative.
> Check out this article describing the workflow:
>
>
> http://blog.devinholloway.com/2013/08/using-inkscape-to-generate-fxg-f
> rom.html?m=1
>
Re: Design tools for creating Flex 4 skins
Posted by jude <fl...@gmail.com>.
How is FXG broken? Do you mean when you paste it into each of these
different places they all render differently? If that's true that's because
they are converting to their own internal representation. Flash Catalyst
was great at cleaning up the exported FXG from Illustrator. I would create
a vector in Illustrator, go to save (as FXG) and copy the FXG to the
clipboard, then in FC paste and it would pop open a dialog that let you
choose how to handle the import. For example, it would rasterize some
things if you didn't tell it not to.
But I agree that it would not always look the same as the original in
Illustrator. I think FXG is supposed to be better than SVG (at least 1.0
SVG).
On Tue, Aug 5, 2014 at 1:59 PM, Jason Taylor <ja...@dedoose.com> wrote:
> I have found inscape to be very good. FXG is a broken format afaik as
> flash, illustrator, and flex seem to all do different things depending on
> the version. The route I then chose was to go with SVG. Flex's native
> support of SVG initially was a bit lacking so we developed a component to
> better support that. Once vector SVGs were handled well, it has been easy
> to make vector based skins in either Illustrator, or Inkscape (the only 2 I
> tried). When saving the svg from inkscape, as as Optimized SVG.
>
> Following is the VectorImage I use for displaying SVG's in flex. Some of
> this code was borrowed from a stack overflow answer, and a lot was modified
> to make it work in our use cases. Good luck!
>
> ~ JT
>
>
> import flash.display.DisplayObject;
> import flash.geom.Rectangle;
> import mx.core.UIComponent;
> import spark.primitives.Rect;
>
> public class VectorImage extends UIComponent
> {
> private var _scaleUniform:Boolean = true;
>
> public function VectorImage(source:Class = null)
> {
> if(source){
> this.source = source;
> }
> super();
> }
>
> private var _source : Class;
> protected var sourceChanged :Boolean = true;
>
>
> public function get source():Class
> {
> return _source;
> }
>
> public function set source(value:Class):void
> {
> _source = value;
> sourceChanged = true;
> this.commitProperties();
> invalidateDisplayList();
> }
>
> protected var imageInstance : DisplayObject;
>
>
> override protected function createChildren():void{
> super.createChildren();
>
> // if the source has changed we want to create, or
> recreate, the image instance
> if(this.sourceChanged){
> // if the instance has a value, then delete it
> if(this.imageInstance){
> this.removeChild(this.imageInstance);
> this.imageInstance = null;
> }
>
> // if we have a source value; create the source
> if(this.source){
> this.imageInstance = new source();
> this.addChild(this.imageInstance);
> }
> this.sourceChanged = false;
>
> }
> }
>
> /**
> * @private
> */
> override protected function commitProperties():void{
> super.commitProperties();
>
> if(this.sourceChanged){
> // if the source changed re-created it; which is
> done in createChildren();
> this.createChildren();
> }
> }
>
> override protected function measure():void
> {
> if(imageInstance != null)
> {
> this.measuredWidth = imageInstance.width;
> this.measuredHeight = imageInstance.height;
> this.minWidth = 5;
> this.minHeight = 5;
> }
> }
>
> override public function setActualSize(width:Number,
> height:Number):void
> {
> this.width = width;
> this.height = height;
> ScaleImage(width, height);
> }
>
> /**
> * @private
> */
> override protected function
> updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void{
> super.updateDisplayList(unscaledWidth, unscaledHeight);
>
> // size the element.
> // I don't remember why I Wrote the code to check for
> unscaledHeight and unscaledWidth being 0
>
> if(imageInstance != null)
> {
>
> //scale properly
> ScaleImage(unscaledWidth, unscaledHeight);
> }
> }
>
> protected function ScaleImage(width:Number, height:Number)
> {
> if(imageInstance != null)
> {
> if(_scaleUniform == true)
> {
> var scale:Number =
> Math.min(width/imageInstance.width, height/imageInstance.height);
>
> var scaleWidth:Number =
> (int)(imageInstance.width * scale);
> var scaleHeight:Number =
> (int)(imageInstance.height * scale);
>
> imageInstance.width = scaleWidth;
> imageInstance.height = scaleHeight;
>
> imageInstance.x = (width -
> imageInstance.width) *.5;
> imageInstance.y = (height-
> imageInstance.height) *.5;
> }
> else
> {
> imageInstance.width = width;
> imageInstance.height = height;
> }
>
> }
> }
>
> public function get ScaleUniform():Boolean
> {
> return _scaleUniform;
> }
>
> public function set ScaleUniform(value:Boolean):void
> {
> _scaleUniform = value;
> }
> }
>
>
>
> -----Original Message-----
> From: Kessler CTR Mark J [mailto:mark.kessler.ctr@usmc.mil]
> Sent: Friday, August 01, 2014 4:11 AM
> To: users@flex.apache.org
> Subject: RE: Design tools for creating Flex 4 skins
>
> Inkscape is what I'm waiting on personally. But they've taken years to
> work towards this next major release. You can track release progress [1].
> So a few more months it looks like.
>
>
> [1] http://www.inkscape.org/en/develop/next-release/
>
> -Mark
>
> -----Original Message-----
> From: Sascha Ahrend [mailto:sahrend@icloud.com]
> Sent: Friday, August 01, 2014 3:49 AM
> To: users@flex.apache.org
> Cc: users@flex.apache.org
> Subject: Re: Design tools for creating Flex 4 skins
>
> Inkscape may be an alternative.
> Check out this article describing the workflow:
>
>
> http://blog.devinholloway.com/2013/08/using-inkscape-to-generate-fxg-from.html?m=1
>
Re: Design tools for creating Flex 4 skins
Posted by Sascha Ahrend <sa...@icloud.com>.
Alternatively a Flex importer (sth. like the Flash Video Importer back then) could be an idea.
In reverse logic this could also serve as part of the FlexJS exporter.
***
I am no genius in XSLT, but let me share what I already got:
In my converter (http://www.realcreation.com/SVGtoFXG.dmg) I am using the xslt file I found here:
http://svg2fxg.blogspot.de/2012/03/svg-2-fxg-conversion-step-1.html
I just used the xslt part of it and modified it a little.
- I commented out the initial <mask> tag as it only serves to give the fig file the same measures as the svg file.
This is nice to have, but i still took it out, as this causes problems with ‚unclean‘ svg, where objects may be moved outside the mask area.
- I added:
<!-- ignore text content of nodex -->
<xsl:template mode="forward" match="text()" />
This strips out text values in the svg file, what leads to a corrupt fxg. Inkscape is good in placing additional values and text.
- I set joint and cap conditionally, since empty values causes errors:
<xsl:if test="$stroke_linejoin != ''">
<xsl:if test="$stroke_linecap != '‘">
- For the rest I just packed the xslt with my air application that fires an applescript to call xsltproc (it seems to have restrictions in being called directly).
I think you could do the same in Windows with Command Line Transformation Utility installed:
http://www.microsoft.com/en-us/download/details.aspx?id=21714
***
The good news however is, that I’ve just found inkscape’s own xslt conversion file, so you can easily try to apply it in the same manner as described above (I will also try out.):
https://github.com/piksels-and-lines-orchestra/inkscape/blob/master/share/extensions/svg2fxg.xsl
Please let me know about your progress,
Sascha
Am 06.08.2014 um 18:50 schrieb Jason Taylor <ja...@dedoose.com>:
> perhaps then we should work on an FXG exporter for Inkscape that does the job properly?
>
> -----Original Message-----
> From: Sascha Ahrend [mailto:sahrend@icloud.com]
> Sent: Wednesday, August 06, 2014 4:06 AM
> To: users@flex.apache.org
> Subject: Re: Design tools for creating Flex 4 skins
>
> Sorry, but I don't think we should replace FXG as main skinning language.
>
> Nothing against extending SVG support, but FXG is much nearer to Actionscript.
>
> Also the SVG files created by most Illustration Software have to be cleaned up in the same manner as you say about FXG.
>
> E.g. if you draw an object and reposition it, Inkscape (i guess Illustrator, too) just adds a transform attribute to the path instead of updating the path itself.
> (You may find the object in a completely different position than expected in the SVG output, even when optimized).
>
> I got the best results with a tiny piece of software for Xcode/Quartz developers: https://itunes.apple.com/de/app/ivinci-express/id607900811?mt=12
> Purely SVG based, it is really WYSIWYG - even Illustrator and Inkscape files are cleaned up thoroughly (text is rendered as well).
>
> I then built a SVG -> FXG converter for Mac OS (based on an xslt-Script i slightly modified):
>
> http://www.realcreation.com/SVGtoFXG.dmg
>
> Used with a 'clean' SVG it virtually gives me everything as 'clean' FXG (no gradients yet, but that's easy to add manually or with e.g. 7jigen fxgeditor. I may update.)
>
> (In addition, I wouldn't get too irritated about Adobe having abandoned FXG, as they also donated the FXG standard to Apache before, so they'd always be bound to changes implemented by Apache. Same reason they gave up FB Design View.)
>
>
> Rgds.,
>
> Sascha
>
>
> Am 06.08.2014 um 12:04 schrieb Kessler CTR Mark J <ma...@usmc.mil>:
>
>> Side bar note, here are the soon to be release notes for the new Inkscape 0.91 [1]
>>
>> [1] http://wiki.inkscape.org/wiki/index.php/Release_notes/0.91
>>
>> -Mark
>>
>
RE: Design tools for creating Flex 4 skins
Posted by Jason Taylor <ja...@dedoose.com>.
perhaps then we should work on an FXG exporter for Inkscape that does the job properly?
-----Original Message-----
From: Sascha Ahrend [mailto:sahrend@icloud.com]
Sent: Wednesday, August 06, 2014 4:06 AM
To: users@flex.apache.org
Subject: Re: Design tools for creating Flex 4 skins
Sorry, but I don't think we should replace FXG as main skinning language.
Nothing against extending SVG support, but FXG is much nearer to Actionscript.
Also the SVG files created by most Illustration Software have to be cleaned up in the same manner as you say about FXG.
E.g. if you draw an object and reposition it, Inkscape (i guess Illustrator, too) just adds a transform attribute to the path instead of updating the path itself.
(You may find the object in a completely different position than expected in the SVG output, even when optimized).
I got the best results with a tiny piece of software for Xcode/Quartz developers: https://itunes.apple.com/de/app/ivinci-express/id607900811?mt=12
Purely SVG based, it is really WYSIWYG - even Illustrator and Inkscape files are cleaned up thoroughly (text is rendered as well).
I then built a SVG -> FXG converter for Mac OS (based on an xslt-Script i slightly modified):
http://www.realcreation.com/SVGtoFXG.dmg
Used with a 'clean' SVG it virtually gives me everything as 'clean' FXG (no gradients yet, but that's easy to add manually or with e.g. 7jigen fxgeditor. I may update.)
(In addition, I wouldn't get too irritated about Adobe having abandoned FXG, as they also donated the FXG standard to Apache before, so they'd always be bound to changes implemented by Apache. Same reason they gave up FB Design View.)
Rgds.,
Sascha
Am 06.08.2014 um 12:04 schrieb Kessler CTR Mark J <ma...@usmc.mil>:
> Side bar note, here are the soon to be release notes for the new Inkscape 0.91 [1]
>
> [1] http://wiki.inkscape.org/wiki/index.php/Release_notes/0.91
>
> -Mark
>
Re: Design tools for creating Flex 4 skins
Posted by Sascha Ahrend <sa...@icloud.com>.
Well, don’t get me wrong. I am also happy the ‚deprecated‘ warning for SVG got removed in 4.10. ;-)
Thanks for your effort!
Sascha
Am 06.08.2014 um 14:01 schrieb Kessler CTR Mark J <ma...@usmc.mil>:
> I'm not saying replacing FXG with SVG. They will both be supported at some point. Some of us use SVG because it's more widely supported and can be used outside of actionscript.
>
> -Mark
>
RE: Design tools for creating Flex 4 skins
Posted by Kessler CTR Mark J <ma...@usmc.mil>.
I'm not saying replacing FXG with SVG. They will both be supported at some point. Some of us use SVG because it's more widely supported and can be used outside of actionscript.
-Mark
Re: Design tools for creating Flex 4 skins
Posted by Sascha Ahrend <sa...@icloud.com>.
Hi Jude,
in regard to your question concerning a runtime interpreter, this might be of some interest for you:
https://github.com/claus/as3swf/tree/master/src/com/codeazur/as3swf/exporters
https://github.com/claus/as3swf/wiki
It’s a runtime converter from swf to various file formats including SVG and FXG.
Maybe you can use it somehow.
Enjoy
Am 07.08.2014 um 13:33 schrieb Sascha Ahrend <sa...@icloud.com>:
> Just checked Inkscape’s xslt.
>
> Unfortunately it’s buggy, but it offers some brilliant features like gradients.
>
> I will check with their developers, if a more actual version is available.
>
> Otherwise I will merge the two existing scripts into a new version.
>
>
> Sascha
>
>
>
> Am 06.08.2014 um 22:16 schrieb Sascha Ahrend <sa...@icloud.com>:
>
>> On the mac make sure you have the latest version of XQuartz installed (even on Mavericks), what is now Open Source in order to use Inkscape:
>> http://xquartz.macosforge.org/landing/
>>
>> Version 0.91 however is supposed to become fully native anyway.
>>
>>
>> Inkscape’s svg2fxg.xsl is based on their own svg2xaml.xsl. They also have a xaml2svg.xsl.
>> All can be found here: https://github.com/piksels-and-lines-orchestra/inkscape/tree/master/share/extensions
>>
>> It shouldn’t be a major task to also create a fxg2svg.xsl using the above as templates.
>>
>>
>> I am not aware of a runtime FXG and SVG interpreter (as a matter of fact, you have to use MXML graphics to apply changes on runtime).
>> For the package compiler however, I guess a command line processor can be/ or is used to compile xml files with xsl.
>>
>> I am sure, the developer group can answer this question.
>>
>>
>> Rgds.,
>>
>> Sascha
>>
>>
>>
>>
>> Am 06.08.2014 um 21:32 schrieb jude <fl...@gmail.com>:
>>
>>> I tried Inkscape before and it wouldn't start. I tried for a bit to get it
>>> going and then went back to Illustrator. I'm on Mac. I've kept Illustrator
>>> 5.0 with the FXG output option.
>>>
>>> Creating our own exporter for these programs sounds like a good idea if
>>> it's possible and incorporate our fixes and patches. What about an exporter
>>> that exports both SVG and FXG at the same time?
>>>
>>> BTW Is there a runtime FXG and SVG interpreter? Then both our FlexJS and
>>> Flex apps can pull in and use the same FXG or SVG for the visuals?
>>
>
Re: Design tools for creating Flex 4 skins
Posted by Sascha Ahrend <sa...@icloud.com>.
Just checked Inkscape’s xslt.
Unfortunately it’s buggy, but it offers some brilliant features like gradients.
I will check with their developers, if a more actual version is available.
Otherwise I will merge the two existing scripts into a new version.
Sascha
Am 06.08.2014 um 22:16 schrieb Sascha Ahrend <sa...@icloud.com>:
> On the mac make sure you have the latest version of XQuartz installed (even on Mavericks), what is now Open Source in order to use Inkscape:
> http://xquartz.macosforge.org/landing/
>
> Version 0.91 however is supposed to become fully native anyway.
>
>
> Inkscape’s svg2fxg.xsl is based on their own svg2xaml.xsl. They also have a xaml2svg.xsl.
> All can be found here: https://github.com/piksels-and-lines-orchestra/inkscape/tree/master/share/extensions
>
> It shouldn’t be a major task to also create a fxg2svg.xsl using the above as templates.
>
>
> I am not aware of a runtime FXG and SVG interpreter (as a matter of fact, you have to use MXML graphics to apply changes on runtime).
> For the package compiler however, I guess a command line processor can be/ or is used to compile xml files with xsl.
>
> I am sure, the developer group can answer this question.
>
>
> Rgds.,
>
> Sascha
>
>
>
>
> Am 06.08.2014 um 21:32 schrieb jude <fl...@gmail.com>:
>
>> I tried Inkscape before and it wouldn't start. I tried for a bit to get it
>> going and then went back to Illustrator. I'm on Mac. I've kept Illustrator
>> 5.0 with the FXG output option.
>>
>> Creating our own exporter for these programs sounds like a good idea if
>> it's possible and incorporate our fixes and patches. What about an exporter
>> that exports both SVG and FXG at the same time?
>>
>> BTW Is there a runtime FXG and SVG interpreter? Then both our FlexJS and
>> Flex apps can pull in and use the same FXG or SVG for the visuals?
>
Re: Design tools for creating Flex 4 skins
Posted by Sascha Ahrend <sa...@icloud.com>.
On the mac make sure you have the latest version of XQuartz installed (even on Mavericks), what is now Open Source in order to use Inkscape:
http://xquartz.macosforge.org/landing/
Version 0.91 however is supposed to become fully native anyway.
Inkscape’s svg2fxg.xsl is based on their own svg2xaml.xsl. They also have a xaml2svg.xsl.
All can be found here: https://github.com/piksels-and-lines-orchestra/inkscape/tree/master/share/extensions
It shouldn’t be a major task to also create a fxg2svg.xsl using the above as templates.
I am not aware of a runtime FXG and SVG interpreter (as a matter of fact, you have to use MXML graphics to apply changes on runtime).
For the package compiler however, I guess a command line processor can be/ or is used to compile xml files with xsl.
I am sure, the developer group can answer this question.
Rgds.,
Sascha
Am 06.08.2014 um 21:32 schrieb jude <fl...@gmail.com>:
> I tried Inkscape before and it wouldn't start. I tried for a bit to get it
> going and then went back to Illustrator. I'm on Mac. I've kept Illustrator
> 5.0 with the FXG output option.
>
> Creating our own exporter for these programs sounds like a good idea if
> it's possible and incorporate our fixes and patches. What about an exporter
> that exports both SVG and FXG at the same time?
>
> BTW Is there a runtime FXG and SVG interpreter? Then both our FlexJS and
> Flex apps can pull in and use the same FXG or SVG for the visuals?
Re: Design tools for creating Flex 4 skins
Posted by jude <fl...@gmail.com>.
I tried Inkscape before and it wouldn't start. I tried for a bit to get it
going and then went back to Illustrator. I'm on Mac. I've kept Illustrator
5.0 with the FXG output option.
Creating our own exporter for these programs sounds like a good idea if
it's possible and incorporate our fixes and patches. What about an exporter
that exports both SVG and FXG at the same time?
BTW Is there a runtime FXG and SVG interpreter? Then both our FlexJS and
Flex apps can pull in and use the same FXG or SVG for the visuals?
Re: Design tools for creating Flex 4 skins
Posted by Sascha Ahrend <sa...@icloud.com>.
Sorry, but I don’t think we should replace FXG as main skinning language.
Nothing against extending SVG support, but FXG is much nearer to Actionscript.
Also the SVG files created by most Illustration Software have to be cleaned up in the same manner as you say about FXG.
E.g. if you draw an object and reposition it, Inkscape (i guess Illustrator, too) just adds a transform attribute to the path instead of updating the path itself.
(You may find the object in a completely different position than expected in the SVG output, even when optimized).
I got the best results with a tiny piece of software for Xcode/Quartz developers: https://itunes.apple.com/de/app/ivinci-express/id607900811?mt=12
Purely SVG based, it is really WYSIWYG - even Illustrator and Inkscape files are cleaned up thoroughly (text is rendered as well).
I then built a SVG -> FXG converter for Mac OS (based on an xslt-Script i slightly modified):
http://www.realcreation.com/SVGtoFXG.dmg
Used with a ‚clean‘ SVG it virtually gives me everything as ‚clean’ FXG (no gradients yet, but that’s easy to add manually or with e.g. 7jigen fxgeditor. I may update.)
(In addition, I wouldn’t get too irritated about Adobe having abandoned FXG, as they also donated the FXG standard to Apache before, so they’d always be bound to changes implemented by Apache. Same reason they gave up FB Design View.)
Rgds.,
Sascha
Am 06.08.2014 um 12:04 schrieb Kessler CTR Mark J <ma...@usmc.mil>:
> Side bar note, here are the soon to be release notes for the new Inkscape 0.91 [1]
>
> [1] http://wiki.inkscape.org/wiki/index.php/Release_notes/0.91
>
> -Mark
>
RE: Design tools for creating Flex 4 skins
Posted by Kessler CTR Mark J <ma...@usmc.mil>.
Side bar note, here are the soon to be release notes for the new Inkscape 0.91 [1]
[1] http://wiki.inkscape.org/wiki/index.php/Release_notes/0.91
-Mark
RE: Design tools for creating Flex 4 skins
Posted by Kessler CTR Mark J <ma...@usmc.mil>.
Thanks, I'll see if I can squeeze in some tests today with it.
-Mark
-----Original Message-----
From: Jason Taylor [mailto:jason@dedoose.com]
Sent: Tuesday, August 05, 2014 3:00 PM
To: users@flex.apache.org
Subject: RE: Design tools for creating Flex 4 skins
I have found inscape to be very good. FXG is a broken format afaik as flash, illustrator, and flex seem to all do different things depending on the version. The route I then chose was to go with SVG. Flex's native support of SVG initially was a bit lacking so we developed a component to better support that. Once vector SVGs were handled well, it has been easy to make vector based skins in either Illustrator, or Inkscape (the only 2 I tried). When saving the svg from inkscape, as as Optimized SVG.
Following is the VectorImage I use for displaying SVG's in flex. Some of this code was borrowed from a stack overflow answer, and a lot was modified to make it work in our use cases. Good luck!
~ JT
import flash.display.DisplayObject;
import flash.geom.Rectangle;
import mx.core.UIComponent;
import spark.primitives.Rect;
public class VectorImage extends UIComponent
{
private var _scaleUniform:Boolean = true;
public function VectorImage(source:Class = null)
{
if(source){
this.source = source;
}
super();
}
private var _source : Class;
protected var sourceChanged :Boolean = true;
public function get source():Class
{
return _source;
}
public function set source(value:Class):void
{
_source = value;
sourceChanged = true;
this.commitProperties();
invalidateDisplayList();
}
protected var imageInstance : DisplayObject;
override protected function createChildren():void{
super.createChildren();
// if the source has changed we want to create, or recreate, the image instance
if(this.sourceChanged){
// if the instance has a value, then delete it
if(this.imageInstance){
this.removeChild(this.imageInstance);
this.imageInstance = null;
}
// if we have a source value; create the source
if(this.source){
this.imageInstance = new source();
this.addChild(this.imageInstance);
}
this.sourceChanged = false;
}
}
/**
* @private
*/
override protected function commitProperties():void{
super.commitProperties();
if(this.sourceChanged){
// if the source changed re-created it; which is done in createChildren();
this.createChildren();
}
}
override protected function measure():void
{
if(imageInstance != null)
{
this.measuredWidth = imageInstance.width;
this.measuredHeight = imageInstance.height;
this.minWidth = 5;
this.minHeight = 5;
}
}
override public function setActualSize(width:Number, height:Number):void
{
this.width = width;
this.height = height;
ScaleImage(width, height);
}
/**
* @private
*/
override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void{
super.updateDisplayList(unscaledWidth, unscaledHeight);
// size the element.
// I don't remember why I Wrote the code to check for unscaledHeight and unscaledWidth being 0
if(imageInstance != null)
{
//scale properly
ScaleImage(unscaledWidth, unscaledHeight);
}
}
protected function ScaleImage(width:Number, height:Number)
{
if(imageInstance != null)
{
if(_scaleUniform == true)
{
var scale:Number = Math.min(width/imageInstance.width, height/imageInstance.height);
var scaleWidth:Number = (int)(imageInstance.width * scale);
var scaleHeight:Number = (int)(imageInstance.height * scale);
imageInstance.width = scaleWidth;
imageInstance.height = scaleHeight;
imageInstance.x = (width - imageInstance.width) *.5;
imageInstance.y = (height- imageInstance.height) *.5;
}
else
{
imageInstance.width = width;
imageInstance.height = height;
}
}
}
public function get ScaleUniform():Boolean
{
return _scaleUniform;
}
public function set ScaleUniform(value:Boolean):void
{
_scaleUniform = value;
}
}
-----Original Message-----
From: Kessler CTR Mark J [mailto:mark.kessler.ctr@usmc.mil]
Sent: Friday, August 01, 2014 4:11 AM
To: users@flex.apache.org
Subject: RE: Design tools for creating Flex 4 skins
Inkscape is what I'm waiting on personally. But they've taken years to work towards this next major release. You can track release progress [1]. So a few more months it looks like.
[1] http://www.inkscape.org/en/develop/next-release/
-Mark
RE: Design tools for creating Flex 4 skins
Posted by Jason Taylor <ja...@dedoose.com>.
I have found inscape to be very good. FXG is a broken format afaik as flash, illustrator, and flex seem to all do different things depending on the version. The route I then chose was to go with SVG. Flex's native support of SVG initially was a bit lacking so we developed a component to better support that. Once vector SVGs were handled well, it has been easy to make vector based skins in either Illustrator, or Inkscape (the only 2 I tried). When saving the svg from inkscape, as as Optimized SVG.
Following is the VectorImage I use for displaying SVG's in flex. Some of this code was borrowed from a stack overflow answer, and a lot was modified to make it work in our use cases. Good luck!
~ JT
import flash.display.DisplayObject;
import flash.geom.Rectangle;
import mx.core.UIComponent;
import spark.primitives.Rect;
public class VectorImage extends UIComponent
{
private var _scaleUniform:Boolean = true;
public function VectorImage(source:Class = null)
{
if(source){
this.source = source;
}
super();
}
private var _source : Class;
protected var sourceChanged :Boolean = true;
public function get source():Class
{
return _source;
}
public function set source(value:Class):void
{
_source = value;
sourceChanged = true;
this.commitProperties();
invalidateDisplayList();
}
protected var imageInstance : DisplayObject;
override protected function createChildren():void{
super.createChildren();
// if the source has changed we want to create, or recreate, the image instance
if(this.sourceChanged){
// if the instance has a value, then delete it
if(this.imageInstance){
this.removeChild(this.imageInstance);
this.imageInstance = null;
}
// if we have a source value; create the source
if(this.source){
this.imageInstance = new source();
this.addChild(this.imageInstance);
}
this.sourceChanged = false;
}
}
/**
* @private
*/
override protected function commitProperties():void{
super.commitProperties();
if(this.sourceChanged){
// if the source changed re-created it; which is done in createChildren();
this.createChildren();
}
}
override protected function measure():void
{
if(imageInstance != null)
{
this.measuredWidth = imageInstance.width;
this.measuredHeight = imageInstance.height;
this.minWidth = 5;
this.minHeight = 5;
}
}
override public function setActualSize(width:Number, height:Number):void
{
this.width = width;
this.height = height;
ScaleImage(width, height);
}
/**
* @private
*/
override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void{
super.updateDisplayList(unscaledWidth, unscaledHeight);
// size the element.
// I don't remember why I Wrote the code to check for unscaledHeight and unscaledWidth being 0
if(imageInstance != null)
{
//scale properly
ScaleImage(unscaledWidth, unscaledHeight);
}
}
protected function ScaleImage(width:Number, height:Number)
{
if(imageInstance != null)
{
if(_scaleUniform == true)
{
var scale:Number = Math.min(width/imageInstance.width, height/imageInstance.height);
var scaleWidth:Number = (int)(imageInstance.width * scale);
var scaleHeight:Number = (int)(imageInstance.height * scale);
imageInstance.width = scaleWidth;
imageInstance.height = scaleHeight;
imageInstance.x = (width - imageInstance.width) *.5;
imageInstance.y = (height- imageInstance.height) *.5;
}
else
{
imageInstance.width = width;
imageInstance.height = height;
}
}
}
public function get ScaleUniform():Boolean
{
return _scaleUniform;
}
public function set ScaleUniform(value:Boolean):void
{
_scaleUniform = value;
}
}
-----Original Message-----
From: Kessler CTR Mark J [mailto:mark.kessler.ctr@usmc.mil]
Sent: Friday, August 01, 2014 4:11 AM
To: users@flex.apache.org
Subject: RE: Design tools for creating Flex 4 skins
Inkscape is what I'm waiting on personally. But they've taken years to work towards this next major release. You can track release progress [1]. So a few more months it looks like.
[1] http://www.inkscape.org/en/develop/next-release/
-Mark
-----Original Message-----
From: Sascha Ahrend [mailto:sahrend@icloud.com]
Sent: Friday, August 01, 2014 3:49 AM
To: users@flex.apache.org
Cc: users@flex.apache.org
Subject: Re: Design tools for creating Flex 4 skins
Inkscape may be an alternative.
Check out this article describing the workflow:
http://blog.devinholloway.com/2013/08/using-inkscape-to-generate-fxg-from.html?m=1
RE: Design tools for creating Flex 4 skins
Posted by Kessler CTR Mark J <ma...@usmc.mil>.
Inkscape is what I'm waiting on personally. But they've taken years to work towards this next major release. You can track release progress [1]. So a few more months it looks like.
[1] http://www.inkscape.org/en/develop/next-release/
-Mark
-----Original Message-----
From: Sascha Ahrend [mailto:sahrend@icloud.com]
Sent: Friday, August 01, 2014 3:49 AM
To: users@flex.apache.org
Cc: users@flex.apache.org
Subject: Re: Design tools for creating Flex 4 skins
Inkscape may be an alternative.
Check out this article describing the workflow:
http://blog.devinholloway.com/2013/08/using-inkscape-to-generate-fxg-from.html?m=1
Re: Design tools for creating Flex 4 skins
Posted by Sascha Ahrend <sa...@icloud.com>.
Inkscape may be an alternative.
Check out this article describing the workflow:
http://blog.devinholloway.com/2013/08/using-inkscape-to-generate-fxg-from.html?m=1
> Am 01.08.2014 um 00:48 schrieb pnayak <na...@yahoo.com>:
>
> Hi,
>
> Did you ever find an answer to this question? I'm looking for something.
> Illustrator doesn't support saving as FXG. Fireworks is apparently getting
> phased out. Guess Adobe is trying hard to make sure Flex is dead.
>
>
>
> --
> View this message in context: http://apache-flex-users.2333346.n4.nabble.com/Design-tools-for-creating-Flex-4-skins-tp1140p7436.html
> Sent from the Apache Flex Users mailing list archive at Nabble.com.
RE: Design tools for creating Flex 4 skins
Posted by Kessler CTR Mark J <ma...@usmc.mil>.
I remember reading this a while back.... [1] " Development and sales ended on April 23, 2012"
[1] http://www.adobe.com/products/flashcatalyst.html
-----Original Message-----
From: Patil, Virat [mailto:virat.patil@capgemini.com]
Sent: Friday, August 01, 2014 2:24 AM
To: users@flex.apache.org
Subject: RE: Design tools for creating Flex 4 skins
Check out Flash Catalyst
RE: Design tools for creating Flex 4 skins
Posted by "Patil, Virat" <vi...@capgemini.com>.
Check out Flash Catalyst
-----Original Message-----
From: pnayak [mailto:nayak_purushotham@yahoo.com]
Sent: Friday, August 01, 2014 4:18 AM
To: users@flex.apache.org
Subject: Re: Design tools for creating Flex 4 skins
Hi,
Did you ever find an answer to this question? I'm looking for something.
Illustrator doesn't support saving as FXG. Fireworks is apparently getting phased out. Guess Adobe is trying hard to make sure Flex is dead.
--
View this message in context: http://apache-flex-users.2333346.n4.nabble.com/Design-tools-for-creating-Flex-4-skins-tp1140p7436.html
Sent from the Apache Flex Users mailing list archive at Nabble.com.