send link to app

SWF to Canvas Converter


Developer Tools Graphics & Design
Developer: Shuho Chou
9.99 USD

This is the only app that could export all the shapes directly from .swf to PDF or .js file in vector format. Each shape would be a single page in the PDF and was kept resolution independent.

Dont change the vector images to bitmap images anymore. Thats stupid and waste your life.


My developer program is going to be expired, so your purchase will help keeping F2C on the store. Thanks you very much!


For App developers:

You may like to read the pages(shapes) from the exported PDF, and redraw them in your graphic context in any resolution you like.
The page size was exactly the bounding size of the shape.


For HTML5 Canvas developers:

Extracts the static vector shapes in .swf to JavaScript HTML5 Canvas code.
You can import the generated .js file and use them to draw the shapes in a canvas context. Please check the tutorial for more details.


For designers:

The exported PDF may also be renamed to .ai (Illustrator) for redesign.
(Sorry! I havent try this yet since I dont have Illustrator.)


Important Note:

Only static vector shapes are supported so far, which means:

1. Any shape filled by bitmapped image is not supported yet.(You’ll get an empty image)
2. Morphing shapes are not supported yet.



Features:

1. Export all the shapes to PDF file. (resolution independent)
2. Generate the canvas drawing objects directly from the .swf file.
3. Preview the generated object drawing in Webkit.
4. WYSWYG authoring.
5. Export/Import the objects to/from .js

Generated JS object sample:

F2CCast = {
F2CActor3 : {
width : 95,
height : 95,
shapeOriginX : 0,
shapeOriginY : 0,
draw : function (ctx, anchorX, anchorY) {

if (!anchorX) anchorX = 0;
if (!anchorY) anchorY = 0;
with(ctx) { /* ---- Canvas Drawing Start ---- */
save();
translate(this.shapeOriginX - anchorX, this.shapeOriginY - anchorY);
beginPath();
moveTo(0.000, 0.000);
quadraticCurveTo(47.750, 0.000, 95.500, 0.000);
quadraticCurveTo(95.500, 47.750, 95.500, 95.500);
quadraticCurveTo(47.750, 95.500, 0.000, 95.500);
quadraticCurveTo(0.000, 47.750, 0.000, 0.000);
fillStyle = "rgb(0, 0, 255)";
fill();
restore();
} /* ---- Canvas Drawing End ---- */

return this;
}
} /* End of F2CActor3 */
} /* End Of F2CCast */


Usage:

F2CCast[F2CActor3].draw(context);

Easy to be used in a scene graph engine to create the animations or games fully powered by HTML5 Canvas.


Tutorial for Canvas developers:

http://rintarou.dyndns.org/download/f2c/F2CTutorial.html



Support:

http://rintarou.dyndns.org/works/f2c/



FAQ:

- Why I dont provide the function to save as .jpg files?


I dont think its clever to change the vector shapes to bitmap images while you can use vector shapes directly.

Bitmap images are resolution dependent and bigger files that wasted our life to download while the network were still slow and expensive In many countries.

So I provide the function to export as PDF instead.