File: charview.html

package info (click to toggle)
fontforge-doc 0.0.20100429-1
links: PTS, VCS
area: main
in suites: squeeze, wheezy
size: 7,240 kB
ctags: 1,482
sloc: makefile: 2
file content (1071 lines) | stat: -rw-r--r-- 47,425 bytes
<HTML>
<HEAD>
  <!-- Created with AOLpress/2.0 -->
  <!-- AP: Created on: 6-Dec-2000 -->
  <!-- AP: Last modified: 5-Apr-2010 -->
  <TITLE>Outline Glyph View</TITLE>
  <LINK REL="icon" href="ffanvil16.png">
  <LINK REL="stylesheet" TYPE="text/css" HREF="FontForge.css">
</HEAD>
<BODY id="menued">
<P ALIGN=CENTER>
<IMG SRC="fontforge-banner-420.jpeg" WIDTH=420 HEIGHT=80>
<DIV class="menucontainer">
  <UL class="menubar">
    <LI class="menu">
      <A href="/project/platformdownload.php?group_id=103338">Download</A>
      <UL>
	<LI>
	  <A href="http://sourceforge.net/project/showfiles.php?group_id=103338&amp;package_id=111040"
	      >Application</A>
	<LI>
	  <A href="http://sourceforge.net/project/showfiles.php?group_id=103338&amp;package_id=114329"
	      >Documentation</A>
	<LI>
	  <A href="http://sourceforge.net/project/showfiles.php?group_id=103338&amp;package_id=114328"
	      >Source</A>
      </UL>
    <LI>
      <A HREF="overview.html#TOC">Introduction</A>
    <LI>
      <A href="editexample.html">Tutorial</A>
    <LI class="menu">
      <A href="fontview.html">Windows</A>
      <UL>
	<LI>
	  <A href="fontview.html" >Font</A>
	<LI>
	  <A href="charview.html" >Outline Glyph</A>
	<LI>
	  <SMALL><A href="charview.html#Debugging" >&nbsp; &nbsp;Debugging
	  TrueType</A></SMALL>
	<LI>
	  <SMALL><A href="multilayer.html" >&nbsp; &nbsp;Type3 Glyphs</A></SMALL>
	<LI>
	  <A href="bitmapview.html" >Bitmap Glyph</A>
	<LI>
	  <A href="metricsview.html" >Metrics</A>
      </UL>
    <LI class="menu">
      <A href="fontinfo.html">Dialogs 1</A>
      <UL>
	<LI>
	  <A href="fontinfo.html" >Font Information</A>
	<LI>
	  <SMALL><A href="histogram.html" >&nbsp; &nbsp;Histogram Dialog</A></SMALL>
	<LI>
	  <A href="charinfo.html" >Glyph Information</A>
	<LI>
	  <A href="getinfo.html" >Point, Reference Information</A>
	<LI>
	  <A href="multilayer.html#Layer" >Type3 Layer Information</A>
	<LI>
	  <A href="bdfinfo.html" >Bitmap Properties</A>
	<LI>
	  <A href="baseline.html" >Baseline Information</A>
	<LI>
	  <A HREF="justify.html">Justification Information</A>
	<LI>
	  <A href="math.html" >Math Information</A>
	<LI>
	  <A href="multiplemaster.html" >Multiple Master Information</A>
	<LI>
	    <HR>
	<LI>
	  <A href="lookups.html" >Lookups &amp; subtables</A>
	<LI>
	  <A href="metricsview.html#kernpair" >Kerning glyph pairs 1</A>
	<LI>
	  <A href="kernpairs.html" >Kerning glyph pairs 2</A>
	<LI>
	  <A href="metricsview.html#kernclass" >Kerning by classes</A>
	<LI>
	  <A href="anchorcontrol.html" >Anchor Control</A>
	<LI>
	  <A href="contextchain.html" >Contextual lookup dialog</A>
	<LI>
	  <A href="statemachine.html" >Apple State Machine dialog</A>
	<LI>
	  <A href="showatt.html" >Show Advanced Typography</A>
	<LI>
	    <HR>
	<LI>
	  <A href="problems.html" >Potential Problems dialog</A>
	<LI>
	  <A href="validation.html" >Font Validation dialog</A>
      </UL>
    <LI class="menu">
      <A href="generate.html">Dialogs 2</A>
      <UL>
	<LI>
	  <A href="filemenu.html#Open" >Open Fonts dialog</A>
	<LI>
	  <A href="oflib.html" >Browsing OFLib dialog</A>
	<LI>
	  <A href="generate.html" >Generate Fonts dialog</A>
	<LI>
	  <A href="generate.html#Mac" >Generate Mac Family dialog</A>
	<LI>
	    <HR>
	<LI>
	  <A href="display.html" >Print &amp; Display dialog</A>
	<LI>
	  <A href="prefs.html" >Preferences dialog</A>
	<LI>
	  <A href="groups.html" >Groups dialog</A>
	<LI>
	    <HR>
	<LI>
	  <A href="elementmenu.html#Bitmaps">Manage Bitmap Strikes</A>
	<LI>
	  <A href="elementmenu.html#Regenerate">Re-Rasterize Bitmap Strikes</A>
	<LI>
	    <HR>
	<LI>
	  <A href="search.html" >Search &amp; Replace dialog</A>
	<LI>
	  <A href="Styles.html" >Style Transformation dialogs</A>
	<LI>
	  <A href="transform.html" >Transformation dialog</A>
	<LI>
	  <A href="elementmenu.html#Expand" >Expand Stroke dialog</A>
	<LI>
	  <A href="tilepath.html" >Tile Path dialog</A>
	<LI>
	  <A href="InsertTextDlg.html" >Insert Text dialog</A>
	<LI>
	    <HR>
	<LI>
	  <A href="metricsmenu.html#Width">Set width dialogs</A>
	<LI>
	  <A href="metricsmenu.html#Width">Set left/right bearings</A>
	<LI>
	  <A href="autowidth.html" >Auto Width &amp; Kern dialogs</A>
	<LI>
	    <HR>
	<LI>
	  <A href="hintsmenu.html#Review" >Review PS Hints dialog</A>
	<LI>
	  <A href="ttfinstrs.html" >TrueType Instruction Editor</A>
	<LI>
	  <A href="ttfinstrs.html#cvt" >TrueType 'cvt ' Editor</A>
	<LI>
	    <HR>
	<LI>
	  <A href="selectbyatt.html" >Select by feature dialog</A>
	<LI>
	  <A href="elementmenu.html#MassRename" >Rename Glyphs dialog</A>
	<LI>
	  <A href="elementmenu.html#CompareFonts" >Compare Fonts dialog</A>
      </UL>
    <LI class="menu">
      <A href="filemenu.html">Menus</A>
      <UL>
	<LI>
	  <A href="filemenu.html" >File</A>
	<LI>
	  <A href="editmenu.html" >Edit</A>
	<LI>
	  <A href="pointmenu.html" >Point</A>
	<LI>
	  <A href="elementmenu.html">Element</A>
	<LI>
	  <A href="toolsmenu.html">Tools</A>
	<LI>
	  <A href="hintsmenu.html" >Hints</A>
	<LI>
	  <A href="encodingmenu.html" >Encoding</A>
	<LI>
	  <A href="viewmenu.html" >View</A>
	<LI>
	  <A href="metricsmenu.html" >Metrics</A>
	<LI>
	  <A href="cidmenu.html" >CID</A>
	<LI>
	  <A href="mmmenu.html" >Multi Master</A>
	<LI>
	  <A href="windowmenu.html" >Window</A>
	<LI>
	  <A href="helpmenu.html" >Help</A>
      </UL>
    <LI>
      <A href="faqFS.html">FAQ</A>
    <LI>
      <A href="IndexFS.html">Index</A>
    <LI>
      <A href="GlossaryFS.html">Glossary</A>
  </UL>
</DIV>
<DIV id="in">
  <H1 ALIGN=Center>
    Outline Glyph View
  </H1>
  <P>
  <IMG SRC="charview2.png" WIDTH="544" HEIGHT="656">
  <P>
  The outline glyph view is the window in which most editing happens.
  <P>
  At the top of the window, underneath the menu bar is an information line.
  The first item is the location of the mouse pointer (in the internal coordinate
  system of the glyph). If there is a single selected point then the next item
  gives its location, and the next three are, respectively, the offsets from
  the selected point to the current location, the distance from the selected
  point, and the angle from the horizontal (measured counter-clockwise). Then
  we have the current scale factor, and the layer which is active. Finally
  (in the debugging view) is an indication of whether the instruction pointer
  is in the glyph program, the 'prep' program of the 'fpgm'.
  <P>
  Underneath the information is a ruler showing the current pointer location
  as a red line. There's a similar ruler on the left side.
  <P>
  Underneath that is the glyph itself. On the left edge of the screen is a
  grey line indicating the x=0 line, further right is a black line showing
  where the glyph's width is currently set. There are also grey lines showing
  the ascent, descent and baseline.
  <P>
  Background images and background splines are drawn in grey. Grid lines are
  also drawn in grey. Vertical hinting regions are drawn in light blue, Horizontal
  hints are drawn in light green. If any hints overlap the boundaries are drawn
  in cyan.
  <P>
  The points of the glyph are of three types, corner points drawn as filled
  squares, curve points drawn as filled circles and tangent points drawn as
  filled triangles. If a point is selected then it will be drawn as an outlined
  square, circle or triangle and its control points are drawn as little magenta
  or dull-cyan xs at the end of a similarly colored line. (in a curved point
  the control points will be collinear). (the "Next" control point will be
  drawn dull cyan, and the Prev point will be magenta).
  <P>
  <IMG SRC="charview-quadratic.png" WIDTH="344" HEIGHT="392" ALT="A quadratic glyph"
      ALIGN="Right">In a TrueType font, an on-curve point can be implied between
  two control points. FontForge will draw these with an open circle.
  <P>
  The initial point in a contour will be drawn in green, and beside it will
  be a tiny arrow pointing in the direction of the contour.
  <P>
  <IMG SRC="extrema-poi.png" WIDTH="204" HEIGHT="274" ALT="Showing extrema"
      ALIGN="Left">Sometimes it is important to know which points are at the extrema
  of splines (postscript likes for there to be points at the extrema of all
  splines), if this is important to you set the "Mark Extrema" flag in the
  View menu. After that points at extrema will show up as dull purple. And
  internal extrema will also be marked.
  <P>
  There are also two palettes, one, a layer palette, allowing you to control
  <A HREF="#Layers">which layers are visible</A>, and one, a tool palette,
  from which you <A HREF="#Tools">may pick editing tools</A>. Normally these
  are free floating windows, but you may choose to dock them in the window
  with View-&gt;Palettes-&gt;Dock Palettes.
  <P>
  You select an editing tool by clicking on the appropriate button on the tools
  palette, or you may depress the right mouse button and select a tool from
  a popup menu (you may also change layers and do a few other things with this
  menu). There are four different tools bindings available to you (this may
  be a complication with no utility). The left mouse button has a tool bound
  to it, and this tool will be displayed when the program is idle. If you hold
  down the control key, another tool is available, by default this is a pointer
  but if you click on the tools palette with the control key down you can select
  something else. If you depress the middle mouse button you get a third tool
  (by default a magnifying glass), and the control key and middle button give
  you the fourth (a ruler).
  <P>
  If the mouse pointer is close to a point (within a few pixels) when you depress
  the mouse, then the effective location of the press will be the location
  of the point.
  <P>
  If you drag a glyph from the font view and drop it into a glyph view then
  FontForge will drop a reference to the dragged glyph into the view.
  <P>
  Warning: <FONT COLOR="Red"><STRONG>If your glyph has truetype instructions
  then editing it may cause those instructions to behave very oddly. If your
  glyph has anchor points which depend on truetype point matching then editing
  the glyph may disconnect the points. If your glyph is used as a reference
  in another glyph that positions references by point matching then editing
  this glyph may reposition those references.</STRONG></FONT>
  <H2>
    <A NAME="Layers">Layers</A>
  </H2>
  <P>
  <IMG SRC="layers.png" WIDTH="135" HEIGHT="108" ALIGN="Left"> There are several
  layers in the outline view, three of which are editable. Each layer has a
  check box (indicating whether it is visible or not) and the editable layers
  also have a radio button (indicating whether it is curently editable).
  <P>
  The first layer is a set of guide lines/splines. These are common to all
  glyphs in the font. A few lines are provided for you (the x=0 line, the ascent,
  descent and baseline). Other handy lines might be the x-height of the font,
  the cap-height, ascender-height, descender-height, ... When you are working
  in any of the other layers, points will snap to splines in this layer (making
  it easy to force a consistent x-height for example).
  <P>
  Next are the background layers, these contain background images and splines.
  These do not go into the font, but may be helpful to you in tracing the outline
  of your glyph. It is possible to paste an image into the background if you
  have an image manipulation program that supports selection by mime type (the
  kde family of applications does this, perhaps others), then FontForge will
  be able to read images in either "image/png" or "image/bmp", otherwise you
  may import background image files.
  <P>
  When debugging truetype
  (<CODE><A HREF="hintsmenu.html#Debug">Hints-&gt;Debug</A>)</CODE>, or showing
  gritfit outlines (<A HREF="viewmenu.html#ShowGridFit"><CODE>View-&gt;Show
  Gridfit</CODE></A>) the visibility of the gridfit outlines can be controlled
  by the background layer's visibility.
  <P>
  The last is the foreground layer, this contains the splines that actually
  make up the glyph that will be placed into the font.
  <H2>
    <A NAME="Tools">Tools</A>
  </H2>
  <P>
  <IMG SRC="tools.png" WIDTH="116" HEIGHT="321" ALIGN="Left" ISMAP USEMAP="#im-tools"><MAP
      NAME="im-tools">
    <AREA SHAPE="RECT" HREF="#spiro-mode" COORDS="89,108,116,135">
    <AREA SHAPE="RECT" HREF="#spiro-add-point" COORDS="63,108,89,135">
    <AREA SHAPE="RECT" HREF="#spiro-add-point" COORDS="63,54,116,108">
    <AREA SHAPE="RECT" HREF="#spiro-mode" COORDS="27,109,54,135">
    <AREA SHAPE="RECT" HREF="#pen" COORDS="1,108,28,136">
    <AREA SHAPE="RECT" HREF="#rectangle" COORDS="0,244,54,272">
    <AREA SHAPE="RECT" HREF="#perspective" COORDS="27,216,54,243">
    <AREA SHAPE="RECT" HREF="#rotate3d" COORDS="0,216,27,243">
    <AREA SHAPE="RECT" HREF="#skew" COORDS="27,189,55,217">
    <AREA SHAPE="RECT" HREF="#rotate" COORDS="0,189,27,216">
    <AREA SHAPE="RECT" HREF="#flip" COORDS="27,162,54,189">
    <AREA SHAPE="RECT" HREF="#scale" COORDS="0,163,27,190">
    <AREA SHAPE="RECT" HREF="#ruler" COORDS="27,135,54,161">
    <AREA SHAPE="RECT" HREF="#knife" COORDS="-1,135,27,162">
    <AREA SHAPE="RECT" HREF="#add-point" COORDS="27,80,54,108">
    <AREA SHAPE="RECT" HREF="#add-point" COORDS="1,82,27,109">
    <AREA SHAPE="RECT" HREF="#add-point" COORDS="1,53,54,80">
    <AREA SHAPE="RECT" HREF="#scroll" COORDS="27,27,53,53">
    <AREA SHAPE="RECT" HREF="#freehand" COORDS="1,27,26,54">
    <AREA SHAPE="RECT" HREF="#magnify" COORDS="28,0,53,27">
    <AREA SHAPE="RECT" HREF="#pointer" COORDS="1,0,28,28">
  </MAP>
  There are 19 different editing tools, a mode button which alters the behavior
  of 5 of them, and two others (rectangle/ellipse and polygon/star) which come
  in two forms.
  <P>
  At the bottom of the palette is a list of the current bindings of the mouse
  buttons. Here mouse button 1 is bound to the pointer tool, mouse button 1
  with the control key pressed is also bound to pointer, mouse button 2 is
  bound to magnify, and mouse button 2 with control is bound to ruler.
  <P>
  Many of the tools have different <A NAME="alt-meta-capslock">behaviors</A>
  if you hold the shift or alt (meta) key down when using the tool. On the
  mac there is no alt/meta key, and the Option and Command keys are usually
  bound to making a one button mouse look like a three button mouse. So on
  the mac fontforge uses the caps-lock key rather than alt/meta.
  <H3>
    <IMG SRC="cvarrowicon.png" ALIGN="Middle">The <A NAME="pointer">pointer</A>
    tool
  </H3>
  <P>
  This tool is used for selecting points, images and referenced glyphs. It
  can also move these and scale images and referenced glyphs.
  <P>
  Only things that are in the layer that is currently editable may be selected
  or moved or scaled.
  <P>
  A simple click on an unselected point selects it and deselects everything
  else. A shift click on a point toggles whether that point is selected or
  not. A double click selects all points on the path containing that point.
  A tripple click selects everything in the layer. Clicking on the background
  will deselect everything. Clicking on the background and dragging out a rectangle
  will select everything within the rectangle. Clicking on a line or spline
  will select the two end points of that line or spline. Clicking on the dark
  part of an image (when in a layer with images) will select the image. Clicking
  on the outline of a referenced glyph will select that reference (if a reference
  glyph happens to have the same outline and bounding box, then holding down
  the <A HREF="charview.html#alt-meta-capslock">meta/alt/caps-lock</A> key
  will allow you to move it once it is selected, without the meta key you will
  resize it).
  <P>
  If a point has no visible control points, then they are at the same location
  as the point itself. If you want to select one of the control points then
  first select the point (to make the control points active) then hold down
  the meta key (use caps-lock on the mac) and depress the mouse on the point.
  This should allow you to drag one of the control points (if you get the wrong
  point the first time drag it out of the way, repeat the process to get the
  other control and then put the first one back). Sadly some window managers
  (gnome-sawtooth for one) will steal meta-clicks. If this happens you will
  need to use Element-&gt;Get Info to set the control points.
  <P>
  <IMG SRC="cpinfo.png" WIDTH="296" HEIGHT="337" ALIGN="Right">When you move
  a <A NAME="CpInfo">control point</A> you have the option
  (<CODE><A HREF="viewmenu.html#CpInfo">View-&gt;Show Control Point
  Info</A></CODE>) of getting a popup box showing information about the control
  point (and its opposite number on the other side of the on-curve point).
  You will be told whether this is the next or previous control point, the
  absolute location of the point, the offset from the on-curve point, the slope
  expressed as a ratio, and as an angle, and the curvature on this side of
  the base point. At the very bottom is the difference between the two curvatures.
  Try to make this number approach 0 for curved points.
  <P>
  Once something is selected you may drag it around. If you select something
  and drag the mouse then it and everything else selected will be moved. If
  you drag an open path and one of the end points happens to fall on the end
  point of another open path, then the two will be merged into one (If you
  don't want open paths to merge, hold down the
  <A HREF="charview.html#alt-meta-capslock">Alt/meta/caps-lock</A> key). If
  you drag a control point then it will be moved (if you drag a control point
  defining an implied point, then the implied point(s) will also be moved).
  <P>
  If you selected a spline, then dragging it will drag the location on the
  spline where you pressed the mouse (so you are changing the shape of the
  spline).
  <P>
  If you hold the shift key down when you drag then the motion will be constrained
  to be either horizontal, vertical, or at a 45&#176; angle. (When moving control
  points the combination of shift and
  <A HREF="charview.html#alt-meta-capslock">meta (alt) </A>will mean that the
  control point is constrained to be the same angle from the base point as
  it was before you started moving it).
  <P>
  If your font has an ItalicAngle set, and the ItalicConstrain preference item
  is set, then motion that would normally be constrained to the vertical is
  constrained to be along the ItalicAngle.
  <P>
  If you move the mouse to the bounding box of a selected image or reference
  glyph and drag it then you will scale that object.
  <P>
  If you move the mouse to the <A NAME="set-width">advance width</A> line,
  then dragging it will change the width of the current glyph. If there are
  any bitmaps of this glyph then their widths will also be updated. If there
  are any other glyphs which depend on this glyph (ie. include this glyph as
  a reference) and their width was the same as the glyph's, then their widths
  will also be updated (so if you change the width of A, then the width of
  &Agrave;, &Aacute;, &Acirc;, &Atilde;, &Auml; and &Aring; might also be changed).
  If you are displaying vertical metrics (in a font that has them), then you
  can use the same technique to modify the vertical advance.
  <P>
  If you are in an accented glyph then you may not be able to change the width,
  as its width is bound to that of the base glyph (By setting the "Use My Metrics"
  bit in the reference containing the base glyph). This will be displayed as
  a lock icon at the top of the window near the width line.
  <P>
  It is also possible to use the arrow keys to move selected items around.
  Each arrow will move the selection one em-unit (this can be changed in
  preferences to be any number of em-units) in the obvious direction. The selection
  may include the width (right bearing) line (or vertical with line). If the
  last thing you selected was a control point then that point will be moved.
  If you hold down the shift key at the same time the up and down arrows will
  move parallel to the italic angle (be careful of this: this leads to non-integral
  values). If you hold down the <A HREF="charview.html#alt-meta-capslock">meta
  (alt)</A> key, then the motion will be 10 times the normal amount.
  <P>
  If you hold down the control key while working with the arrows then the view
  will be scrolled rather than moving the selection.
  <P>
  If the glyph is a ligature (and has a ligature entry in Glyph Info) then
  it has the potential of having "ligature caret locations". Essentially this
  means that between each ligature component it is possible to place a caret
  location (so that the word processor will place be able to place a caret
  between each component of the ligature). In a ligature window a series of
  vertical lines will be drawn across the screen at the caret locations. By
  default these lines will be placed at the origin, but you may move one by
  placing the mouse pointer on it, depressing the button and dragging the line
  around. See the description on <A HREF="editexample4.html#ligature">building
  a ligature </A>for a more complete description.
  <H3>
    <IMG SRC="cvmagicon.png" WIDTH="26" HEIGHT="26" ALIGN="Middle">The
    <A NAME="magnify">magnifying</A> tool
  </H3>
  <P>
  Clicking with the magnifying tool will magnify the view and center it around
  the point you clicked on. Holding down the
  <A HREF="charview.html#alt-meta-capslock">Alt/Meta/CapsLock </A>key and clicking
  will minify the view, again centered around the point at which you clicked.
  Again some window managers will steal meta-clicks, so you may have to use
  the View menu to minify (It's called Zoom Out
  <P>
  If you drag out a rectangle with this tool then when you release, FontForge
  will shift and scale the view so that your rectangle just fits into the window.
  <P>
  If your mouse has a scroll wheel then holding down the control key with the
  scroll wheel causes it to magnify or minify the window.
  <H3>
    <IMG SRC="cvhandicon.png" WIDTH="26" HEIGHT="26" ALIGN="Middle">The
    <A NAME="scroll">scroll</A> tool
  </H3>
  <P>
  You can use this tool to scroll the window without using the scroll bars.
  <H3>
    <IMG SRC="cvfreehandicon.png" WIDTH="26" HEIGHT="26" ALIGN="Middle"><IMG
	SRC="freehandctl.png" ALIGN="Right" WIDTH="313" HEIGHT="684">The
    <A NAME="freehand">freehand</A> tool
  </H3>
  <P>
  You can use this tool to draw a random curve which FontForge will then attempt
  to convert into a set of splines. If you hold down the
  <A HREF="charview.html#alt-meta-capslock">Alt/Meta/CapsLock</A> key then
  FontForge will close the curve when you release the mouse.
  <P>
  If you double click on the icon in the tool palette you get a dialog similar
  to the <A HREF="elementmenu.html#Expand">Element-&gt;Expand Stroke</A> which
  will give you slightly more control over the results, as you can have it
  not expand the stroke you draw (ie. leave a single trace.)<BR CLEAR=ALL>
  <H3>
    <IMG SRC="cvcurveicon.png" WIDTH="26" HEIGHT="26" ALIGN="Middle">
    <IMG SRC="cvhvcurveicon.png" WIDTH="25" HEIGHT="26" ALIGN="Middle"><IMG SRC="cvcornericon.png"
	WIDTH="26" HEIGHT="26" ALIGN="Middle">
    <IMG SRC="cvtangenticon.png" WIDTH="26" HEIGHT="26" ALIGN="Middle">Tools
    for <A NAME="add-point">adding</A> curved, corner and tangent points.
  </H3>
  <P>
  These four tools behave similarly, differing only in what kind of point is
  added to the view.
  <P>
  If a single point is selected, and if that point is at the end of a path
  then depressing the mouse button will create a new point where the mouse
  was depressed and draw a spline from the selected point to new point. If
  this new location happens to be the end of a path then the two paths will
  be joined (or if it is the end of the current path then the path will be
  closed).
  <P>
  Otherwise if the mouse is depressed while being on a spline then a point
  will be added to that spline.
  <P>
  Otherwise a new point is created not on any path at the location of the press.
  <P>
  Once the point has been created then it becomes selected and all others are
  deselected. You may drag the point around, and if the point is on an open
  path and you drag it to the end point of another open path then the two paths
  will be joined.
  <P>
  If you double click then a point will be added as above and a
  <A HREF="getinfo.html">Point Info</A> dlg will appear to give you fine control
  over the location of the point and its control points.
  <P>
  The four different point types are
  <UL>
    <LI>
      curved points (where the incoming and outgoing splines have the same slope)
    <LI>
      horizontal/vertical curved points (similar to the above except the slope
      is constrained to be either horizontal or vertical)
    <LI>
      corner points (where the incoming and outgoing splines may have different
      slopes)
    <LI>
      tangent points (where one spline is a line segment and the other spline is
      curved then the curved spline is constrained to start with the same slope
      as the line).
  </UL>
  <H3>
    <IMG SRC="cvpenicon.png" WIDTH="26" HEIGHT="26" ALIGN="Middle">The
    <A NAME="pen">pen</A> tool
  </H3>
  <P>
  This tool behaves differently in cubic and quadratic editing. In many ways
  it is similar to the tools above as it adds a point to the current spline.
  <P>
  In a cubic font the points created are curved points, and they are initially
  created with the control points on the point and as you drag you drag out
  the control points rather than moving the point itself around.
  <P>
  In a quadratic font a point will be created half-way between the last control
  point and the current location (which becomes the next control point).
  <P>
  If you hold down the Alt (Meta, etc) key you change the behavior so that
  cubic editing looks like quadratic and vice versa.
  <H3>
    <IMG SRC="cvspiroG4icon.png" WIDTH="26" HEIGHT="26" ALIGN="Middle">
    <IMG SRC="cvspiroG2icon.png" WIDTH="26" HEIGHT="26" ALIGN="Middle">
    <IMG SRC="cvspirocornericon.png" WIDTH="26" HEIGHT="26" ALIGN="Middle">
    <IMG SRC="cvspirolefticon.png" WIDTH="26" HEIGHT="26" ALIGN="Middle">
    <IMG SRC="cvspirorighticon.png" WIDTH="26" HEIGHT="26" ALIGN="Middle"> Tools
    for <A NAME="spiro-add-points">adding</A> spiro control points
  </H3>
  <P>
  These tools add spiro control points to the current contour, these are only
  available in spiro mode, but the basic adding process is similar to the above.
  <P>
  The different point types are:
  <UL>
    <LI>
      G4 (continuous up to the fourth derivative)
    <LI>
      G2 (continuous up to the second derivative)<BR>
      Basically, if you have a sharp curve you should probably use a G2 point,
      and if a more gentle curve a G4.
    <LI>
      corner
    <LI>
      prev constraint point -- vaguely like a tangent (Raph calls this a "left"
      point)<BR>
      This type of point should be used where the contour changes from a curve
      to a straight line (where the curve is on the previous side of the constraint
      point)
    <LI>
      next constraint point -- vaguely like a tangent (Raph calls this a "right"
      point)<BR>
      This type of point should be used where the contour changes from a straight
      line to a curve (where the curve is on the next side of the constraint point)
  </UL>
  <P>
  This is based on <A HREF="http://www.levien.com/spiro/">Raph Levien's work</A>
  with clothoid splines which provide constant curvature across points.
  <H3>
    <IMG SRC="cvspiromodeicon.png" WIDTH="25" HEIGHT="26" ALIGN="Middle"><A NAME="spiro-mode">Spiro
    mode</A>
  </H3>
  <P>
  This button toggles between editing contours using B&eacute;zier control
  points, or between using spiro (clothoid) control points.
  <H3>
    <IMG SRC="cvknifeicon.png" WIDTH="26" HEIGHT="26" ALIGN="Middle">The
    <A NAME="knife">knife</A> tool
  </H3>
  <P>
  This tool is used to cut splines. As you drag it across the view fontforge
  draws a line showing where the cut will happen. When you release, every spline
  you intersect will be cut-- that is at the location where this line intersects
  the spline two new points will be created and the old spline will be split
  in two connecting to the two new end points. These endpoints are not joined,
  so the spline is now open (or if it were previously open, it is now cut in
  two).
  <H3>
    <IMG SRC="cvrulericon.png" WIDTH="26" HEIGHT="26" ALIGN="Middle">The
    <A NAME="ruler">ruler</A> tool
  </H3>
  <P>
  <IMG SRC="ruler.png" WIDTH="234" HEIGHT="102" ALIGN="Right">This tool tells
  you current position of the mouse. If the mouse is near the outline it will
  give the slope and curvature there. If the mouse is near a point on the outline
  will give the slope and curvature on each side of the point.
  <P>
  If you depress the button and drag, the tool will show the x-y offsets, distance
  and angle from the point where you depressed the mouse to the mouse's current
  location. If you depress the tool at one end point of a spline and move it
  to the other endpoint then it will also show the length of that spline.
  <P>
  If you hold down the
  <A HREF="charview.html#alt-meta-capslock">Meta/Alt/CapsLock </A>key then
  information will only be shown when the mouse is depressed.
  <H3>
    <IMG SRC="cvscaleicon.png" WIDTH="26" HEIGHT="26" ALIGN="Middle">The
    <A NAME="scale">scale</A> tool
  </H3>
  <P>
  This tool allows you to scale the selection by eye rather than by a set amount
  (if there is no selection then everything in the current layer will be scaled).
  The location of the press will be the origin of the transformation, the further
  you move the point up and to the right the more it will be scaled in that
  dimension. If you want the scaling to be uniform or only in one dimension
  then hold down the shift key.
  <P>
  Double clicking on this will bring up the transform dialog with the "Scale..."
  option selected.
  <H3>
    <IMG SRC="cvflipicon.png" WIDTH="26" HEIGHT="26" ALIGN="Middle">The
    <A NAME="flip">flip</A> tool
  </H3>
  <P>
  This tool allows you to flip the selection either horizontally or vertically.
  Again the point at which you press the mouse is the origin of the transformation.
  <P>
  Double clicking on this will bring up the transform dialog with the "Flip..."
  option selected.
  <P>
  <FONT COLOR="Red"> <STRONG>Note: After flipping an outline you will almost
  certainly want to apply
  <A HREF="elementmenu.html#Correct">Element-&gt;Correct
  Direction</A>.</STRONG></FONT>
  <H3>
    <IMG SRC="cvrotateicon.png" WIDTH="26" HEIGHT="26" ALIGN="Middle">The
    <A NAME="rotate">rotate</A> tool
  </H3>
  <P>
  This tools allows you to rotate the selection freely.
  <P>
  Double clicking on this will bring up the transform dialog with the "Rotate..."
  option selected.
  <H3>
    <IMG SRC="cvskewicon.png" WIDTH="26" HEIGHT="26" ALIGN="Middle">The
    <A NAME="skew">skew</A> tool
  </H3>
  <P>
  This tool allows you to skew the selection.
  <P>
  Double clicking on this will bring up the transform dialog with the "Skew..."
  option selected.
  <H3>
    <IMG SRC="cvrotate3dicon.png" WIDTH="26" HEIGHT="26" ALIGN="Middle">The
    <A NAME="rotate3d">rotate</A> 3D tool
  </H3>
  <P>
  This tool allows you to rotate the selection in the third dimension and project
  the result back onto the x-y plane. An imaginary line is drawn from the point
  where you pressed to the current point, this line determines the axis of
  rotation. The distance you move from the initial press determines the amount
  of rotation.
  <P>
  Double clicking on this will bring up the transform dialog with the "Rotate
  3D..." option selected.
  <H3>
    <IMG SRC="Eperspective.png" WIDTH="154" HEIGHT="361" ALIGN="Right"><IMG SRC="cvperspectiveicon.png"
	WIDTH="26" HEIGHT="26" ALIGN="Middle">The
    <A NAME="perspective">perspective</A> tool
  </H3>
  <P>
  This tool allows you to apply a perspective transformation to the selection
  (this is a non-linear transformation). This tool uses three points: The glyph
  origin, the press point, and the current location of the cursor. In the image
  at right the mouse was pressed on the baseline near the glyph's advance width,
  and the mouse was released in the upper middle of the image. The glyph is
  transformed so that the release point is treated as the point at infinity.
  The line between the origin and the press point defines one axis of the
  transformation. Distances perpendicular to this line are retained, distances
  parallel to it are scaled as:
  <BLOCKQUOTE>
    <I>x' = release_x + (release_y - y)/release_y * ( x - release_x )</I><BR>
    <I>y' = y</I><BR CLEAR=ALL>
  </BLOCKQUOTE>
  <H3>
    <IMG SRC="cvrecticon.png" WIDTH="26" HEIGHT="26" ALIGN="Middle">
    <IMG SRC="cvellipseicon.png" WIDTH="26" HEIGHT="26" ALIGN="Middle">The
    <A NAME="rectangle">rectangle</A>/ellipse tools
  </H3>
  <P>
  By default this produces a rectangle, single-clicking on the tool palette
  will toggle between rectangle and ellipse, and double clicking in the tools
  palette gives you a dialog which allows you to control whether your rectangles
  are drawn with round corners, and how both rectangles and ellipses are specified.
  <P>
  You can choose whether the rectangle (or ellipse) will be drawn between the
  point where you depressed the mouse on the view and the point where you released
  it (bounding box), or whether the point where you depress the mouse becomes
  the center of the rectangle and the point where you release it provides an
  end-point (center out).
  <P>
  If you want even more control, you can double click in the glyph view and
  get another dialog which allows you to define numerically where the
  rectangle/ellipse should be placed, how big it should be, and whether it
  should be rotated.
  <H3>
    <IMG SRC="cvpolyicon.png" WIDTH="26" HEIGHT="26" ALIGN="Middle">
    <IMG SRC="cvstaricon.png" WIDTH="26" HEIGHT="26" ALIGN="Middle">The polygon/star
    tools
  </H3>
  <P>
  By default this draws a regular polygon, but by double clicking on the button
  in the tools palette you can make it draw a star, or select the number of
  verteces in your polygon.
  <P>
  The polygon is drawn as though it were inscribed in the circle whose center
  is the point where you depressed the mouse and whose radius is the distance
  between the press point and the release point. One of the polygon's verteces
  will be at the release point.
  <P>
  A star is drawn similarly. It will be a star generated from a regular polygon.
  As the number of verteces of the polygon gets larger the star will look more
  and more like a circle, for this reason the dialog box that allows you to
  pick the number of verteces will also allow you to pick how far the star's
  points should extend beyond the circle in which the polygon is inscribed
  (this will make a non-regular star, but it might look nicer).
  <H2>
    <A NAME="Vertical">Vertical View</A>
  </H2>
  <P>
  <IMG SRC="charview-vert.png" WIDTH="544" HEIGHT="563" ALIGN="Right"> In this
  view the vertical metrics of the glyph are shown. You can change the vertical
  advance just as you changed the glyph's width (by selecting the pointer tool
  and dragging the vertical advance line up or down).<BR Clear=Right>
  <H2>
    <A NAME="GridFit">Grid Fit View</A>
  </H2>
  <P>
  <IMG SRC="GridFit.png" WIDTH="327" HEIGHT="368" ALIGN="Right">If you have
  the freetype library, then you can see the results of rasterizing your glyph.
  If you have freetype's bytecode interpreter enabled you can also see how
  the truetype instructions in the glyph have moved the points around (if you
  don't have the bytecode interpreter enabled you will see what freetype's
  autohinter does to points). This mode can be invoked with
  <CODE><A HREF="viewmenu.html#ShowGridFit">View-&gt;Show Grid
  Fit</A></CODE>...
  <P>
  The Show Grid Fit command will ask you for some basic information first.
  It needs to know the pointsize and resolution for which you want the action
  performed (the example at right is 12pt on a 72dpi screen).<BR>
  <IMG SRC="ShowGridFit.png" WIDTH="268" HEIGHT="148"><BR CLEAR=ALL>
  <H2>
    <IMG SRC="cvdebug.png" WIDTH="544" HEIGHT="563" ALIGN="Right">The
    <A NAME="Debugging">Debugging</A> View
  </H2>
  <BLOCKQUOTE ID="lit">
    "I told you butter wouldn't suit the works!" he added, looking angrily at
    the March Hare.
    <P>
    "It was the <EM>best</EM> butter," the March Hare meekly replied.
    <P align=right>
    Alice's Adventures in Wonderland<BR>
    Lewis Carroll
  </BLOCKQUOTE>
  <P>
  FontForge has a truetype debugger -- provided you have a version of freetype
  on your machine with the bytecode interpreter enabled
  <FONT COLOR="Red"><STRONG>(Note: you need a license from Apple to enable
  this. It is protected by several patents)</STRONG></FONT>.
  <P>
  The image to the right shows an example of this mode. You invoke it with
  <CODE><A HREF="hintsmenu.html#Debug">Hints-&gt;Debug</A></CODE>, and as with
  the grid-fit view above you must establish a pointsize and and resolution.
  The view divides into two panes, the left of which is similar to the grid
  fit view above (except that it changes as you step through the instructions),
  the right pane provides a list of the instructions to be executed.
  <P>
  In addition to showing you all the points in your glyph there are either
  2 or 4 additional points. These are the so-called "phantom" points and represent
  the horizontal and vertical metrics of the glyph (old versions of freetype
  will only display 2 points -- left side bearing and advance width, while
  newer versions will display top side bearing and advance height as well).
  <P>
  As you step through a glyph occasionally points will light up. This is
  FontForge's attempt to show you what points will be affected (usually moved)
  by the current instruction. Other points will have a circle drawn around
  them. These are used as reference points by the instruction.
  <P>
  There are a series of buttons at the top of the instruction view. The first
  will single step the truetype program (step into), the second will step over
  procedure calls, the third will set a break point at the return point for
  the current function and continue until that is hit, and the fourth will
  continue until:
  <UL>
    <LI>
      It hits a break point
    <LI>
      It hits a watch point
    <LI>
      It reaches the end of the glyph program
    <LI>
      An error occurs
  </UL>
  <P>
  The red "STOPPED" arrow shows the current location of the instruction pointer
  (and what instruction will be executed next).
  <P>
  The fifth button allows you to set a watch point. You select a point (or
  several points) in the left hand pane, and press this button. Thereafter,
  whenever one of those points is moved FontForge will stop the glyph program.
  (You may also set watch points through the points window).
  <P>
  When you are in this mode there are a few special "hot keys"
  <BLOCKQUOTE>
    <TABLE>
      <TR>
	<TD>r</TD>
	<TD>run/restart</TD>
      </TR>
      <TR>
	<TD>k</TD>
	<TD>kill/quit debugger</TD>
      </TR>
      <TR>
	<TD>q</TD>
	<TD>kill/quit debugger</TD>
      </TR>
      <TR>
	<TD>c</TD>
	<TD>continue</TD>
      </TR>
      <TR>
	<TD>s</TD>
	<TD>step (into)</TD>
      </TR>
      <TR>
	<TD>n</TD>
	<TD>next (step over)</TD>
      </TR>
      <TR>
	<TD>f</TD>
	<TD>finish function (continue until we return from the function)</TD>
      </TR>
    </TABLE>
  </BLOCKQUOTE>
  <P>
  Similarly you may watch storage and cvt locations by clicking on the appropriate
  spot in the storage and cvt windows.
  <P>
  You can set a more conventional break point by clicking on an instruction.
  A little red stop sign will appear on top of the address area, and the program
  will halt when the instruction pointer reaches that instruction. Clicking
  on the instruction again will remove the breakpoint.
  <P>
  Flaw: Currently there is no way to set breakpoints outside of the current
  function (or glyph).
  <P>
  Flaw: Currently there is no way to examine the call stack.
  <P>
  The sixth button brings up a menu with which you can control which of various
  debugging palettes are visible. The ones available so far are: Registers,
  Stack, Points, Storage, Cvt, Raster and Gloss.
  <TABLE BORDER CELLPADDING="2">
    <TR VALIGN="Top">
      <TD><IMG SRC="TTRegisters.png" WIDTH="137" HEIGHT="292"></TD>
      <TD><IMG SRC="TTStack.png" WIDTH="137" HEIGHT="292"></TD>
      <TD><IMG SRC="TTPoints.png" WIDTH="220" HEIGHT="300"></TD>
    </TR>
    <TR VALIGN="Top">
      <TD>Shows the truetype graphics state.</TD>
      <TD>Shows the truetype stack. The value in parentheses is a 26.6 number.</TD>
      <TD>Shows the points. You may choose to view the twilight points, or the
	points displayed in the glyph pane (the normal points). You may view the
	current location or the original location. You may view them in the units
	of the current grid, or in em-units.
	<P>
	When debugging a composite glyph the Transformed check box indicates whether
	the points of the current component have been transformed (to show where
	they fit in the composite) or not (showing where they are in the base component
	-- this is what the instructions are working on).
	<P>
	The points may have some flags associated with them: 'P' means the point
	is an on curve point, 'C' means the point is an off curve point (a control
	point), 'I' means the point is an on-curve point interpolated between two
	control points, 'F' means a phantom point, 'T' means a twilight point, 'H'
	means the horizontal touch flag has been set, 'V' means the vertical touch
	flag has been set.
	<P>
	A small stop sign indicates the point is being watched (that is execution
	will stop if the point moves). You may change whether a point is watched
	by clicking on it.
	<P>
	Contours are separated by horizontal lines</TD>
    </TR>
    <TR VALIGN="Top">
      <TD><IMG SRC="TTStorage.png" WIDTH="187" HEIGHT="131"></TD>
      <TD><IMG SRC="TTCvt.png" WIDTH="198" HEIGHT="200"></TD>
      <TD><IMG SRC="TTRaster.png" WIDTH="54" HEIGHT="81"></TD>
    </TR>
    <TR VALIGN="Top">
      <TD>Shows the truetype storage locations.
	<P>
	A small stop sign indicates the storage location is being watched (that is
	execution will stop if the location changes). You may change whether a location
	is watched by clicking on it.</TD>
      <TD>Shows the current values in the cvt array.
	<P>
	A small stop sign indicates the cvt location is being watched (that is execution
	will stop if the value changes). You may change whether a location is watched
	by clicking on it.</TD>
      <TD>Shows the current raster with no magnificaton</TD>
    </TR>
  </TABLE>
  <P>
  <TABLE BORDER CELLPADDING="2" WIDTH="340">
    <TR>
      <TD><P ALIGN=Center>
	<IMG SRC="TTgloss.png" WIDTH="320" HEIGHT="305"></TD>
    </TR>
    <TR>
      <TD>This window tries to provide a gloss for the current instruction. It
	gives a brief description of the instruction in the top few lines, then explains
	what registers it uses, and shows their values, it shows what use is made
	of the stack and attempts to interpret the data on the stack. Finally it
	explains what registers will be set, and what will be pushed onto the stack.</TD>
    </TR>
  </TABLE>
  <P>
  The final button will exit the debugger.
  <P>
  The debugger also responds to some single character commands common to many
  debuggers:
  <TABLE BORDER CELLPADDING="2">
    <TR>
      <TD>s</TD>
      <TD>step into</TD>
    </TR>
    <TR>
      <TD>n</TD>
      <TD>step over (next)</TD>
    </TR>
    <TR>
      <TD>c</TD>
      <TD>continue</TD>
    </TR>
    <TR>
      <TD>r</TD>
      <TD>restart (with same grid)</TD>
    </TR>
    <TR>
      <TD>f</TD>
      <TD>step out (finish routine)</TD>
    </TR>
    <TR>
      <TD>k</TD>
      <TD>kill the debugger</TD>
    </TR>
    <TR>
      <TD>q</TD>
      <TD>kill the debugger</TD>
    </TR>
  </TABLE>
  <P>
  The Hints-&gt;Debug menu command can also be used to exit the debugger (by
  turning off the debug check box), or to restart the debugger with different
  values for the point size and resolution. This dlg can also control whether
  the fpgm and prep tables are debugged. Usually debugging will start when
  execution reaches the instructions associated with this glyph.
  <H3>
    Debugging composite glyphs
  </H3>
  <P>
  FontForge is not as friendly when debugging composite glyphs as it should
  be -- this is influenced by the way truetype works. Suppose you want to debug
  the "Atilde" glyph.
  <P>
  First FontForge will load and grid fit the "A" glyph, points from the "tilde"
  will not be displayed and behavior will be exactly the same as if you were
  debugging a stand alone "A".
  <P>
  Then FontForge will load and grid fit the "tilde" glyph, and now points from
  the "A" glyph will not be visible. The point numbers on the "tilde" will
  be the same as they are in a stand-alone "tilde" (whereas in a true
  representation of "Atilde", the points numbering in the "tilde" component
  will be offset by the number of points in the "A" component). The "tilde"
  may appear oddly positioned, this is caused by rounding: the "tilde" will
  usually be translated, and this translation will usually be rounded to fit
  the pixel grid. The width line will show the width of the "tilde" and not
  of the "Atilde".
  <P>
  Finally FontForge will execute any instructions in the composite itself,
  now all sub-components will be displayed, and all points will be numbered
  as they should be.
  <P>
  Several words of caution:
  <UL>
    <LI>
      If a component, or the composite as a whole, has no instructions then FontForge
      will not debug that piece (there will be nothing to debug).
    <LI>
      FontForge does not translate references which do point matching properly
      until the entire glyph has been loaded.
  </UL>
  <TABLE ALIGN=RIGHT>
    <TR>
      <TD><IMG SRC="mmcharview.png" WIDTH="431" HEIGHT="435" ALT='Intermediate version of "A" showing two other styles in background'><BR>
	Intermediate version of "A" with two other styles in the background</TD>
    </TR>
  </TABLE>
  <H2>
    <A NAME="MM">Multiple Master View</A>
  </H2>
  <P>
  In a multiple master font the <A HREF="mmmenu.html#outline-char">MM</A> menu
  gives you control over which style of the font you are editing. It will also
  allow you to display any (or all) of the other styles in the background.
  Although the menu is called "MM" it applies equally to Apple's distortable
  fonts ("*var" fonts, like Skia).<BR CLEAR=ALL>
  <H2>
    <A NAME="multilayer">Multiple Layer Editing</A>
  </H2>
  <P>
  <IMG SRC="charview-multilayer.png" WIDTH="348" HEIGHT="571" ALIGN="Right">If
  you wish to <A HREF="multilayer.html">edit type3 fonts</A>, and you have
  configured FontForge correctly, the FontForge can display a glyph broken
  down into a series of strokes and fills and allow you to edit each one.
  <P>
  <P ALIGN=Center>
  -- <A HREF="fontview.html">Prev</A> -- <A HREF="overview.html">TOC</A> --
  <A HREF="bitmapview.html">Next</A> --
</DIV>
</BODY></HTML>