Copy link to clipboard
Copied
Hi,
I have problem in adobe animate cc, I want to transparent background for OAM file in adobe animate cc, before I place in indesign, Can you help me about this problem. Thank You for attention
You can use the following as a temporary workaround for canvas documents. Open the published html once and use a transparent color for the canvas:
<body onload="init();">
<canvas id=canvas" width="540" height="400" style="background-color:rgba(255, 255, 255, 0)"></canvas>
</body>
then go to the publish settings and uncheck - overwrite html.
Copy link to clipboard
Copied
I'm assuming you're exporting OAM out of a HTML5 canvas document.
Just add the following line of code in Actions panel on the first frame before exporting:
canvas.style.backgroundColor="rgba(0,0,0,0)";
Let me know if you face issues.
Copy link to clipboard
Copied
Hi, I try this way, but I have an error.
Scene 1, Layer 'Layer 1', Frame 1, Line 1, Column 7 | 1119: Access of possibly undefined property canvas through a reference with static type flash.display:Stage. |
Thank you.
Copy link to clipboard
Copied
Actions panel on the first frame before exporting:
canvas.style.backgroundColor="rgba(0,0,0,0)";
Does not work!!
Copy link to clipboard
Copied
This will work on a HTML5 Canvas document only. You seem to be using this code on a AS3 document.
Copy link to clipboard
Copied
I have the same issue, and I'm working on a HTML5 document. Missing Edge Animate already, want to create OAM's for use in Adobe Captivate and have been searching for hours to find a solution to have a transparent background. The Help is not updated (of course, seems to be very common problem with all Adobe applications), work flow described in Help is not valid anymore.
Copy link to clipboard
Copied
You can use the following as a temporary workaround for canvas documents. Open the published html once and use a transparent color for the canvas:
<body onload="init();">
<canvas id=canvas" width="540" height="400" style="background-color:rgba(255, 255, 255, 0)"></canvas>
</body>
then go to the publish settings and uncheck - overwrite html.
Copy link to clipboard
Copied
Hi,
Thank you for helping me , I try " dharmk" solution and sucessfully for transparent in indesign.
regards
Copy link to clipboard
Copied
Thank you!
Copy link to clipboard
Copied
I understand. But I opened HTML5 Canvas in Animate CC . And the line of code " canvas.style.backgroundColor="rgba(0,0,0,0)";" I wrote. why not transparent option in Animate CC?
Copy link to clipboard
Copied
Back to Edge Animate, lot more user friendly. Sorry, Animate CC, not only is the UI in many instances illegible (look at the screenshot I posted in my previous answer), but it lacks a lot of user friendly features that are present in Edge Animate. I will probably never use Animate CC to create games, my career is in consultancy for Captivate projects and their integration with Adobe applications (Audition, Photoshop, Illustrator...and I hoped on Animate CC). I deeply regret that such basic aspect like having a transparent background needs tweaking of published HTML, that even the small script mentioned by ougur's is not working.
Copy link to clipboard
Copied
Sorry, I missed a line of code in my earlier post.
For exporting transparent OAM files from HTML5 Canvas documents in Animate CC, you can try this:
Add the following code-snippet in Actions panel on the first frame before exporting:
canvas.style.backgroundColor="rgba(0,0,0,0)";
document.body.style.backgroundColor = "rgba(0,0,0,0)";
Copy link to clipboard
Copied
CODE SNIPPET FOR TRANSPARENT BACKGROUND.Open code snippets panel and import xml file (little grey gear top right.) To use select first frame on timeline open code snippets and double click on transparent background then export from publish settings LINK FOR CODE SNIPPET FILE....https://www.mediafire.com/?crtskn9ndqlmmc5 Hope this helps and thanks to Nipun...
Copy link to clipboard
Copied
Thanks, finally succeeded in creating a transparent background. The problems I had before (trying to insert in Captivate) are now linked with looping not functional in OAM. A non-looping animation is no longer an issue. Thanks PerriDesign and Nipun! Any solution for looping animation?
Copy link to clipboard
Copied
For looping go to Code Snippets once again, and open Html canvas: , select the last frame on your timeline, double click Select click to go to frame & play, where it says go to and play 5 which is the last line before close parentheses
change to 1 in the brackets. Then the normal publishing procedure etc... you should now have a looping animation.
Copy link to clipboard
Copied
Hi,
Thank you , finally succeeded in creating a transparent background. Your solution is very easy and simple
regards
Copy link to clipboard
Copied
Yes Yes it did work just place this action script in your very first frame of animation
canvas.style.backgroundColor="rgba(0,0,0,0)";
document.body.style.backgroundColor = "rgba(0,0,0,0)";
drag your .oam file to muse and that's it
Copy link to clipboard
Copied
thank you! Works fine!
Copy link to clipboard
Copied
Please note that the latest Animate CC release(June 2016) has a Support for transparent canvas background OAM publishing for Animate CC
In addition, this release has a lot more web publishing options such as Merging JSON/JS code, Embed JavaScript into HTML, HiDPI compatible HTML5 canvas output, Responsive scaling etc. Please refer New Feature Summary (June 2016)​ to learn more about the release.
Thanks!
Mohan
Copy link to clipboard
Copied
The Nipun's answer worked for me. Thanks
Copy link to clipboard
Copied
Yessss!!!! THANK YOUUUU!!!!