Label 59 : Knowledge Base
Help Topics
 
Creating Custom Icons, Connector Ends and Arrow Ends

DOWNLOAD Working File (.Zip)
• Open Adobe Flash CS3 or higher

• Create New > Flash File (Actionscript 3.0) or Go to Menu Bar and select File > New > Flash File (Actionscript 3.0)
• Save your file as myCustomIcon.fla

• Select Layer 01 and choose the Text Tool
Top
• Using the Text Tool type > (greater than symbol) to draw an arrow. Set its properties in the Properties Panel. You can use any font and font size.
• Select the text arrow and from the Menu Bar select Modify > Break Apart (or Press Control + B on Windows or Command + B on the Mac)

• Select the arrow and from the Menu Bar select Modify > Convert to Symbol (or Press F8)

Top




 

• Name the symbol markericon, select symbol type as Movie clip, Registration point should be in the center and click OK

• Now select the arrow again and give it an instance name markericon (in the Properties Panel)


 

• Double click on the arrow to edit the movie clip

• Select the arrow shape and set its dimensions to 36 x 36 px (in the Info Panel)

 

• Align the arrow shape to the center

NOTE
In this case we have aligned the arrow to the center of the markericon Movie clip as we want this markericon to rotate along its center. The plus hashmark (within the Movie clip symbol) acts as the pivot point of the markericon and the markericon rotates along this pivot. After aligning the arrow you can select and move it (using the cursor keys) to set its pivot point.


Top

• Go back to Scene 1 (by exiting markericon editing mode)



 

• From the Menu Bar select Modify > Document and change dimension to the dimensions of the arrow markericon you have made.
In this case the dimensions of the markericon symbol are 36 x 36 px (Width x Height).


Note : You can set the Marker Icon dimensions whatever you want but the Marker Icon and Document Dimensions should always match.

• Select the markericon symbol on stage and align it to the center to the new canvas 36 x 36 px

• Now insert a new layer and name it Actions and select Frame 1 of that layer

• Open the Actions Panel by going to Window > Actions (or Press F9) and type the following Actionscript Code
Top

• Save your file (File > Save)

• From the Menu Bar select Control > Test Movie (or Press Control + Enter on Windows or Command + Return on the Mac)

Your SWF Marker Icon is ready for upload (the SWF file - myCustomIcon.swf will be created in the same location where
the .fla file - myCustomIcon.fla was saved)

NOTE : You only need to upload the .SWF File. DO NOT UPLOAD THE .FLA FILE

THE MARKER ICON JUST CREATED CAN BE USED AS CONNECTOR END OR ARROW END

For connector ends and arrow ends, which are to be used as pointers, the direction of the pointer should be set to 0 degrees as in the above example i.e. it should always point towards right.

    Top
 
Copyright Label 59