[SOLVED!!] png2swf stitched pngs without alpha channel?

Hi, I am very new to working in Synfig, but I am falling in love with it fast!

My goal: Use Synfig to create small swf files that I can upload to PowToons to enhance my marketing videos. Basically give me custom creative characters that PowToons does not supply.

My work so far: created screen shot of existing character from a “theme pack” and imported the png into Inkscape. Created a doll for character to hold. Exported as png file with transparent background. (A MUST!) Imported the new png into Synfig. Using the new cutting tool, added skeleton, separated the parts I wanted to move, and linked the parts to the co-coordinating bones. Rendered using “.png” setting and got 96 separate png files in sequence with a transparent background. Excellent! At 24fps, the animation is 4sec long. Perfect! Character is holding her doll and playing with it.

Problem: Stitching the .png files together in sequence to play WITH THE TRANSPARENT background.
I use a Mac Mini, OS X Yosemite Version 10.10.5 … I downloaded the SWFTOOL for Mac. I placed the “png2swf.exe” into the folder where all the sequential png files are. Ran this code in my cmd pannel:

png2swf -z -r24 -T20 00*.png

Link to the options list
http://www.swftools.org/png2swf.html

Note: if you have more than 00.png files, such as 0000.png to 0250.png, only the first 100 will be sequenced in the resulting swf. To get around that, use 0*.png.

*NOTE: How to resize batch of pngs all at once: Use ImageMagick… Link to great tutorial: http://www.howtogeek.com/109369/how-to-quickly-resize-convert-modify-images-from-the-linux-terminal/.
In terminal window, navigate to the folder containing my pngs…
In my command line enter:
for file in *.png; do convert $file -resize (enter the dimensions as x) (enter new file name)-$file; done
works great! file “001.png” is now resized and named (newfilename)-001.png
Create swf in terminal window using png2swf line above:
[b]png2swf -z -r24 -T20 00
.png[/b]
The resulting swf will be have transparent background, but alpha shows as black. Open free program FFdec https://www.free-decompiler.com/flash/download/ and drage swf into the window. Click on the “others” folder in the file tree for the swf, and select “SetBackgrounColor.” The main window will say “backgroundColor= rgb red:0, green:0, blue:0” … click on this and it will show a black color box. Click on the black color box and it will bring up a palette to choose a color from. Select white. It will now read as “backgroundColor= rgb red:255, green:255, blue:255” … make sure to click “save”. It is now on a transparent background!

Got this animation as a result. They are screen shots of the swf animation in my browsers window.
Screen Shot 2015-11-23 at 11.17.56 AM.png
Screen Shot 2015-11-23 at 11.18.12 AM.png
Screen Shot 2015-11-23 at 11.18.19 AM.png

and the mp4 here:

https://youtu.be/xdHfr6fLf6o

You can see how the inserted swf animation has a black box around it against the background.

Question: HOW do I tell png2swf to preserve the transparent background for output!?!???

I’m a newbie, so please give an example of the text you would write in the cmd pannel, and possibly a very brief explanation of why it works. I’m really stumped by this problem. Any and all help would be appreciated!

Why don’t you create the whole animation (included background) as a png sequence and then use the png2swf tool over them?
For support on png2swf please ask to the web.
-G

Hi Genete, thanks for replying to my post! :slight_smile:

As to your question:

That is what I am currently doing, but the goal is to have those little transparent background swf animations that I can drop on the scene stage at any time. The background of the stage is not always the same. It would be great to have them in my library that I can use when I need them.

Yes, that is what I’m doing in other forums. I was hoping that someone here is doing the same thing that I want to be doing and could share some wisdom with me. I’ve searched the Synfig Forum and found mention of using png2swf for pasting the pngs together. I was just wondering how people actually DO it. :slight_smile:

Nin

Are you sure the .png file from synfig have alpha bg ? can you post a .png file rendered by synfig … ?

Hi d.j.a.y!

Hmm. I’m pretty sure they have a transparent background… When they are viewed in Mac OX Preview, they display a pale grey background, like the transparent background images I create in Inkscape do when I view them in Preview as well…

When I uploaded the attachment it shows here as a white background. They must be transparent, right?

Nin

yep that’s good this side.

Seems to be good this other side (but where exactly this “mode x” come from ??? , could not find reference from w3c or libpng)

You may try with png created with other software … if that work could be a bug in synfig png renderer.

Hi d.j.a.y!

Never thought of that! I’ll give it a try and see what happens. Really hope it is not a bug.

Thanks,
Nin

Hi!
Do you also get the same problem when you select cairo_png as your render target in synfig?
Greetz!

Hi Darkspace65!

I gave it a try and the very same result. :frowning:

I imported the layers into Gimp and tried to use the filter animation. The resulting window shows the animation with the background transparent (yay!) but the layers ALL display as they cycle through, so the dolly is showing a “motion” thing. Here is a snap shot of what I mean.

Ugh, has anyone found a way to make each transparent layer appear, then leave the stage and have the next layer in the sequence play?

Nin

SUCCESS!!! :smiley: :smiley: :smiley:
I downloaded and installed the program JPEXS Free Flash Decompiler v.7.1.2

I cracked open the swf file and took a look at the guts of the swf.xml code. I replaced the <item type="SetBackgroundColorTag"> to

<item type="SetBackgroundColorTag"> <backgroundColor blue="255" green="255" red="255" alph="0" type="RGBA"/> </item>

And my little girl is playing with her dolly on a transparent background!!!

Screen Shot 2015-12-05 at 1.39.23 PM.png

Huzzza! Now my next step is to find out why png2swf is making the backgrounds with just rgb and fix it to state the rgba with the correct values.

But I can now add my custom animations to PowToons! Yay!

Nice for you, was tricky this one. Thank’s for others to have share how you solve it.

Also can you prefix the initial post with [SOLVED].

have a good synfig+powtools experiences…
see’u

Hi Nin, I am trying to complete the same task you described but the solution you used does not seem to work on my project. I was wondering if you could give some advice.

My character is animated in Synfig (about 10 second long animation) and I want to render with an alpha transparent background, so I can then place the video in a scene a short 3D animation I have produced in Blender. The animations were original created in Inkscape and I can import single frames as JPG’s with alpha transparent backgrounds into Blender. However, I want to animate these characters first and then place in Blender.

I have imported my SVG’s into Synfig and created the short animation. However, I cannot export any video format from Synfig, I have tried multiple settings and it does not seem to work. I guess you had the same problem???

I can export PNG’s. These PNG’s do not have an alpha transparent background, but they render with a black background and an alpha file.

I tried to install png2swf, and I was going to follow your steps, but for some reason png2swf closes everytime I open it. Not sure if you had this problem?

Also if I cannot get png2swf to work (for unknown reasons) is there any other way to convert all my png’s to a movie sequence with an alpha transparent background?

Any advice is welcome.

Hie Njleo and welcome to the forums,

Can you post your Synfig version / OS platform / …

I guess you have checked “Extract Alpha” ? But when exporting in png sequence you don’t need has png is an image file format who support natively alpha informations. Other, are you sure you have alpha on your composition ? Can you see the canvas checker board (like on this image ) ?