Table of Content
	Motion Works MediaShop [image]: Interactive Picture

Interactive Picture is a software tool that enable users to add interactivity (hotspots) to still bitmap graphics such as Windows' BMPs, RLEs and DIBs, so that users can build fully interactive custom multimedia applications and presentations quickly and easily.

This tool consists of two components:

1) a Visual Basic Custom Control, called the Interactive Picture Control (IPICT.VBX).

2) an external hotspot editor application, called the Interactive Picture Tool (IPCTEDIT.EXE), that is used to create and edit hotspots for a graphical picture.

To learn how to use help, press F1.

Contacting Motion Works

Interactive Picture Control

Interactive Picture Tool (HotSpot Tool)


Contacting Motion Works

If you have any questions, comments, or suggestions,  Motion Works would like to hear from you.  You can contact Motion Works at:

Motion Works USA,

524 Second Street, San Francisco,

CA  94107, USA

Tel: 1-800-800-8476, Direct (415)-541-9333,

Fax: (415)-541-0555


Interactive PictureBox
 Interactive PictureBox Control (HOTSPOT PICTURE)

Properties	Run-Time Properties	Events
Description	The Interactive PictureBox (IPict Control for short), or HotSpot Picture Control is a custom Visual Basic Control that allows multimedia application developers to link HotSpot Data Files (file extension of .HSP) created with the Interactive Picture Tool to a Visual Basic project that uses still bitmap graphics, and can provide these graphics with full hotspot interactivity capabilities.  'Hotspots' are rectangular regions in a picture that can detect and generate keyboard or mouse input events, so that developers and programmers can handle these events to program in various multimedia responses for the users who will be interacting with these hotspots during run-time.   The following is the icon representing this control.
File Name	IPICT.VBX
Object Type	IPict
See Also:	1)Interactive Picture Tool (an External HotSpot Editor Application) for ways to create HotSpots on a given picture, and
	2)How to Add this Contol to Visual Basic, and Link the HotSpot DataFile to an Interactive PictureBox Visual Basic Control


Properties, Runtime and Arrays Properties

PROPERTIES

There are a number of properties and events used to communicate between the interactive picture button and Visual Basic.  The following is a list of available properties for this control. Asterisk(*) denotes properties that apply to this control only or that require special consideration when used with it.

A. Properties

*About	Index	*ScrollEnable
BackColor	Left	Tag
BorderStyle	Name	Top
*DefaultHotSpotCursor	*PictFileName	Visible
DragIcon	*PictureHeight	Width
DragMode	*PictureLeft
Enabled	*PictureScaleToFit
Height	*PictureTop
HelpContextID	*PictureWidth
*HotSpotCount	*RunCursor
*HotSpotFileName	*ScrollCursor


RUNTIME PROPERTIES

Run-time properties are hidden away from the general properties list but can be used inside the Visual Basic program.  The following catergories of run-time properties are designed to give user picture control.

B. Hot Spot Array Properties (Run-Time Only)

*HotSpotBottom	*HotSpotName
*HotSpotClickCount	*HotSpotRight
*HotSpotCursorEnabled	*HotSpotTop
*HotSpotCursorName
*HotSpotEnabled
*HotSpotLeft
C. General Run-Time Only Properties

*hDC	Parent
*hPict	*WindHandle


Interactive PictureBox Events
EVENTS

The following is a list of available events for this control. Asterisk(*) denotes events that apply to this control only or that require special consideration when used with it.

D. Events

DragDrop	*Load
DragOver	*ObjMouseDown
GotFocus	*ObjMouseMove
KeyDown	*ObjMouseUp
KeyPress	*ObjMouseDblClk
KeyUp	*Paint
LostFocus


Interactive PictureBox Property, About

A. PROPERTIES

About Property

Description	Displays an About box for the control which contains the name of the control, and the version number.

Visual Basic	Not Applicable

Remarks	This property can only be used during development time and is activated by double clicking on the About property field which displays "Click here..."

Data Type	Not Applicable


Interactive PictureBox Property, DefaultHotSpotCursor
DefaultHotSpotCursor Property

Description 	Determines whether the Default [image] Cursor will be displayed for any hotspot in the Control that does not specified a custom cursor.

Visual Basic	[form.]IPict.DefaultHotSpotCursor[ = settings%]

Remarks	The following table lists the DefaultHotSpotCursor property settings for this control.

Setting	Description

______________________________________________________________________________________

0	Disabled

1	Enabled  (Default)

Data Type	Integer (Boolean)


Interactive PictureBox Property, HotSpotCount
HotSpotCount Property

Description 	Indicates the total number of Hotspots defined for this control.

Visual Basic	[form.]IPict.HotSpotCount

Remarks	This is a Read-Only property.

Data Type	Integer


Interactive PictureBox Property, HotSpotFileName
HotSpotFileName Property

Description 	Use this property to associate a HotSpot Definition File (.HSP extension) to the Control. A HotSpot Definition File is generated and saved by the HotSpot Editor (Interactive Picture Tool).

Visual Basic	[form.]IPict.HotSpotFileName[ = filename$]

Remarks	Anytime you edit HotSpots for the Interactive PictureBox Control, and save, this property is automatically updated with the HotSpot Definition File's name

Data Type	String


Interactive PictureBox Property, PictFileName
PictFileName Property

Description 	Use this property to associate a Background Picture for the Control.  This Control currently supports picture files with the following file extensions: BMP, DIB, and RLE.

Visual Basic	[form.]IPict.PictFileName[ = filename$]

Remarks	For a dialog-driven way of selecting the Picture file that you want, double-click on the property name within the Property Bar to invoke the Common Open File Dialog.

Data Type	String


Interactive PictureBox Property, PictureHeight
PictureHeight Property

Description 	Specifies the Height of the Bitmap in Pixels.

Visual Basic	[form.]IPict.PictureHeight[ = height%]

Remarks	This is a Read-Only property

Data Type	Integer


Interactive PictureBox Property, PictureLeft
PictureLeft Property

Description 	Determines the offset into or away from the left edge of the Picture itself relative to the left edge of the control window. The unit of measurement is in Pixels.

Visual Basic	[form.]IPict.PictureLeft[ = offset%]

Remarks	This property, along with the PictureTop property can be used to custom place a picture in a  window or to scroll a large picture within a small control window (with the help of algorithm or scroll bars). If multiple animation cels are placed in consecutive order within a picture file,  custom placement can be set up to manipulate simple frame animation.

Data Type	Integer


Interactive PictureBox Property, PictureScaleFit
PictureScaleToFit Property

Description 	Determines whether to display the Control's Background Picture in its

normal size, or scale it to fit the Control Window's frame.

Visual Basic	[form.]IPict.PictureScaleToFit[ = settings%]

Remarks	The default is to always show the picture in its normal size, or feature disabled ( 0 = Disabled, 1 = Enabled ).

Data Type	Integer (Boolean)


Interactive PictureBox Property, PictureTop
PictureTop Property

Description 	Determines the offset into or away from the top edge of the Picture itself relative to the top edge of the control window. The unit of measurement is in Pixels.

Visual Basic	[form.]IPict.PictureTop[ = settings%]

Remarks	This property, along with the PictureLeft property can be used to custom place a picture in a  window or to scroll a large picture within a small control window (with the help of algorithm or scroll bars). If multiple animation cels are placed in consecutive order within a picture file,  custom placement can be set up to manipulate simple frame animation.

Data Type	Integer


Interactive PictureBox Property, PictureWidth
PictureWidth Property

Description 	Specifies the Width of the Bitmap in Pixels.

Visual Basic	[form.]IPict.PictureWidth

Remarks	This is a Read-Only property

Data Type	Integer


Interactive PictureBox Property, RunCursor
RunCursor Property

Description	Used to specify the general run-time cursor for the Interactive PictureBox Control. The [Default] cursor is the [image].

Visual Basic	[form.]IPict.RunCursor[ = CursorNumber% or CursorName$]

Remarks	User may choose to double-click on the property at design time to invoke an OpenFile Dialog to select a cursor file (.CUR file).  Also see Cursor Specification Interface

Data Type	Integer/String


Interactive PictureBox Property, ScrollCursor
ScrollCursor Property

Description	Used to specify the run-time Scroll Mode cursor.  Scroll Mode is entered when the ScrollEnable property is set to True, while the user is doing a Left Mouse Drag action in an attempt to 'Grab' and 'Scroll a picture specified that is larger than the Control window frame.  The [Default] Scroll Cursor is the [image].

Visual Basic	[form.]IPict.ScrollCursor[ = CursorNumber% or CursorName$]

Remarks	User may choose to double-click on the property at design time to invoke an OpenFile Dialog to select a cursor file (.CUR file).  Also see Cursor Specification Interface

Data Type	String/Integer


Interactive PictureBox: Cursor Interface Section
Cursor Specification Interface Section

The Cursor Specification String that is required in three different properties in the Interactive PictureBox Control can contain either a:

- Cursor Resource Name,

(i.e. "HAND_CURSOR")

- Cursor Resource ID# ,

(i.e. "#101")  Note: The Resource ID# must be prefixed by the "#" signed, otherwise the string "101" will be treated as a Logical Cursor Number.

- Logical Cursor Number  of one of the built-in VBX Cursors,

(i.e. "1", "10000")

- Cursor Filename of .CUR extension,

(i.e. "C:\FINGER.CUR")

- Windows Built-in Cursors Label Name, accessed via their "IDC_" names as specified in the Window SDK.

(i.e. "IDC_WAIT")

List of Built-In Cursors:

	Cursor	Logical	Windows
	Resource	Cursor	Built-In Cursors
	Name	Number	Label Name
	FINGER_CURSOR
	HAND_CURSOR
	HANDUP_CURSOR	1
	HANDLEFT_CURSOR	2
	HANDRGHT_CURSOR	3
	HANDWALK_CURSOR	4
	HANDGRAB_CURSOR	5
	MAGNIFY_CURSOR	6
	QUESTION_CURSOR	7
	SOUND_CURSOR	8
		10000	IDC_ARROW
		10001	IDC_IBEAM
		10002	IDC_WAIT
		10003	IDC_CROSS
		10004	IDC_UPARROW
		10005	IDC_SIZE
		10006	IDC_ICON
		10007	IDC_SIZENWSE
		10008	IDC_SIZENESW
		10009	IDC_SIZEWE
		10010	IDC_SIZENS


Interactive PictureBox Property, ScrollEnable
ScrollEnable Property

Description 	Determines if a background picture that is larger than the Control Window can be 'grabbed' and scrolled with the Left Mouse Drag operation.

Visual Basic	[form.]IPict.ScrollEnable[ = settings%]

Remarks	The Default value is False or Scrolling is disabled.

( False = Disabled, True = Enabled).

When this property is enabled, the ScrollCursor will be used whenever the left mouse button is down while the mouse is moving.

Data Type	Integer(Boolean)


Interactive PictureBox Array Property

B.  ARRAYS

HotSpot Information Array Properties (Run-Time Only)

The follow properties are array properties, which means they must be used along with a valid index number.  A valid index number must fall between the value of 1 and the value in the Property HotSpotCount.  These array properties enable the Visual Basic programmer to set or retrieve data on HotSpots that have already been defined and loaded in memory during run-time.

e.g. Print "The Current HotSpot Name is: " + IPictureBox1.HotSpotName(HotSpotID%)

or

      IPictureBox1.HotSpotName(HotSpotID%) = "The Kitchen Door"

Property	Type	Description
HotSpotBottom	Integer	The 'Bottom' Coordinate of an already defined HotSpot rectangle.
HotSpotClickCount	Integer	Reports how many times a user has "Clicked" on the HotSpot with the Mouse since the application is run, or since the last time this value is resetted.  The HotSpot is considered "Clicked" only when the user has issued a full Mouse-Down and Mouse-Up action on the HotSpot, and while NOT in Scroll Picture Mode.
HotSpotCursorEnabled	Integer	Enabled or Disable Custom Cursor for a particular HotSpot.
		(True = Enabled or False = Disabled)
HotSpotCursorName	String	This field can contain either a Cursor Resource Name, Cursor Resource ID#, or a Logical Cursor Number of one of the built-in VBX Cursors, or an actual Cursor Filename of .CUR extension.  Windows Built-in Cursors can also be accessed via their "IDC_" names as specified in the Window SDK.
		(For a detail description of the Cursor Interface, and a list of available Built-In Cursors, please see explanation in the Cursor Specification Interface Section in previous pages)
HotSpotEnabled	Integer	Enable or Disable a HotSpot.
		(True = Enabled or False = Disabled)
HotSpotLeft	Integer	The 'Left' Coordinate of an already defined HotSpot rectangle.
HotSpotName	String	The User-Supplied name or Comments String of an already defined HotSpot.
HotSpotRight	Integer	The 'Right' Coordinate of an already defined HotSpot rectangle.
HotSpotTop	Integer	The 'Top' Coordinate of an already defined HotSpot rectangle.


Interactive PictureBox Run-time Property
C. GENERAL RUN-TIME ONLY PROPERTIES

hDC	Integer	Handle to the Off-Screen Memory Device Context that the control uses to retain and refresh the entire Picture image (including areas of the Picture that may be clipped from view outside of a small control window frame), and any changes to it, as well as for high speed scrolling of the image. (Read-Only)
hPict	Integer	Handle of the loaded Picture's Global Memory Buffer.
		(Read-Only)
WindHandle	Integer	Window Handle of the Control (Read-Only)


Interactive PictureBox Event, Load
D. EVENTS

Load Event

Description	This Event is triggered after the object has been completely loaded, and its properties initialized.

Visual Basic	Sub IPict_Load ( )

Remarks	The Load Event gives user an alternative to do some startup at the object Load level, instead of the usual Form_Load( ) level.


Interactive PictureBox Event, ObjMouseDown
ObjMouseDown Event

Description	This Event is Triggered when the Mouse Button is Pressed Down

Visual Basic	Sub IPict_ObjMouseDown( )

Remarks	This event consists of the following parameters:

HotSpotID% - an assigned Ordinal Number which uniquely Identifies a user-defined HotSpot Object.  If the Mouse Cursor is over a HotSpot when the Mouse Button is pressed Down, ObjID will contain a positive and non-zero value between 1 and the value in the property HotSpotCount, otherwise the value will be -1, indicates that the Mouse Cursor is not over a defined HotSpot.

HotSpotName$ - a text string which holds a Comment, or an Object Name that the VB programmer optionally specified when defining the HotSpot.

Note: If you want to use the ContextString as a wayto reference a HotSpot Object by Name, makesure the name you assigned is unique.

Button% - the Mouse button that is being pressed down.

Where Button = 1 means the Left Button is pressed Down,

Button = 2 means the Right Button is pressed Down.

Shift% - indicate if any one or a combination of the Shift State keys have been held down while the Mouse Button is pressed down.

These keys are SHIFT, CTRL, and ALT, where:

SHIFT is when Bit 0 is set, or a value of 1,

CTRL  is when Bit 1 is set, or a value of 2,

ALT    is when Bit 2 is set, or a value of 4.

i.e. SHIFT-CTRL will yield a Shift value of 3, whereas

ALT-SHIFT will yield a Shift value of 5, and

ALT-CTRL-SHIFT will yield a Shift value of 7, etc.

XPixel% - the current horizontal coordinate of the Mouse Cursor (relative to the top-left hand corner of the Picture).  If the picture have been scrolled or offsetted, the top-left corner's coordinate would be changed according to the shifts. The unit of the coordinate is in Pixel.

YPixel% - the current vertical coordinate of the Mouse Cursor is relative to the top-left hand corner of the Picture.  If the picture have been scrolled or offseted, the top-left corner's coordinate would be changed according to the shifts.  The unit of the coordinate is in Pixel.


Interactive PictureBox Event, ObjMouseMove
ObjMouseMove Event

Description	This Event is triggered when the mouse button is being moved over the Interactive PictureBox Control.

Visual Basic	Sub IPict_ObjMouseMove( )

Remarks	This event has the same list of parameters that are identical to the event ObjMouseDown, please see explanation there.


Interactive PictureBox Event, ObjMouseUp
ObjMouseUp Event

Description	This Event is triggered when the mouse button is being released over the Interactive PictureBox Control.

Visual Basic	Sub IPict_ObjMouseUp( )

Remarks	This event has the same list of parameters that are identical to the event ObjMouseDown, please see explanation there.


Interactive PictureBox Event, ObjMouseDblClk
ObjMouseDblClk Event

Description	This Event is triggered when the mouse button is being double-clicked over the Interactive PictureBox Control.

Visual Basic	Sub IPict_ObjMouseDblClk( )

Remarks	This event has the same list of parameters that are identical to the event ObjMouseDown, please see explanation there.


Interactive PictureBox Event, Paint
Paint Event

Description	This Event is Triggered when part or all of the Control's window is exposed after it has been moved or enlarged, or after a window that was covering the object has been moved.

Visual Basic	Sub IPict_Paint( )

Remarks	No parameters required


Interactive PictureBox Editor
 Interactive Picture Tool (HotSpot Editor)

Description: 	The Interactive Picture Tool is a hotspot editor that allows users to define 'hotspots' on a given bitmap.  A hotspot is any rectangular region in a picture graphic that can detect and generate keyboard or mouse input events during run-time, so that user can attach action(s) to it.  These action(s) can be anything that the user can program in a Visual Basic Control event.  The data file that is created by this editor (file extension of .HSP) can be imported into a Visual Basic project via the Interactive PictureBox Control (IPICT.VBX) to create Multimedia presentation.

How To...

(General Step by Step Tutorial )

The following are instruction steps of general and frequently used operations in the Interactive PictureBox Editor.  Various ways of performing each of the general operation will be discussed.  For a detail discussion of every features and operations of this editor, please refer to the Reference Section.

Invoke the Editor

Create a New  HotSpot DataFile

Edit or Open an Existing HotSpot Datafile

Add  a HotSpot

Give Focus or Select a Hotspot

Delete a HotSpot

Move a HotSpot

Size a HotSpot

Name a HotSpot or Change Information about a HotSpot

Change a HotSpot Object's Layer

Save

Exit the Editor

Link the HotSpot DataFile to an Interactive PictureBox Visual Basic Control

Reference Section...

User Interface, Menu and Dialogs Explained

The Main Editor Screen

The "Select a HotSpot Data File" Dialog

The "Select a Picture File" Dialog

The "HotSpot Information" Dialog

The "Select HotSpot" Dialog (Non-Modal)

The "Save As" Dialog

Concepts

How HotSpot Object's Layers are Organized

KeyBoard

HotSpot Editor Keys


To Invoke the Editor
To Invoke the Editor:

To invoke the Interactive Picture Tool (HotSpot Editor), simply open the "MediaShop" Group in the Program Manager and double-click on the [image] (Interactive Picture Tool) icon.

If this group or icon is not installed, select "Run..." from the File menu in Program Manager and then execute "IPCTEDIT.EXE" (*** Note: Remember to enter the correct path as well. ***).

Another way is to create an icon in the Program Manager for the application and then double click on the icon.

The final way is to use the File Manager.  Simply change to the sub-directory where the application resides, and double-click on it.


To Create a New HotSpot DataFile
To Create a New HotSpot Datafile:

Choose 'New' from the File Menu.  You will be prompted with the Select a Picture File dialog, where you can choose a picture for reference for marking hotspots.  When the picture is loaded, you can begin marking out hotspots on areas of the picture where you want to identify as HotSpots.


To Edit or Open an Existing HotSpot DataFile
To Edit or Open an Existing HotSpot Datafile:

-   Choose 'Open...' from the File Menu.  You will first be prompted with the Select a HotSpot Data File dialog, where you can choose a hotspot data file by the file extension (.HSP).

After this selection, you will also be prompted with the Select a Picture File dialog, where you will choose the picture that was used for reference when the hotspot data file was originally created.

When the picture is loaded, you can begin marking out new hotspots on areas of the picture where you want to identify as HotSpots, or edit existing hotspots and its information.


To Add a HotSpot
To Add a HotSpot:

-   Press down on the left mouse button and drag out a rectangle on the area of the bitmap where you want to identify as a HotSpot.

or

-   Go to the Edit Menu and select 'Add'.  A new hotspot will be created, and will appear on the top-left corner of the editor window.  To position the newly created hotspot, simply drag the hotspot to the area of the bitmap where you want to identify as a HotSpot, and size the rectangle accordingly .


To Give Focus or Select a HotSpot
To Give Focus or Select a HotSpot:

-  Simply point the mouse over the desired HotSpot and click down on the left mouse button.  When the HotSpot does have focus (or selected), it will be shown with four sizing handle on each corner of the rectangle.

or

-  Go to the Edit Menu and choose 'Select HotSpot...' to invoke a "Select HotSpot" dialog.  Pick the HotSpot name you wish to give focus to.


To Delete a HotSpot
To Delete a HotSpot:

-  Just give the HotSpot focus first, and then press the Delete key.

or

-  Give the HotSpot focus first, and then go to the Edit Menu and choose 'Delete' to remove it.

or

-  If you want to delete all the HotSpots at once, go to the Edit Menu and select 'Clear All'.  This is a quick way to start over again without having to abandon the bitmap and re-open it again in a brand new session; however, this operation can not be undone once the user answer Yes to proceed at the warning dialog given when 'Clear All' is selected.


To Move a HotSpot
To Move a HotSpot:

-  Just give the HotSpot focus first, and drag the HotSpot rectangle with the mouse to the desired area on the bitmap.


To Size a HotSpot
To Size a HotSpot:

-  Just give HotSpot focus first, and adjust the size of the rectangle by moving (dragging with the mouse) the sizing handle on the corner of the rectangle.


To Name a HotSpot or Change Information about a HotSpot
To Name a HotSpot or Change Information about a HotSpot:

-  Left-Double-click on a HotSpot to invoke the HotSpot Information Dialog.

or

-  Give HotSpot focus first, then go to the HotSpots Menu and select the 'Change HotSpot Info...' item to invoke the HotSpot Information Dialog.  The 'Name HotSpots' item in the Edit Menu will achieve the same result.

In the HotSpot Information dialog, the user can change a Comment or Object Name string to associate with the HotSpot, as well as an opportunity to change a custom cursor to be used whenever the mouse pointer is hovering over the HotSpot's rectangle.


To Change a HotSpot Object's Layer
To Change a HotSpot Object's Layer:

To change a hotspot's layering position, go to the Edit Menu and choose 'Select HotSpot...' to invoke a 'Select HotSpot' dialog.  Click on a hotspot name on the list whose position you want to change, and start dragging that name up or down the list, until the hotspot is in a desired location on the list (eg. in front of or behind some other hotspot on the list).  On this list, the representation is: top of the list is the furthest back layer, whereas the bottom of the list is the front or top most layer.

Other ways of changing a HotSpot layer includes using the 'Bring to Front', 'Send to Back', 'Bring Higher' and 'Send Lower' menu items in the HotSpot Menu, or their hot keys and toolbar's buttons equivalent.  See Reference Section for details.

Related Topic:

How HotSpot Layers Are Organized


How HotSpot Object's Layers are Organized
How HotSpot Object's Layers are Organized:

-  There are times when you want to change a HotSpot Object's Layer, or its position relative to other hotspots in terms of how far toward the very back versus towards the very front.  Especially when you create senarios where you have overlapping hotspots.

Each time a HotSpot is created, it is automatically assign a HotSpot ID.  This ID is based on the ordinal position of the HotSpot in the list. New hotspot that are created are always append to the bottom of the list, with the highest ID number.  When a hotspot in the middle of the list is deleted, all other hotspots that are created later than the deleted hotspots will have their position shuffled up the list, eg. their IDs' value decreased by 1.

What this means is that the first hotspot ever created is always assigned an ID number of 1, the next IDs created will be 2,3,4 and so on.  An ID number with the smallest value (eg. the first hotspot ever created) is considered to be the furthest back in position, whereas an ID number with the highest value (eg. the last or most recently created hotspot) is considered to be in the front most position.

Related Topic:

How to Change a HotSpot Object's Layer


To Save
To Save:

-  Choose 'Save' or 'Save As...' from the File Menu.  For the Save As option, you will be prompted with the Save As... dialog, where you will have the opportunity to specify a filename of your choice as the name of the to-be-saved hotspot data file.  If you are creating a new hotspot file that has never been saved before, choosing Save will also invoke the Save As... dialog, so that you will be able to name the newly created data file.


To Exit the Editor
To Exit the Editor:

-  Choose 'Exit' from the File Menu or left double-click on the editor window's system box (located on the top-left corner of the editor's window)


To Link the HotSpot DataFile to the Interactive PictureBox Visual Basic Control
To Link the HotSpot DataFile to the Interactive PictureBox Visual Basic Control:

1. Add the IPICT.VBX module to your Visual Basic project.  (Choose 'Add File...' from the the File Menu in Visual Basic).  The [image] icon will appear on the ToolBox palette if the Interactive PictureBox custom control is loaded sucessfully.

2. Double-click on the [image] icon on the ToolBox to create a Interactive PictureBox control on the Form you are working on.

3. Double-Click on the HotSpotFileName property from the Property Window and choose the Hotspot Data File that you have just created and saved using the Interactive PictureBox HotSpot Editor.  If the HotSpot Data file (extension .HSP) is loaded sucessfully, the HotSpotCount property should contain the value of the number of Hotspots created using the editor.

4. The last step: double-click on the PictFileName property from the Property Window and choose the Picture File that you have just used as reference when creating the HotSpot data file using the Interactive PictureBox HotSpot Editor.  Now the link is complete!


The Main Editor Screen
The Main Editor Screen:

Click anywhere on the graphic above to get context specific help on any of the interface elements.


The "Select a HotSpot Data File" Dialog
The "Select a HotSpot Data File" Dialog:

(invoke from the "File Menu - Open Option")


The "Select a Picture File" Dialog
The "Select a Picture File" Dialog:

(invoke from the "File Menu - New Option, or appear immediately after the "Select a HotSpot Data File" Dialog is invoked)


The "HotSpot Information" Dialog
The "HotSpot Information" Dialog:

(The Dialog that appears when double-clicking on a hotspot, or press ENTER key on a selected hotspot.  This dialog allows the user to change information and attributes about a hotspot):

Click anywhere on the graphic above to get context specific help on any of the interface elements.


The "Select HotSpot" Dialog  (Non-Modal)
The "Select HotSpot"  Dialog (Non-Modal):

Choosing a HotSpot (Choose a HotSpot by selecting its name):

Click anywhere on the graphic above to get context specific help on any of the interface elements.


The "Save As" Dialog
The "Save As"  Dialog :

This dialog enables the user to set the path and name of the HotSpot Data filename that they like to save the changes to in the current editing session.  This dialog can be invoke from two sources: 1) by choosing the Save As option from the File Menu, 2) by choosing Save in the File Menu when the HotSpot Data file you are editing is being created and saved for the very first time.


HSP Extension

Default extension of HotSpot files is .HSP.


Directory Status

This area indicates the current directory status.


HotSpot Editor Keys
HotSpot Editor Keys:

Key	Function

F1	Display Help.

ALT+BACKSPACE	Undoes last edit.

DEL	Deletes the selected hotspot.

F2	Selects the last hotspot.

F3	Selects the next hotspot.

F4	Creates / Add a new hotspot.

F5	Display the 'Select a HotSpot' dialog (non-modal).

ENTER	Invoke the 'HotSpot Information' dialog.

CTRL+S	Saves any changes to the currently opened HotSpot Data File.  If changes has never been saved to a file before, the 'Save As' dialog would be invoked.

CTRL+A	Invokes the 'Save As' dialog to let user save changes to a new or different filename.

CTRL+EQUAL	Promotes the selected hotspot to the very front layer (Bring to Front).

CTRL+MINUS	Demotes the selected hotspot to the very back layer (Send to Back).

SHIFT+EQUAL	Promtes the selected hotspot one layer higher towards the front relative to its current layer positioning (Bring Higher).

SHIFT+MINUS	Demotes the selected hotspot one layer lower towards the back relative to its current layer positioning (Send Lower).


Sizing Handle


Finger Cursor

This cursor indicates that the mouse pointer is hovering over a hotspot, otherwise the mouse pointer will be an arrow pointing upward towards the left.


A Selected HotSpot


A Hotspot


Edit Area


Vertical Scroll Bar


Horizontal Scroll Bar


Sizing Corner


Open


Save


Bring To Front
Bring To Front (ToolBar Button)


Send To Back
Send To Back (ToolBar Button)


Bring Higher
Bring Higher (ToolBar Button)


Send Lower
Send Lower (ToolBar Button)


Add a HotSpot
Add a HotSpot  (ToolBar Button)


Delete a HotSpot
Delete a HotSpot  (ToolBar Button)


Caption Bar


Mouse Position


Scroll Offsets


HotSpot Count


HotSpot ID


HotSpot Name


HotSpot Bounding Rectangle Coordinates


Cursor Enable Status


Cursor Name/ID


File Menu

____________________

New...

Open...

Close

____________________

Save	Ctrl+S

Save As...	Ctrl+A

____________________

Exit

____________________


Edit Menu

______________________

Undo	Alt+Bksp

______________________

Add	F4

Clear All

Delete	Del

______________________

Last HotSpot	F2

Next HotSpot	F3

______________________

Select HotSpot...	F5

Name HotSpot...	Enter

______________________


HotSpot Menu

____________________________

Bring To Front	Ctrl+Equal

Send To Back	Ctrl+Minus

Bring Higher	Shift+Equal

Send Lower	Shift+Minus

____________________________

Change HotSpot Info	Enter

____________________________


Help Menu

__________________

Help	F1

__________________

About...

__________________


New...  (File Menu)

The New menu item will start a new hotspot editing session.  This command accomplishes this by first saving and clearing any existing hotspot in the session, than invoke the 'Select a Picture File' dialog to let the user chooses a reference picture to create the hotspots on.  Once the picture is loaded, the user can begin the new editing session.

Keyboard: 	None

ToolBar Icon: 	None


Open...  (File Menu)

The Open menu item will load a HotSpot Data file as well as a reference picture into the editor after invoking first the 'Select a HotSpot Data File' dialog, and then the 'Select a Picture File' dialog respectively, and let the user make the necessary choices.  Once the two selected files are loaded, the user can begin their editing session on the editor.

Keyboard: 	None

ToolBar Icon:


Close  (File Menu)


Save  (File Menu)

The Save menu item will save any changes made to an existing hotspot data file since the last save.  If this is going to be a newly created hotspot data file (eg. never been saved before), the Save As dialog will be invoked instead.

Keyboard: 	Ctrl+S

ToolBar Icon:


Save As (File Menu)
Save As...  (File Menu)

This Save As... menu item will save any changes made to an existing or new hotspot data file.  Choosing this menu item will invoke the Save As dialog.

Keyboard: 	Ctrl+A

ToolBar Icon: 	None


Exit  (File Menu)


Undo  (Edit Menu)


Add  (Edit Menu)


Clear All  (Edit Menu)


Delete  (Edit Menu)


Last HotSpot  (Edit Menu)


Next HotSpot  (Edit Menu)


Select HotSpot  (Edit Menu)


Name HotSpot  (Edit Menu)


Bring To Front  (HotSpots Menu)


Send To Back  (HotSpots Menu)


Bring Higher  (HotSpots Menu)


Send Lower  (HotSpots Menu)


Change HotSpot Info  (HotSpots Menu)


Help  (Help Menu)


About...  (Help Menu)