269 lines
12 KiB
HTML
269 lines
12 KiB
HTML
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
|
|
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>How to Understand Contours</title>
|
|
<link href="../default.css" type="text/css" rel="stylesheet" />
|
|
</head><body>
|
|
|
|
|
|
|
|
|
|
|
|
<script type="text/javascript" src="http://www.google-analytics.com/urchin.js"></script>
|
|
<script type="text/javascript">
|
|
_uacct = "UA-2044310-2";
|
|
urchinTracker();
|
|
</script>
|
|
|
|
<div id="modellogo">
|
|
<img src="../img/drawmodel_header.jpg" width="595" height="112" />
|
|
</div>
|
|
<div class="leftcontent">
|
|
<h1 class="crb-seealso">
|
|
RoboFab
|
|
</h1>
|
|
<p class="menu">
|
|
<a href="../index.html">
|
|
Home
|
|
</a>
|
|
<br />
|
|
<a href="../download/index.html">
|
|
Download v1.1.1
|
|
</a>
|
|
<br />
|
|
<a href="../intro.html">
|
|
Intro
|
|
</a>
|
|
<br />
|
|
<a href="../install.html">
|
|
Install Notes
|
|
</a>
|
|
<br />
|
|
<a href="../history.html">
|
|
History
|
|
</a>
|
|
<br />
|
|
<a href="../executive.html">
|
|
Summary
|
|
</a>
|
|
</p>
|
|
|
|
<p class="menu">
|
|
<a href="index.html">
|
|
How to's
|
|
</a>
|
|
<br />
|
|
<a href="../talks/index.html">
|
|
Step by step
|
|
</a>
|
|
<br />
|
|
<a href="../tools/dialogs.html">
|
|
Fab Dialogs
|
|
</a>
|
|
<br />
|
|
<a href="../objects/index.html">
|
|
Object reference
|
|
</a>
|
|
<br />
|
|
<a href="../objects/model.html">
|
|
Object map
|
|
</a>
|
|
<br />
|
|
<a href="../tools/index.html">
|
|
Tools
|
|
</a>
|
|
<br />
|
|
<a href="../ufo/index.html">
|
|
UFO Overview
|
|
</a>
|
|
<br />
|
|
<a href="../ufo/specification.html">
|
|
UFO Spec
|
|
</a>
|
|
<br />
|
|
<a href="../limitations.html">
|
|
Fab Limitations
|
|
</a>
|
|
|
|
<a href="../links/index.html">
|
|
Links
|
|
</a>
|
|
<br />
|
|
<a href="../credits.html">
|
|
Credits
|
|
</a>
|
|
</p>
|
|
|
|
<h1 class="crb-seealso">
|
|
Support RoboFab
|
|
</h1>
|
|
|
|
|
|
<form action="https://www.paypal.com/cgi-bin/webscr" method="post">
|
|
<input type="hidden" name="cmd" value="_s-xclick">
|
|
<input type="image" src="https://www.paypal.com/en_US/i/btn/x-click-but21.gif" border="0" name="submit" alt="Make payments with PayPal - it's fast, free and secure!">
|
|
<img alt="" border="0" src="https://www.paypal.com/en_US/i/scr/pixel.gif" width="1" height="1">
|
|
<input type="hidden" name="encrypted" value="-----BEGIN PKCS7-----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-----END PKCS7-----
|
|
">
|
|
</form>
|
|
|
|
|
|
|
|
<h2 class="crb-seealso">
|
|
Up
|
|
</h2>
|
|
|
|
<p class="menu">
|
|
<p class="bonbon_uplink"><a href="index.html">Back to How To</a></p>
|
|
</p>
|
|
|
|
<h2 class="crb-seealso">
|
|
See also
|
|
</h2>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<p class="menu">
|
|
<a href="../objects/anchor.html">RAnchor</a><br /><a href="../objects/bpoint.html">bPoint</a><br /><a href="../objects/component.html">RComponent</a><br /><a href="../objects/contour.html">RContour</a><br /><a href="../objects/point.html">RPoint</a><br /><a href="../objects/segment.html">RSegment</a><br /><a href="buildingaccents.html">Building accents</a><br /><a href="fontlabremote.html">FontLab Remote</a><br /><a href="generatefonts.html">Generate Fonts</a><br /><a href="index.html">How To</a><br /><a href="interpolate.html">How to interpolate</a><br /><a href="lowlevel.html">How to get to FontLab stuff</a><br /><a href="scripting.html">Scripting</a><br /><a href="usepens.html">Using Pens</a><br /><a href="usethelib.html">Using the lib</a><br /><a href="usetransformations.html">Using transformations</a><br /><a href="world.html">The world module</a><br />
|
|
</p>
|
|
</div>
|
|
|
|
<div class="footer">
|
|
<a href="../feedback.html">
|
|
Feedback
|
|
</a>
|
|
<br />
|
|
<a href="../map.html">
|
|
Sitemap
|
|
</a>
|
|
<br />
|
|
Please also refer to the
|
|
<a href="../download/license.html">
|
|
Legal
|
|
</a>
|
|
<br />
|
|
Copyright 2003-2006 RoboFab
|
|
<br />
|
|
version 1.1.1
|
|
</div>
|
|
|
|
<div class="google">
|
|
|
|
|
|
<h2>RoboFab Mailinglist</h2>
|
|
<p>
|
|
Join the RoboFab users community at Google groups.
|
|
</p>
|
|
|
|
|
|
<img src="http://groups.google.com/groups/img/3nb/groups_bar.gif" alt="Google Groups" height="26" width="132" />
|
|
|
|
<p>
|
|
<form action="http://groups.google.com/group/robofab/boxsubscribe">
|
|
Email: <input type="text" name="../email" />
|
|
<input type="submit" name="../sub" value="Subscribe" />
|
|
</form>
|
|
</p>
|
|
<p>
|
|
<a href="http://groups.google.com/group/robofab">Visit this group</a>
|
|
</p>
|
|
|
|
|
|
<h2>RoboFab Sponsors</h2>
|
|
|
|
<script type="text/javascript">
|
|
|
|
|
|
google_ad_client = "pub-3703953449723704";
|
|
google_ad_width = 120;
|
|
google_ad_height = 600;
|
|
google_ad_format = "120x600_as";
|
|
google_ad_type = "text_image";
|
|
google_ad_channel ="";
|
|
google_color_border = "336699";
|
|
google_color_bg = "FFFFFF";
|
|
google_color_link = "0000FF";
|
|
google_color_url = "008000";
|
|
google_color_text = "000000";
|
|
|
|
|
|
|
|
|
|
</script>
|
|
|
|
|
|
<script type="text/javascript" src="http://pagead2.googlesyndication.com/pagead/show_ads.js"></script>
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<div class="content">
|
|
<h1>Understanding Contours and Segments</h1>
|
|
<p>
|
|
Now, this is an important part of RoboFab so pay attention. In the world of digital font formats we have several different kinds of ways of describing outlines. Bezier curves for PostScript fonts, Quadratic curves for TrueType fonts. Each with their own peculiarities. RoboFab is format agnostic so it should be able to store all postscript and all truetype points. The structure here is meant to be able to do all that.
|
|
</p>
|
|
<p>
|
|
Diagrams by Tal Leming.
|
|
</p>
|
|
<h3>Contours</h3>
|
|
<p>
|
|
A glyph can contain one or more contours. Depending on what you want to do, there are different ways of looking at the data of the contour, the points, the line segments. The RContour object is way to the outlines. A description of the <a href="../objects/contour.html">RContour</a> object.
|
|
</p>
|
|
<br />
|
|
<img src="../objects/contours.jpg" alt="contour" width="300" height="300" />
|
|
<br />
|
|
|
|
<div class="pythonsource"><pre># take a glyph (one with outlines obviously)<br><span class="py_key">c</span> = <span class="py_key">CurrentGlyph</span>()<br># get to contours by index:<br><span class="py_res">print</span> <span class="py_key">c</span>[<span class="py_num">0</span>]</pre></div>
|
|
|
|
<div class="pythonoutput"><pre>< <span class="py_key">RContour</span> <span class="py_res">for</span> <span class="py_key">Mailer</span>-<span class="py_key">Regular</span>.<span class="py_key">a</span>[<span class="py_num">0</span>] ><br><span class="py_num">15</span><br># 15? 15 of what?</pre></div>
|
|
|
|
<h3>Segments</h3>
|
|
<p>
|
|
This circle consists of a couple of segments, each a piece of of the contour. A contour is a sequence of segments, you can iterate through a contour to get segments. A contour also has methods for adding and deleting segments.
|
|
<br />
|
|
<img src="../objects/contours_segments.jpg" alt="segments" width="300" height="300" />
|
|
<br />
|
|
</p>
|
|
|
|
<div class="pythonsource"><pre># segment code example</pre></div>
|
|
|
|
<p>
|
|
In turn, a segment is made up of a sequence of points. Any number of off-curve points followed by an on-curve point. For the PostScript-centric designers: in TrueType outlines it is allowed to have any number of off-curve points before an on-curve. These points know whether they need to be rendered as bezier of quadratic curves. A description of the <a href="../objects/segment.html">RSegment</a> object.
|
|
<br />
|
|
<img src="../objects/contours_segments_points.jpg" alt="segments" width="300" height="300" />
|
|
<br />
|
|
</p>
|
|
<h3>Points</h3>
|
|
<p>
|
|
Another way to look at a contour is as a sequence of on-curve and off-curve points. This is the approach taken by glyph.drawPoints() and PointPen. A description of the <a href="../objects/point.html">RPoint</a> object.
|
|
</p>
|
|
<br />
|
|
<img src="../objects/contours_points.jpg" alt="segments" width="300" height="300" />
|
|
<br />
|
|
|
|
<div class="pythonsource"><pre># get straight to the points in a contour through the points attribute<br><span class="py_key">g</span> = <span class="py_key">CurrentGlyph</span>()<br><span class="py_res">for</span> <span class="py_key">aPt</span> <span class="py_res">in</span> <span class="py_key">g</span>[<span class="py_num">0</span>].<span class="py_key">points</span>:</pre></div>
|
|
|
|
<div class="pythonoutput"><pre>< <span class="py_key">RPoint</span> <span class="py_res">for</span> <span class="py_key">Special</span>-<span class="py_key">Bold</span>.<span class="py_key">A</span>[<span class="py_num">0</span>][<span class="py_num">0</span>] ><br>< <span class="py_key">RPoint</span> <span class="py_res">for</span> <span class="py_key">Special</span>-<span class="py_key">Bold</span>[<span class="py_num">1</span>][<span class="py_num">1</span>] ><br> <span class="py_key">etc</span>..</pre></div>
|
|
|
|
<h3>bPoints</h3>
|
|
<p>
|
|
This is another way to look at contours and its parts: bPoints behave very much like RoboFog points used to do. A point object has an incoming bcp, an on-curve ("anchor point" fog called it) and an outgoing bcp. This approach has been added for folks more at ease with the RoboFog structure. Note: if the contour contains series of off-curve points, bPoints won't help you. A description of the <a href="../objects/bpoint.html">bPoint</a> object.
|
|
</p>
|
|
<br />
|
|
<img src="../objects/contours_bpoints.jpg" alt="segments" width="300" height="300" />
|
|
<br />
|
|
|
|
|
|
<div class="pythonsource"><pre># bpoints<br><span class="py_key">c</span> = <span class="py_key">CurrentGlyph</span>()<br><span class="py_res">for</span> <span class="py_key">aPt</span> <span class="py_res">in</span> <span class="py_key">c</span>[<span class="py_num">0</span>].<span class="py_key">bPoints</span>:<br> <span class="py_res">print</span> <span class="py_key">aPt</span>.<span class="py_key">anchor</span><br> <span class="py_res">print</span> <span class="py_key">aPt</span>.<span class="py_key">bcpIn</span><br> <span class="py_res">print</span> <span class="py_key">aPt</span>.<span class="py_key">bcpOut</span><br> <span class="py_res">print</span> <span class="py_key">aPt</span>.<span class="py_key">type</span></pre></div>
|
|
|
|
<div class="pythonoutput"><pre>...<br><span class="py_key">etc</span>..</pre></div>
|
|
|
|
</div>
|
|
</body></html> |