Catptivate 2019 has margins empty when importing Animate OAM file

[cazimier]

I am fairly new at learning Animate. A total noob. But I have manage to create a few small eLearning animations for a few silly games requested by our ISDs. When I create something in Animate (HTML canvas, sized as neede 640x360 px, center stage and responsive set to BOTH, and OAM is tranparent. stage has transparent background) then import as an HTML animation in Captivate, I consistently get a top and left magin that pushes the animation outside of the right and bottom edge of the frame. Does anyone know if there is a setting or some code I can edit to correct this? Or at least why and how it is happening. It looks like there is some padding added. My coding abilites are weak but I have a coworker who programs that can help if needed. But first I have to help find out why it is happening. 

Also is it true, that an .ini change to the CP code will allow us to layer the OAM file below a static graphic? Currently it always appears on top when viewed and published from CP. I just discovered this today and have yet to ask my progrmming collegue about this. Trying to do some perliminary research for her. Thanks for any input you can provide. 

[RodWard · Accepted solution]

The required change to the AdobeCaptivate.ini file found in the Captivate install directory is as follows:

UseWidget7 = 1

[cazimier]

Thank you. I'll have my collegue assist with editing the .ini file. 

[Lilybiri · Accepted solution]

For the OAM, need more time to double-check.

For your last question, this is the answer I mostly give:

"Animations and web objects are always on top, whatever the stacking order in the timeline. You need to edit the captivate.ini file, and toggle the value of UseWidget7 to 1 in the file captivate.ini. You find it in the installation folder, need administrator rights."

[cazimier]

Thank you. I'll get my collegue to help with this one. She isn't afraid of the CP .ini file.  🙂

[RodWard]

Just one extra thing you need to be aware of with changing settings in the captivate.ini file.  Windows will likely prevent you from simply opening the file directly in Notepad and then just editing the value before saving and closing. 

This is a file buried inside the Program Files folder and as such it will be protected.  So, even though you already have Administrator rights to your computer it will try to block you.

The trick is to take a copy of the file and save it to another folder somewhere, then make the edits to that copy.  When finished, copy the edited file back to the original location, overwriting the previous version. You will still need to be an Admin to do this.

[cazimier]

Thanks RodWard. I was able to locate and edit it using Notepad++  Preliminary change seems to work. I'll test it more tomorrow. Thank you for the advice. Hoping I can get the OAM margins fix as well.

[cazimier]

@Lilybiri  The INI change worked like a charm for layering above the OAM file. Thank you so much. We still have to test on the LMS, but it works nicely in HTML5 Preview for chrome.

Have you had any success in finding a solution for the OAM margins? Fingers still crossed. 

Regards,

Cazimier

[TLCMediaDesign]

in the HTML file that is published from animate you'll need to add this CSS to the head section:

<style>

body{
margin: 0px 0px
}

</style>

[cazimier]

Thank you. I hope the OAM issue is as easy as changing CSS. 🙂

[cazimier]

@TLCMediaDesign   OMG! LIGHTBULB!

I was listening to a youTube video for something else in Animate and I think I found the missing link. I figured out what you were trying to tell me -- When publishing an OAM from Animate, you get 3 files that are sort of a "package" - HTML, JS, and OAM.  I didn't grasp how they worked together. DUH!  Being a noob is so time consuming!  You were EXACTLY correct about how to fix the issue.

Locate and Edit published HTML (I used Notepad++) then 

find and locate magin:auto; change it to margin: 0px 0px;  and save the file BEFORE adding the OAM file to CP.

TA-DAAAA!!!!!   This in turn removed the blank margin mentioned above when imported into CP!!!

I'm not a programmer, just hang out with a few.  I have 7 of these to do!!!  Thank you so much!!!  Snoopy Dance!!  

[cazimier]

RATS! I was wrong... I had to reboot the computer and nothing changed. I wish I could delete the post but can't see a way to do it.

And actually the margin is only in CP. Once in HTML preview, it jumps into place the moment it begins playing.So my solution is to create 2 overlay layers with a static image on each and use the alpha to/from effect so I can fade out the static image. Sigh. This makes placement as part of a layered slide extremely difficult. I'll definately metion it the next time the "rate captivate" windows appear. 😞

[RodWard]

Perhaps this will help.

When you publish an HTML5 Canvas project from Animate you always output an HTML, and JS file with the same name as your project plus one or more folders named libs (for Animate's Create.JS files) and possibly an images folder containing any JPG or PNG files your project needs.  If you had also selected the OAM checkbox in the output options then you will have another OAM file that is basically just a renamed ZIP archive that contains all the other files plus an XML file as well.

Captivate accepts the OAM file as an animation, but (if you do it properly) you can also just select and zip the other output files and insert that zip file as an animation.  Either one will usually work.  The OAM is the better way to go because there's no extra steps to get it to work.

[kdmemory]

Hi cazimier

Maybe, just maybe: Did you check in Animate under Publish Settings the option Scale to fill visible area? Like this:

Klaus

[cazimier]

Kdmemory, Scale to fill visible area does fill in the margin area, but it also "scales" the image up. Once enlarged, it is hard to layer on the page because of the size change. Even if I save out my images to accomodate the extra 8px size increase, it still makes precise placement difficult. What it is good for, as I suspected, is helping to scale the animation with better quality. But thank you for you input.  🙂

[cazimier]

None of these worked. What I think happened is that I used a transparent background for scene 1. However I never set a shape object or symbol to the boundaries of the stage (820px X 830px). My theory is CP didn't recognize the stage size, but will recognize a size if a transparent symbol. I was able to stop the margin from jumping once I placed a shape (820px X 830px) the same size of the stage on scene 1 then turned its alpha to 0% as well.   

AND, because I used maskes to assist with transparnecy in many of my OAM file, i had to scrap and  rethink everything - the mask caused the OAM to play WAY to slow, especially if there were a handfull of OAM in the CP.  😞  Noob mistake, but at least I learned something for my efforts. 🙂  I'll research that later.