Flash Tutorial: Drawing Straight Lines with the Pen Tool.

Home • Members Tutorials Forum iSnapChat Contact Us 


Flash Tutorials


Free Flash Tutorial - The Pen Tool


Free Flash Tutorial

Step 2    <<   Previous      Intro   1   2   3   4   5   6   7   8   9  10   11   12  13     Next   >>    


Step Two: Drawing Straight Lines with the Pen Tool.

The Pen Tool is not intuitive. You do not draw the line but the Anchors and direction Points as described in the previous section. Because this is a bit different I will take you through the use of the Pen Tool very slowly step by step.

    Important Note: This tutorial has been written for Flash CS3 but you will find that the Pen Tool is very similar in previous versions. I will point out important differences. You can find out what version of Flash you are using by going to: Help > About Flash

  1. Open a New Flash Document: File > New (Ctrl N)
  2. Select a Flash Document: Flash File Flash File (ActionScript 2.0) or (ActionScript 3.0)
  3. Click: OK

  4. In the Tools Panel Select the: Pen Tool:
  5. To draw a straight line place the Pen Tool on the Stage: Click (No dragging!)
  6. Move the Mouse to a new location: Move Mouse (No dragging!)
  7. To place the 2nd Anchor Point click the Pen Tool on the Stage: Click (No dragging!)
  8. Example: Download the Flash Drawing Template  Draw 224a  (Straight Lines)

  9. Continue Clicking to add additional Anchor Points: Click, Move & Click Again (No dragging!)
  10. If you keep clicking you will continue adding new line segments:

    Additional Segments.

    Note: To constrain the path to vertical, horizontal and 45 degree angles, hold down the Shift Key when clicking (except when using Snap to Grid).

  11. To finish the line hold the Control Key and Click in an empty space on the Stage: Ctrl Click
  12. To restart a new line release the Control Key and: Click, Move & Click etc. (No dragging!)

  13. Try to draw a: Zigzag
  14. Tip: To get it exact try using Snap to Grid

    1. Display Grid: View > Grid > Show Grid (Ctrl #)
    2. Set the Grid to Snap: View > Snapping > Snap to Grid (Ctrl Alt #)
  15. To finish: Ctrl Click

    Flash CS3 Tip: If you forget to Control Click to complete the line you will inadvertently add another section on to your previous line. Don't worry (I still make this error!) there is a simple solution. Simply press the Delete Key and the last section of your line will be deleted leaving the all the previous sections in tact. Try it.

    Flash CS3 Tip: Also if you click in the wrong place press delete and re-click in the correct location. You will find the new segment attaches to the previous line segment.


Step 2    <<   Previous      Intro   1   2   3   4   5   6   7   8   9  10   11   12  13     Next   >>    

21611 visitors to this page since June 08 •

Phil Schulz's Facebook Profile
Webwasp is Phil Schulz's baby. You are welcome to contact me or become my Facebook friend: Click here

 Top of Page HomeMembers Tutorials Forum iSnapChat Contact Us 
 All material on this site is protected under international copyright © law. DO NOT reproduce any material from this site without written permission. Please ask as permission is often granted.