Tutorial: Changing the info box in the Adobe Captivate Playbar

This small tutorial shows you how to change the info box in the AS2 versions of the Adobe Captivate playbars.

Requirements:

Adobe Flash.
The image that you want to substitute the Adobe Info box with.

Instructions:

Step1:
First you need to open up the playbar fla that you want to edit. You find the source files in the directory where you installed Adobe Captivate and then Templates/PlaybackFLA/AS2.

Step2:
Now that you have the source file open in Adobe Flash you start off by inserting a new layer in the main timeline.

Step3:
Create a new movieclip (CTRL+F8) and name it “infobox”.

Step4:
Import your image to the library.

Step5:
Insert the image from the library into the infobox movieclip you created.

Step6:
Go to the main stage and drag the infobox movieclip onto the stage (in the new layer you made).

Step7:
Give the infobox movieclip the instancename “infobox_mc”.

Step8:
With the infobox movieclip selected (click once on the clip on the stage) hit F9 to enter the actions panel. In here we need to put some code to make the movieclip invisible at the start.

Insert this code:

// this code sets the movieclip to invisible when loaded.

onClipEvent (load) { 

this._visible = false;

}

// this code sets the movieclip to invisible when clicked.

// We need this so the user can close the infobox again.

on (release){ 

this._visible = false;

}

Step9:
Open the “pcbBtnInfo” from the library.

Step10:

Open the actions in the pcbBtnInfo movieclip (hit F9 while having the actions layer selected).

Step11:

Delete all the existing code.

Step 12:

Insert this code instead:

var btnTipsId = 9;

function onClicked(){ 

// create a variable to hold the path

var info_mc = _parent._parent.infobox_mc;

// set the infobox as visible

info_mc._visible = true;

// align the infobox to the center of the stage

info_mc._x = (Stage.width - info_mc._width)/2; 

info_mc._y = (Stage.height - info_mc._height)/2; 

};

Step 13:

Save your flash file and publish it. (I used the name myPlaybar)

Step 14:
Go to the Templates/PlaybackFLA/AS2 directory and copy the myPlaybar.swf and paste it into C:\Program Files\Adobe\Adobe Captivate 4\Gallery\PlaybackControls\SwfBars\AS2.

Step 15:
Select your new playbar in the Adobe Captivate settings and that’s it.