Trouble With the "Down" State of SmartShape Buttons

[TinkerTrainer]

I am using SmartShapes as simple "click to continue" buttons on many slides and I have just run across the second problem with the "Down" state of each of those identical buttons.

After copying one of these buttons for use on the same slide, the text in the button - set to be aligned in the middle - is now resting at the bottom of the button, even though the setting does not change. To fix the text positioning I have to click either "Align Top" or "Align Bottom", then click back to "Align Middle".  Annoying, but it only happens when I copy a button from within the same slide. If I bring in a copy from another slide in the same project, it doesn't occur.  Minor. Meh. No big deal.

Today's problem, though, affects every button in every project.

The latest "update" to my client's desktop configuration failed to re-install Flash, so now viewing my .PDF training modules requires my students to go through IT for a Flash install. In response I'm updating everything to HTML5.  Saw it coming. No biggie.  BUT - none of my "click to continue" buttons works properly. Again, the down state is the problem, because the entire SmartShape button shifts its position up approximately 20 pixels when it is clicked. More specifically, the SmartShape button moves up when the mouse button is held (or clicked down), but moves back down when the mouse button is released.  The other two states remain as designed.

I did find a solution after some experimentation: The down state has a shadow effect the other two states do not.  I set it for "Outer" and then used the center selection of the nine options.  If I turn the shadow OFF, the button no longer jumps after I publish to HTML5.

If I have to do this for each button in over 25-30 projects...wow.  The real question is: Can I fix all the buttons at once within a single project before I publish to HTML5?

I am using Captivate v9.0.2.437, these projects are non-responsive, and the HTML5 Tracker gives clean results.

Thanks!

[Lilybiri]

I recognize the first bug with text not being aligned the same way in the rollover/down states and I fix it the same way.

However, it looks like you don't use object styles for the shape buttons? Is that correct? The object style will have the styling of the three InBuilt states (not the custom states if you add them). You can apply that style to any button of any form. Text is not part of the the object style for a shape. I'm afraid that you did override a custom shape style, whch make it very difficult to have a change in style propagating to other shape buttons. That style could have been saved with the custom theme as well, changing one item in a theme and reapplying it to all projects is also possible then.

Can you confirm that the shape button don't have a named object style?

[TinkerTrainer]

Check - that first bug is easy to prevent once you figure it out.

I am not using a named style for these buttons, no.  It is, of course, a modified version of the Default Smart Shape Style...

So if I'm following you right, can I not create a custom style which works under HTML5, then apply that style to each button?  Still tedious, but I would not have to edit the states of each button!

[Lilybiri · Accepted solution]

You could, if the present buttons do use a style that is not overridden: overridden status is indicated by a + sign before the style name. To explain I will suppose that all the shape buttons in the project use the 'Default Smart Shape'.

If that is the case, you can create a custom named style for one of the shape buttons,  example 'MyButtonStyle', which has the correct styling for all InBuilt states (Normal, Rollover, Down. Then use the hamburger menu and apply that style to all buttons that presently use the style 'Default Smart Shape.

As I see so often in projects of clients: many users simple override styles all the time, and in that case you are stuck because there is no way to change an overriden style globally in a project.

[TinkerTrainer]

Thank you, Lieve.

I never considered the danger of using an override object style.  And here I am.  But still, applying a corrected custom style will allow me to fix the problem much faster than I was expecting.

So do you have any idea why my buttons would jump because of a translation to HTML5?  That one stumps me.

Steve

[Lilybiri]

In my previous career I have been training for a lot of software applications, including desktop publishing apps, and I was very pleased when I discovered the power of the themes appearing with Captivate 6.  It is so sad that you almost never see any training nor book about Captivate talking about 'good practice' which was en is still alway my priority. That aspect of creating a Captivate course can save so much time, it is a mystery to me why it is ignored.

I did see that bug appearing for shape buttons, text not being in the same location for Rollover and Down state, with version 9.  I am not sure it is linked to a transition to HTML, it is just a but with the new feature of InBuilt States, the new State panel. In CP8 you could define those states in a totally different way in the OSM than is now the case. Changes in work flows often cause that kind of early bugs, not only in Captivate. This is my personal opinion, logging those bugs by as many users as possible is the best way to have them solved quickly.

[denab5454630]

Since this is an old post, hoping there is some new knowledge on the issue. I am experiencing the same problem as mentioned at the end of the post. When I publish my course to html5 - the smart shape buttons when clicked (inbuilt 'down state') dislocate by 20-30px in any direction. I played around with the shadows as suggested here and found that removing the drop shadow entirely from the down state does not fix the issue, but only switching it to an outer shadow renders it correctly when published. The interesting thing is that this only started happening as I was almost finished with the course and ready to publish. I have a backup file I saved about halfway through and the buttons render correctly when published from that version, but not in my current one. I'm trying to figure out what I may have changed that caused this issue to start happening, so that I could possibly reverse whatever it was without having to change the style for all my buttons (they are all different and would require manual changes to state for each one - very little uniformity). Any new information on this bug would be appreciated!