September 12, 2009

extend google map widget, make it interactive

Adobe Captivate supports three kinds of objects. Static , Interactive and Question. Static objects inside Captivate are Text captions, animation, highlight box. Difference between static and interactive objects are that latter allows user to interact which means that when on slide it should pause the slide. It has success, failure and hint captions associated with it which are shown in corresponding cases. And lastly it can participate in scoring of the course. An example of interactive object in captivate would be a button or click box.

It has been long time I have written about using google maps API inside Adobe Captivate widgets. Look at the widget created in the post. Try the widget here. BTW the place in the widget was top view of "Statue of Liberty" – Lat – 40.6894 Long – -74.0447. But you know that this widget had something missing as you would have to insert a button on the slide to pause and let user do something. Why not it should stop by its own. What would it need to let widget pause the slide and behave like a interactive object. The answer is interactive widgets.

And what would it need to change our static widget to interactive widgets. You can read the finer details here and below are bare minimum steps needed –

Step 1 - you would change the API isStatic() to isInteractive(). This tells Captivate that the widget is interactive and gives you all the additional functionality. Doing this step alone will pause the captivate slide and give you the following dialog.

Below option lets you choose the default captions associated with interactive objects.

And should it be included in quizzing.

As you can see there are more options available to you and its very similar to a button or a click box.

Step 2 - Define a variable interactiveWidget_mc which is used to talk to captivate movies.

Step 3 – Define three functions setFailure, setSuccess, setShowHint. The widget developer has to decide when to send success event. In my case I will pass success event when user has clicked on the widget. I will set up a event listener for mouse clicks and when user has clicked I will call setSuccess.

function Release(event:MouseEvent):void{           

              setSuccess();

}

this.addEventListener(MouseEvent.CLICK, Release);

I will leave other funtions for you to try out.

See these in action. Click here or the image below to download the Captivate movie.

Source files discussed in this post -

Source file for widget(.FLA file) – Download
Widget file which can be used in Adobe Captivate 4(.swf file) – Download

Do let us know what other things you tried to enhance it.

,,

Posted by Rajeev Kumar3:20 PM
  • Subscribe to RSS feeds
  • Loading

  • Categories

  • Archives

  • Authors

  • Recent Comments

    • Greg Lam - Small Business Doer: Is there any way to bring in an Adobe Edge animation in Captivate 7 and publish the...
    • Duke: Hey, alan… I love these sessions and refer to them often. Looks like I no longer have the video, even...
    • Tianna Tagami: I was told the same thing. I downloaded the trial and signed in, and it’s still asking for a...
    • enute: I was traveling and missed the GIFT webinar. Will it be posted soon? I really want to see that.
    • Wanda: Just watched the 2 training sessions (links above) answered all of my questions! Amazing tool!!!!

  • Captivate & eLearning Videos

    Subscribe to Adobe eLearning on YouTube.

    Check out the latest eLearning Videos on AdobeTV