651 lines
34 KiB
Plaintext
651 lines
34 KiB
Plaintext
<!-- $XConsortium: ch13.sgm /main/9 1996/09/08 19:44:33 rws $ -->
|
|
<!-- (c) Copyright 1995 Digital Equipment Corporation. -->
|
|
<!-- (c) Copyright 1995 Hewlett-Packard Company. -->
|
|
<!-- (c) Copyright 1995 International Business Machines Corp. -->
|
|
<!-- (c) Copyright 1995 Sun Microsystems, Inc. -->
|
|
<!-- (c) Copyright 1995 Novell, Inc. -->
|
|
<!-- (c) Copyright 1995 FUJITSU LIMITED. -->
|
|
<!-- (c) Copyright 1995 Hitachi. -->
|
|
<chapter id="UG.IconE.div.1">
|
|
<title id="UG.IconE.mkr.1">Using Icon Editor</title>
|
|
<para>Icon Editor is a tool for creating both
|
|
bitmap and pixmap image files
|
|
for use as icons or backdrops.
|
|
</para>
|
|
<informaltable id="UG.IconE.itbl.1" frame="All">
|
|
<tgroup cols="1">
|
|
<colspec colname="1" colwidth="4.0 in">
|
|
<tbody>
|
|
<row rowsep="1">
|
|
<entry><para><!--Original XRef content: 'Basic Drawing Tasks272'--><xref role="JumpText"
|
|
linkend="UG.IconE.mkr.4"></para></entry></row>
|
|
<row rowsep="1">
|
|
<entry><para><!--Original XRef content: 'Saving Icon Files275'--><xref role="JumpText"
|
|
linkend="UG.IconE.mkr.8"></para></entry></row>
|
|
<row rowsep="1">
|
|
<entry><para><!--Original XRef content: 'Color Usage277'--><xref role="JumpText"
|
|
linkend="UG.IconE.mkr.12"></para></entry></row>
|
|
<row rowsep="1">
|
|
<entry><para><!--Original XRef content: 'Advanced Drawing Tasks278'--><xref
|
|
role="JumpText" linkend="UG.IconE.mkr.13"></para></entry></row></tbody></tgroup>
|
|
</informaltable>
|
|
<para id="UG.IconE.mkr.2">Icon Editor enables you to create and edit images
|
|
in two formats:</para>
|
|
<table id="UG.IconE.tbl.1" frame="Topbot">
|
|
<title>Icon Formats</title>
|
|
<tgroup cols="3" colsep="0" rowsep="0">
|
|
<colspec colwidth="1.49in">
|
|
<colspec colwidth="2.86in">
|
|
<colspec colwidth="1.34in">
|
|
<thead>
|
|
<row><entry align="left" valign="bottom"><para><literal>Format</literal></para></entry>
|
|
<entry align="left" valign="bottom"><para><literal>Description</literal></para></entry>
|
|
<entry align="left" valign="bottom"><para><literal>File Name</literal></para></entry>
|
|
</row></thead>
|
|
<tbody>
|
|
<row>
|
|
<entry align="left" valign="top"><para>X pixmap (XPM)</para></entry>
|
|
<entry align="left" valign="top"><para>Multicolor images that include static
|
|
and dynamic colors</para></entry>
|
|
<entry align="left" valign="top"><para><filename>*.pm</filename></para></entry>
|
|
</row>
|
|
<row>
|
|
<entry align="left" valign="top"><para>X bitmap (XBM)</para></entry>
|
|
<entry align="left" valign="top"><para>Two-color images limited to a foreground
|
|
and background color (used for black and white icons)</para></entry>
|
|
<entry align="left" valign="top"><para><filename>*.bm</filename></para></entry>
|
|
</row></tbody></tgroup></table>
|
|
<figure>
|
|
<title>Icon Editor main window</title>
|
|
<graphic id="UG.IconE.grph.1" entityref="UG.IconE.fig.1"></graphic>
|
|
</figure>
|
|
<para>You create images by selecting drawing tools and colors, and using them
|
|
in the work area. As you draw, Icon Editor displays an actual-size copy of
|
|
your icon in both formats. You need to consider the two-color version of
|
|
the icon even if you are drawing an image for use on color systems, because
|
|
icons may revert to two colors if there are not enough free colors available
|
|
on the workspace.</para>
|
|
<para>For information on designing icons, read the Visual Design chapter in
|
|
the <emphasis>Style Guide and Checklist</emphasis>.</para>
|
|
<sect1 id="UG.IconE.div.2" role="Procedure">
|
|
<title id="UG.IconE.mkr.3">To Start Icon Editor</title>
|
|
<orderedlist><listitem><para>Open the Personal Applications subpanel and click
|
|
the Icon Editor control.<indexterm><primary>starting</primary><secondary>Icon Editor</secondary></indexterm><indexterm><primary>Icon Editor</primary>
|
|
<secondary>starting</secondary></indexterm></para>
|
|
</listitem></orderedlist>
|
|
<graphic id="UG.IconE.igrph.1" entityref="UG.IconE.fig.2"></graphic>
|
|
<para>Icon Editor starts with an empty drawing work area.<indexterm><primary>Icon Editor</primary><secondary>control</secondary></indexterm><indexterm>
|
|
<primary>Front Panel</primary><secondary>Icon Editor control</secondary></indexterm></para>
|
|
<sect2 id="UG.IconE.div.3">
|
|
<title>Other Ways to Start Icon Editor</title>
|
|
<para>You can also start Icon Editor and have it load an icon into the work
|
|
area in one of the following ways:<indexterm><primary>opening</primary>
|
|
<secondary>icon</secondary></indexterm><indexterm><primary>Icon Editor</primary>
|
|
<secondary>opening icon for editing</secondary></indexterm></para>
|
|
<itemizedlist remap="Bullet1"><listitem><para>In a File Manager view, locate
|
|
the icon file and double-click on it to open it. (The default action for
|
|
pixmap and bitmap files runs Icon Editor and loads the file.)<indexterm>
|
|
<primary>Icon Editor</primary><secondary>starting from File Manager</secondary>
|
|
</indexterm><indexterm><primary>File Manager</primary><secondary>starting
|
|
Icon Editor from</secondary></indexterm></para>
|
|
</listitem><listitem><para>Drop an icon file on the Icon Editor control in
|
|
the Personal Applications subpanel.<indexterm><primary>dropping</primary>
|
|
<secondary>icon file</secondary></indexterm></para>
|
|
</listitem><listitem><para>Click the Application Manager control in the Front
|
|
Panel, then open Desktop_Apps and double-click on Icon Editor.<indexterm>
|
|
<primary>Icon Editor</primary><secondary>starting from Application Manager</secondary></indexterm><indexterm><primary>Application Manager</primary>
|
|
<secondary>starting Icon Editor from</secondary></indexterm></para>
|
|
</listitem><listitem><para>Type the following command in a Terminal window:<indexterm>
|
|
<primary>Terminal</primary><secondary>starting Icon Editor from</secondary>
|
|
</indexterm><indexterm><primary>Icon Editor</primary><secondary>starting
|
|
from Terminal</secondary></indexterm></para>
|
|
<programlisting>dticon -f <symbol role="Variable">filename</symbol> &</programlisting>
|
|
</listitem></itemizedlist>
|
|
</sect2>
|
|
</sect1>
|
|
<sect1 id="UG.IconE.div.4">
|
|
<title id="UG.IconE.mkr.4">Basic Drawing Tasks</title>
|
|
<para>This section describes how to create and edit an icon and how to use
|
|
the Icon Editor drawing tools.</para>
|
|
<sect2 id="UG.IconE.div.5" role="Procedure">
|
|
<title>To Open an Existing Icon</title>
|
|
<indexterm><primary>icons</primary><secondary>opening existing</secondary></indexterm>
|
|
<orderedlist><listitem><para>Choose Open from the File menu.</para>
|
|
<para>If you have unsaved changes, Icon Editor warns you that your changes
|
|
will be lost by loading another icon. Click Cancel to cancel the Open command.
|
|
Click OK if you don't want to save your changes.</para>
|
|
</listitem><listitem><para>Type the name of the file you want to load in the
|
|
Enter file name field, or select the icon file you want to load from the
|
|
Files section of the Open File dialog box.</para>
|
|
</listitem><listitem><para>Click Open.</para>
|
|
</listitem></orderedlist>
|
|
<note>
|
|
<para>When you load a file, the Output Format (in the Options menu) is automatically
|
|
set to the format of the file you load.</para>
|
|
</note>
|
|
<para>You can also open an existing icon by double-clicking the icon file
|
|
in File Manager.</para>
|
|
</sect2>
|
|
<sect2 id="UG.IconE.div.6" role="Procedure">
|
|
<title>To Start a New Icon</title>
|
|
<indexterm><primary>Icon Editor</primary><secondary>starting a new icon</secondary></indexterm>
|
|
<indexterm><primary>starting</primary><secondary>new icon</secondary></indexterm>
|
|
<orderedlist><listitem><para>Choose New from the File menu.</para>
|
|
<para>If you have unsaved changes, Icon Editor warns you that your changes
|
|
will be lost by starting a new icon. Click Cancel to cancel the New command
|
|
or click OK if you don't want to save your changes.</para>
|
|
</listitem></orderedlist>
|
|
<para>Icon Editor clears the work area and resizes it to the default size
|
|
(32x32).</para>
|
|
<para>If you have an icon already loaded, you can choose Clear Icon from the
|
|
Edit menu to start a new icon with the same size and name as the previously
|
|
loaded icon.</para>
|
|
</sect2>
|
|
<sect2 id="UG.IconE.div.7" role="Procedure">
|
|
<title>To Clear an Icon</title>
|
|
<orderedlist><listitem><para>Save your current icon, if necessary.</para>
|
|
</listitem><listitem><para>Choose Clear Icon from the Edit menu.</para>
|
|
</listitem></orderedlist>
|
|
<para>The entire icon drawing work area is cleared.<indexterm><primary>icons</primary><secondary>clearing loaded</secondary></indexterm></para>
|
|
</sect2>
|
|
<sect2 id="UG.IconE.div.8" role="Procedure">
|
|
<title>To Draw an Image</title>
|
|
<indexterm><primary>drawing icon image</primary></indexterm>
|
|
<indexterm><primary>icons</primary><secondary>drawing image</secondary></indexterm>
|
|
<orderedlist><listitem><para>Select one of the drawing tools (listed in <!--Original
|
|
XRef content: 'Table 13‐2 on page 274'--><xref role="CodeOrFigOrTabAndPNum"
|
|
linkend="UG.IconE.mkr.6">).</para>
|
|
</listitem><listitem><para>Select a color (static color, static gray, or a
|
|
dynamic color).</para>
|
|
</listitem><listitem><para>Begin drawing with the tool you've selected.</para>
|
|
<para>More details on drawing with each tool are provided below.</para>
|
|
</listitem></orderedlist>
|
|
</sect2>
|
|
<sect2 id="UG.IconE.div.9">
|
|
<title>Drawing Tools</title>
|
|
<para>The drawing tools area of Icon Editor is shown in <!--Original XRef
|
|
content: 'Figure 13‐2'--><xref role="CodeOrFigureOrTable" linkend="UG.IconE.mkr.5">.<indexterm>
|
|
<primary>Icon Editor</primary><secondary>drawing tools <$startrange></secondary></indexterm><indexterm><primary>drawing tools
|
|
for Icon Editor <$startrange></primary></indexterm></para>
|
|
<figure>
|
|
<title id="UG.IconE.mkr.5">Icon Editor drawing tools</title>
|
|
<graphic id="UG.IconE.grph.2" entityref="UG.IconE.fig.3"></graphic>
|
|
</figure>
|
|
<variablelist role="LabList">
|
|
<varlistentry><term></term>
|
|
<listitem>
|
|
<para><?X-setsize 9.0 pt></para>
|
|
<table id="UG.IconE.tbl.2" frame="Topbot">
|
|
<title id="UG.IconE.mkr.6">Using the Drawing Tools</title>
|
|
<tgroup cols="3" colsep="0" rowsep="0">
|
|
<colspec colwidth="1.42in">
|
|
<colspec colwidth="1.82in">
|
|
<colspec colwidth="2.90in">
|
|
<thead>
|
|
<row><entry align="left" valign="bottom"><para><literal>Tool</literal></para></entry>
|
|
<entry align="left" valign="bottom"><para><literal>Purpose</literal></para></entry>
|
|
<entry align="left" valign="bottom"><para><literal>Action</literal></para></entry>
|
|
</row></thead>
|
|
<tbody>
|
|
<row>
|
|
<entry align="left" valign="top"><para>Pencil</para></entry>
|
|
<entry align="left" valign="top"><para>For drawing freehand lines and individual
|
|
pixels.</para></entry>
|
|
<entry align="left" valign="top"><para>Press and hold to draw freehand lines.
|
|
</para></entry></row>
|
|
<row>
|
|
<entry align="left" valign="top"><para>Line</para></entry>
|
|
<entry align="left" valign="top"><para>For drawing straight lines.</para></entry>
|
|
<entry align="left" valign="top"><para>Press and hold to stretch the line.
|
|
Release to draw the line.</para></entry></row>
|
|
<row>
|
|
<entry align="left" valign="top"><para>Rectangle</para></entry>
|
|
<entry align="left" valign="top"><para>For drawing solid or outlined rectangles.
|
|
</para></entry>
|
|
<entry align="left" valign="top"><para>Press and hold to stretch the outline
|
|
of the rectangle. Release to draw the rectangle.</para></entry></row>
|
|
<row>
|
|
<entry align="left" valign="top"><para>Circle</para></entry>
|
|
<entry align="left" valign="top"><para>For drawing solid or outlined circles.
|
|
</para></entry>
|
|
<entry align="left" valign="top"><para>Point to where you want the center
|
|
of the circle, press and hold, drag to the desired size, and release.
|
|
</para></entry></row>
|
|
<row>
|
|
<entry align="left" valign="top"><para>Eraser</para></entry>
|
|
<entry align="left" valign="top"><para>For erasing large areas of the image.
|
|
</para></entry>
|
|
<entry align="left" valign="top"><para>Press and hold; then drag over the
|
|
area to erase.</para><para>To erase individual pixels, select the Pencil
|
|
tool and the Transparent color.</para></entry></row>
|
|
<row>
|
|
<entry align="left" valign="top"><para>Flood</para></entry>
|
|
<entry align="left" valign="top"><para>For flooding a region of one color
|
|
with the selected color.</para></entry>
|
|
<entry align="left" valign="top"><para>Click any pixel within the region to
|
|
be flooded. The selected pixel and all adjacent pixels of the same color
|
|
are recolored with the selected color. The filled region extends in all
|
|
directions, bounded only by pixels of a different color.</para></entry>
|
|
</row>
|
|
<row>
|
|
<entry align="left" valign="top"><para>Open Polygon</para></entry>
|
|
<entry align="left" valign="top"><para>For drawing connected straight lines.
|
|
</para></entry>
|
|
<entry align="left" valign="top"><para>Click the starting point; then click
|
|
for each segment.</para><para>Double-click to end the last segment.</para></entry>
|
|
</row>
|
|
<row>
|
|
<entry align="left" valign="top"><para>Closed Polygon</para></entry>
|
|
<entry align="left" valign="top"><para>For drawing connected straight lines,
|
|
where the first line and last line are connected to form a closed polygon.
|
|
</para></entry>
|
|
<entry align="left" valign="top"><para>Click the starting point; then click
|
|
for each segment.</para><para>Double-click to end the last segment.</para></entry>
|
|
</row>
|
|
<row>
|
|
<entry align="left" valign="top"><para>Ellipse</para></entry>
|
|
<entry align="left" valign="top"><para>For drawing solid or outlined ovals.
|
|
</para></entry>
|
|
<entry align="left" valign="top"><para>Press and hold, drag to the desired
|
|
size and shape, and release.</para></entry></row>
|
|
<row>
|
|
<entry align="left" valign="top"><para>Selection</para></entry>
|
|
<entry align="left" valign="top"><para>For selecting an area to work on.
|
|
Several commands in the Edit menu require an area to be selected.</para></entry>
|
|
<entry align="left" valign="top"><para>Point to the corner pixel of the region
|
|
to be selected, press and hold, drag to the desired region, and release.
|
|
</para></entry></row>
|
|
<row>
|
|
<entry align="left" valign="top"><para>Fill Solids</para></entry>
|
|
<entry align="left" valign="top"><para>For changing the rectangle, circle,
|
|
ellipse, and closed polygon tools to draw filled in shapes instead of outlines.<indexterm><primary>Icon Editor</primary><secondary>drawing tools</secondary></indexterm><indexterm><primary>drawing tools for Icon Editor</primary></indexterm>
|
|
</para></entry>
|
|
<entry align="left" valign="top"><para>Select the check box to automatically
|
|
draw filled-in shapes. Deselect the check box to return the tools to drawing
|
|
outlines.</para></entry></row></tbody></tgroup></table>
|
|
<para id="UG.IconE.mkr.7"></para>
|
|
</listitem>
|
|
</varlistentry>
|
|
</variablelist>
|
|
</sect2>
|
|
<sect2 id="UG.IconE.div.10" role="Procedure">
|
|
<title>To Undo a Drawing Operation</title>
|
|
<indexterm><primary>drawing icon image</primary><secondary>undo</secondary></indexterm>
|
|
<orderedlist><listitem><para>Choose Undo from the Edit menu.</para>
|
|
</listitem></orderedlist>
|
|
<para>Only the single, most recent change can be undone.</para>
|
|
</sect2>
|
|
</sect1>
|
|
<sect1 id="UG.IconE.div.11">
|
|
<title id="UG.IconE.mkr.8">Saving Icon Files</title>
|
|
<para id="UG.IconE.mkr.9">When saving icon files, you must use the appropriate
|
|
file-name suffix. There are two suffixes appended to the base name of the
|
|
icon, one for size and one for format. Many icon names are in these general
|
|
forms:<indexterm><primary>names</primary><secondary>for icon files <$startrange></secondary></indexterm><indexterm>
|
|
<primary>icons</primary><secondary>naming <$startrange></secondary></indexterm></para>
|
|
<programlisting>basename.size.format
|
|
|
|
basename.format</programlisting>
|
|
<para>The <symbol role="Variable">basename</symbol> is the image name used
|
|
to reference the image.</para>
|
|
<para><symbol role="Variable">size</symbol> is a single letter indicating
|
|
the standard size of the icon: <command>l</command> for large (48x48 pixels), <command>m</command> for medium (32x32), <command>s</command> for small (24x24), or <command>t</command> for tiny (16x16). ( <!--Original XRef content: 'See
|
|
&xd2;Icon Size Conventions&xd3; on page 276.'--><xref role="SeeHeadingAndPage"
|
|
linkend="UG.IconE.mkr.10">) If your icon is not a standard size, you can
|
|
omit this letter.</para>
|
|
<para><symbol role="Variable">format</symbol> is <command>pm</command> for
|
|
X pixmaps (the color icon format) or <command>bm</command> for X bitmaps (the
|
|
monochrome icon format).</para>
|
|
<para>If you save an icon in XBM format that has transparent color in it,
|
|
an icon mask file is also saved. The icon mask file is named
|
|
<symbol role="Variable">basename.size</symbol><filename>_m</filename><symbol role="Variable">.format</symbol>.
|
|
If you move the icon you saved to another folder, you must also
|
|
move the mask file.</para>
|
|
<para>For example, suppose you specify an icon named <command>mail</command>
|
|
for a file type you've written. If you have a color display and have set
|
|
the File Manager preferences to use tiny icons, the assumed icon name is
|
|
<filename>mail.t.pm</filename>. If it had transparent color and you saved it in XBM
|
|
format, two files would be created: <command>mail.t.bm</command> and
|
|
<filename>mail.t_m.bm</filename>.<indexterm><primary>names</primary><secondary>for
|
|
icon files <$endrange></secondary>
|
|
</indexterm><indexterm><primary>icons</primary><secondary>naming <$endrange></secondary></indexterm></para>
|
|
<sect2 id="UG.IconE.div.12">
|
|
<title id="UG.IconE.mkr.10">Icon Size Conventions</title>
|
|
<para><!--Original
|
|
XRef content: 'Table 13‐3'--><xref role="TableNumber" linkend="UG.IconE.mkr.11">
|
|
lists the recommended sizes—in pixels, width x height—for creating
|
|
new icons for use in CDE. Icons can be up to 256x256.</para>
|
|
<indexterm><primary>icons</primary><secondary>size conventions for</secondary></indexterm>
|
|
<indexterm><primary>sizes of icons</primary></indexterm>
|
|
<table id="UG.IconE.tbl.3">
|
|
<title id="UG.IconE.mkr.11">Icon Size Recommendations</title>
|
|
<tgroup cols="4" colsep="0" rowsep="0">
|
|
<?PubTbl tgroup dispwid="5.78in">
|
|
<colspec colwidth="259*">
|
|
<colspec colwidth="69*">
|
|
<colspec colwidth="79*">
|
|
<colspec colwidth="69*">
|
|
<thead>
|
|
<row><entry align="left" valign="bottom"><para><literal>Resolution</literal></para></entry>
|
|
<entry align="left" valign="bottom"><para><literal>High</literal></para></entry>
|
|
<entry align="left" valign="bottom"><para><literal>Medium</literal></para></entry>
|
|
<entry align="left" valign="bottom"><para><literal>Low</literal></para></entry>
|
|
</row></thead>
|
|
<tbody>
|
|
<row>
|
|
<entry align="left" valign="top"><para><literal>File Manager (Large)</literal></para></entry>
|
|
<entry align="left" valign="top"><para>32x32</para></entry>
|
|
<entry align="left" valign="top"><para>32x32</para></entry>
|
|
<entry align="left" valign="top"><para>32x32</para></entry></row>
|
|
<row>
|
|
<entry align="left" valign="top"><para><literal>File Manager (Small)</literal></para></entry>
|
|
<entry align="left" valign="top"><para>16x16</para></entry>
|
|
<entry align="left" valign="top"><para>16x16</para></entry>
|
|
<entry align="left" valign="top"><para>16x16</para></entry></row>
|
|
<row>
|
|
<entry align="left" valign="top"><para><literal>Application Manager (Large)</literal></para></entry>
|
|
<entry align="left" valign="top"><para>32x32</para></entry>
|
|
<entry align="left" valign="top"><para>32x32</para></entry>
|
|
<entry align="left" valign="top"><para>32x32</para></entry></row>
|
|
<row>
|
|
<entry align="left" valign="top"><para><literal>Application Manager (Small)</literal></para></entry>
|
|
<entry align="left" valign="top"><para>16x16</para></entry>
|
|
<entry align="left" valign="top"><para>16x16</para></entry>
|
|
<entry align="left" valign="top"><para>16x16</para></entry></row>
|
|
<row>
|
|
<entry align="left" valign="top"><para><literal>Front Panel</literal></para></entry>
|
|
<entry align="left" valign="top"><para>48x48</para></entry>
|
|
<entry align="left" valign="top"><para>48x48</para></entry>
|
|
<entry align="left" valign="top"><para>32x32</para></entry></row>
|
|
<row>
|
|
<entry align="left" valign="top"><para><literal>Front Panel subpanels</literal></para></entry>
|
|
<entry align="left" valign="top"><para>32x32</para></entry>
|
|
<entry align="left" valign="top"><para>32x32</para></entry>
|
|
<entry align="left" valign="top"><para>16x16</para></entry></row>
|
|
<row>
|
|
<entry align="left" valign="top"><para><literal>Minimized windows</literal></para></entry>
|
|
<entry align="left" valign="top"><para>48x48</para></entry>
|
|
<entry align="left" valign="top"><para>48x48</para></entry>
|
|
<entry align="left" valign="top"><para>32x32</para></entry></row>
|
|
<row>
|
|
<entry align="left" valign="top"><para><literal>Workspace</literal></para></entry>
|
|
<entry align="left" valign="top"><para>32x32</para></entry>
|
|
<entry align="left" valign="top"><para>32x32</para></entry>
|
|
<entry align="left" valign="top"><para>32x32</para></entry></row></tbody>
|
|
</tgroup></table>
|
|
</sect2>
|
|
<sect2 id="UG.IconE.div.13" role="Procedure">
|
|
<title>To Save the Icon</title>
|
|
<indexterm><primary>Icon Editor</primary><secondary>saving icon</secondary></indexterm>
|
|
<indexterm><primary>icons</primary><secondary>saving</secondary></indexterm>
|
|
<indexterm><primary>saving</primary><secondary>icons</secondary></indexterm>
|
|
<orderedlist><listitem><para>Choose an output format from the Options menu:<indexterm>
|
|
<primary>icons</primary><secondary>output format</secondary></indexterm></para>
|
|
<itemizedlist remap="Bullet2"><listitem><para>XBM for two-color X bitmap format
|
|
</para>
|
|
</listitem><listitem><para>XPM for multicolor X pixmap format (the default)
|
|
</para>
|
|
</listitem></itemizedlist>
|
|
</listitem><listitem><para>Choose Save from the File menu.</para>
|
|
<para>If the icon is unnamed or you choose Save As, Icon Editor prompts you
|
|
for a file name. Type the name and then click Save.</para>
|
|
</listitem></orderedlist>
|
|
<note>
|
|
<para>If you save an icon in XBM format that has transparent color in it,
|
|
an icon mask file is also saved. The icon mask file is named
|
|
<symbol role="Variable">basename.size</symbol><filename>_m</filename><symbol role="Variable">.format</symbol>.
|
|
If you move the icon you saved to another folder, you must also
|
|
move the mask file.</para>
|
|
</note>
|
|
</sect2>
|
|
<sect2 id="UG.IconE.div.14" role="Procedure">
|
|
<title>To Save the Icon with a New Name</title>
|
|
<indexterm><primary>Icon Editor</primary><secondary>saving icon with new name</secondary></indexterm>
|
|
<indexterm><primary>icons</primary><secondary>saving with new name</secondary></indexterm>
|
|
<indexterm><primary>saving</primary><secondary>icons with new name</secondary></indexterm>
|
|
<orderedlist><listitem><para>Choose Save As from the File menu.</para>
|
|
</listitem><listitem><para>Type (or select) the file name under which you
|
|
want to save the icon file.</para>
|
|
</listitem><listitem><para>Click Save.</para>
|
|
<para>If the file already exists, you will need to click OK in the warning
|
|
dialog box to overwrite the existing file.</para>
|
|
</listitem></orderedlist>
|
|
</sect2>
|
|
</sect1>
|
|
<sect1 id="UG.IconE.div.15">
|
|
<title id="UG.IconE.mkr.12">Color Usage</title>
|
|
<para>Icons in the desktop use a palette of 22 colors:</para>
|
|
<indexterm><primary>icons</primary><secondary>color usage for</secondary></indexterm>
|
|
<indexterm><primary>color</primary><secondary>for icons</secondary></indexterm>
|
|
<itemizedlist remap="Bullet1"><listitem><para>Eight static grays</para>
|
|
</listitem><listitem><para>Eight static colors: red, blue, green, cyan, magenta,
|
|
yellow, black, and white</para>
|
|
</listitem><listitem><para>Five dynamic colors: Foreground, Background, TopShadow,
|
|
BottomShadow, and Select</para>
|
|
</listitem><listitem><para>A transparent “color” that allows
|
|
the background to show through</para>
|
|
</listitem></itemizedlist>
|
|
<para>These colors are the default colors in Icon Editor. This set of colors
|
|
provides a reasonable palette with which to create icons. This limited palette
|
|
was chosen to maximize the attractiveness and readability of icons without
|
|
using an unnecessary number of colors.</para>
|
|
<para>The dynamic colors represent the colors used to display the application
|
|
on which your icon will appear. If your icon appears in File Manager, File
|
|
Manager determines what the background color is. Dynamic colors are useful
|
|
for icons that you want to change color as different color palettes are selected
|
|
in Style Manager. Dynamic colors are also useful if the icon will be used
|
|
in more than one place and you want it to use the colors of the application
|
|
where it appears.<indexterm><primary>dynamic colors for icons</primary>
|
|
</indexterm></para>
|
|
<para>TopShadow and BottomShadow can be used for drawing a shadow under your
|
|
icon. You can use these colors to make the icon appear to be etched into
|
|
the surface. This is only recommended for Front Panel style icons.<indexterm>
|
|
<primary>TopShadow</primary></indexterm><indexterm><primary>BottomShadow</primary></indexterm></para>
|
|
<para>The transparent color is useful for creating icons that have the illusion
|
|
of being nonrectangular, since it allows the color behind the icon to show
|
|
through. If your icon does not fill the entire bounding box, you should fill
|
|
the unused area with the transparent color.<indexterm><primary>icons</primary>
|
|
<secondary>color usage for <$endrange></secondary></indexterm><indexterm><primary>color</primary><secondary>for icons <$endrange></secondary>
|
|
</indexterm></para>
|
|
</sect1>
|
|
<sect1 id="UG.IconE.div.16">
|
|
<title id="UG.IconE.mkr.13">Advanced Drawing Tasks</title>
|
|
<para>After you become familiar with the basic drawing facilities in Icon
|
|
Editor, you may want to try some more advanced operations. Many of these
|
|
operations require you to first <symbol role="Variable">select</symbol> an
|
|
area of the icon. This is done using the Selection tool (next to the eraser).
|
|
</para>
|
|
<para>When an area of the icon is selected, you can:</para>
|
|
<itemizedlist remap="Bullet1"><listitem><para>Cut, copy or move it</para>
|
|
</listitem><listitem><para>Resize (scale) it</para>
|
|
</listitem><listitem><para>Flip it (horizontally or vertically)</para>
|
|
</listitem><listitem><para>Rotate it (right or left)</para>
|
|
</listitem></itemizedlist>
|
|
<sect2 id="UG.IconE.div.17" role="Procedure">
|
|
<title>To Select an Area of the Icon</title>
|
|
<indexterm><primary>selecting</primary><secondary>an area of an icon</secondary></indexterm>
|
|
<indexterm><primary>icons</primary><secondary>selecting an area of</secondary></indexterm>
|
|
<orderedlist><listitem><para>Click the Selection tool (next to the eraser).
|
|
</para>
|
|
</listitem><listitem><para>Drag a box around the area you want to select.
|
|
</para>
|
|
<para>When an area is selected, a box flashes around the selected area.</para>
|
|
</listitem></orderedlist>
|
|
</sect2>
|
|
<sect2 id="UG.IconE.div.18" role="Procedure">
|
|
<title>To Cut a Region of the Icon</title>
|
|
<indexterm><primary>cutting a region of an icon</primary></indexterm>
|
|
<indexterm><primary>icons</primary><secondary>cutting a region of</secondary></indexterm>
|
|
<orderedlist><listitem><para>Select the area of the icon you want to cut using
|
|
the Selection tool.</para>
|
|
</listitem><listitem><para>Choose Cut from the Edit menu.</para>
|
|
</listitem></orderedlist>
|
|
<para>When you cut a portion of an icon, the exposed area becomes <emphasis>transparent</emphasis> (that is, filled in with the Transparent color).
|
|
</para>
|
|
<para>Note that after cutting a region, you can paste it back into the icon
|
|
by choosing Paste from the Edit menu.</para>
|
|
</sect2>
|
|
<sect2 id="UG.IconE.div.19" role="Procedure">
|
|
<title>To Copy a Region of the Icon</title>
|
|
<indexterm><primary>copying</primary><secondary>a region of an icon</secondary></indexterm>
|
|
<indexterm><primary>icons</primary><secondary>copying a region of</secondary></indexterm>
|
|
<orderedlist><listitem><para>Select the area of the icon you want to copy
|
|
using the Selection tool.</para>
|
|
</listitem><listitem><para>Choose Copy from the Edit menu.</para>
|
|
</listitem><listitem><para>Choose Paste from the Edit menu.</para>
|
|
</listitem><listitem><para>Position the outline where you want to paste the
|
|
copy, and then click.</para>
|
|
</listitem></orderedlist>
|
|
<para>You may repeat steps 3 and 4 as many times as you like to paste multiple
|
|
copies of the region you copied.</para>
|
|
</sect2>
|
|
<sect2 id="UG.IconE.div.20" role="Procedure">
|
|
<title>To Move a Region of the Icon</title>
|
|
<indexterm><primary>moving</primary><secondary>a region of an icon</secondary></indexterm>
|
|
<indexterm><primary>icons</primary><secondary>moving a region of</secondary></indexterm>
|
|
<orderedlist>
|
|
<listitem><para>Select the area of the icon you want to move
|
|
using the Selection tool.</para>
|
|
</listitem><listitem><para>Choose Cut from the Edit menu.</para>
|
|
</listitem><listitem><para>Choose Paste from the Edit menu.</para>
|
|
</listitem><listitem><para>Position the outline where you want to paste the
|
|
copy, and then click.</para>
|
|
</listitem></orderedlist>
|
|
<para>You may repeat steps 3 and 4 as many times as you like to paste multiple
|
|
copies of the region you cut.</para>
|
|
</sect2>
|
|
<sect2 id="UG.IconE.div.21" role="Procedure">
|
|
<title>To Rotate Part of the Icon</title>
|
|
<indexterm><primary>rotating part of an icon</primary></indexterm>
|
|
<indexterm><primary>icons</primary><secondary>rotating part of</secondary></indexterm>
|
|
<orderedlist><listitem><para>Select the area of the icon you want to rotate
|
|
using the Selection tool.</para>
|
|
</listitem><listitem><para>Choose Rotate then Left or Rotate then Right from
|
|
the Edit menu.</para>
|
|
</listitem><listitem><para>Position the outline where you want to paste the
|
|
rotated area, and then click.</para>
|
|
</listitem></orderedlist>
|
|
</sect2>
|
|
<sect2 id="UG.IconE.div.22" role="Procedure">
|
|
<title>To Flip (Mirror) Part of the Icon</title>
|
|
<para>Flipping an area creates a pixel-for-pixel mirror image of the selected
|
|
area.</para>
|
|
<orderedlist><listitem><para><indexterm><primary>flipping part of an icon</primary></indexterm><indexterm><primary>icons</primary><secondary>flipping
|
|
part of</secondary></indexterm>Select the area of the icon you want to flip
|
|
using the Selection tool.</para>
|
|
</listitem><listitem><para>Choose Flip then Vertical or Flip then Horizontal
|
|
from the Edit menu.</para>
|
|
</listitem></orderedlist>
|
|
</sect2>
|
|
<sect2 id="UG.IconE.div.23">
|
|
<title>Resizing Icons</title>
|
|
<para>You can resize the entire icon or a region of the icon.</para>
|
|
<sect3 id="UG.IconE.div.24" role="Procedure">
|
|
<title>To Resize the Current Icon</title>
|
|
<orderedlist><listitem><para>Choose Resize Icon from the Edit menu.</para>
|
|
<para>Icon Editor displays a dialog box that prompts for the new size.</para>
|
|
</listitem><listitem><para>Edit the current width and height to specify the
|
|
new size.</para>
|
|
</listitem><listitem><para>Click OK.<indexterm><primary>resizing</primary>
|
|
<secondary>icons</secondary></indexterm><indexterm><primary>icons</primary>
|
|
<secondary>resizing</secondary></indexterm></para>
|
|
</listitem></orderedlist>
|
|
<note>
|
|
<para>If you make the icon smaller, the right and bottom edges are clipped
|
|
off. If you make the icon larger, the existing image remains in the upper
|
|
left of the icon.</para>
|
|
</note>
|
|
</sect3>
|
|
<sect3 id="UG.IconE.div.25" role="Procedure">
|
|
<title>To Resize (Scale) a Region of the Icon</title>
|
|
<indexterm><primary>resizing</primary><secondary>a region of an icon</secondary></indexterm>
|
|
<indexterm><primary>icons</primary><secondary>resizing a region of</secondary></indexterm>
|
|
<orderedlist><listitem><para>Select the area of the icon you want to resize
|
|
using the Selection tool.</para>
|
|
</listitem><listitem><para>Choose Scale from the Edit menu.</para>
|
|
</listitem><listitem><para>Drag a box that defines the size and shape that
|
|
you want the scaled image to be.</para>
|
|
<para>The size of the box is shown in the upper right area. <emphasis>This
|
|
determines how the selected portion of the image will be scaled; it does</emphasis> <symbol role="Variable">not</symbol> <emphasis>determine where
|
|
to place the results</emphasis>.</para>
|
|
</listitem><listitem><para>Position the outline where you want to paste the
|
|
scaled copy, and then click.</para>
|
|
</listitem></orderedlist>
|
|
</sect3>
|
|
</sect2>
|
|
<sect2 id="UG.IconE.div.26">
|
|
<title>Hotspots</title>
|
|
<para>Bitmap images (XBM format) can be used as special mouse pointer shapes.
|
|
A hotspot marks a single pixel within the image that is the true <symbol role="Variable">point</symbol> of the mouse pointer.</para>
|
|
<sect3 id="UG.IconE.div.27" role="Procedure">
|
|
<title>To Add a Hotspot</title>
|
|
<indexterm><primary>hotspot in an icon</primary></indexterm>
|
|
<indexterm><primary>icons</primary><secondary>hotspot</secondary></indexterm>
|
|
<para>You can only have one hotspot in an icon.</para>
|
|
<orderedlist><listitem><para>Choose Add Hotspot from the Edit menu.</para>
|
|
</listitem><listitem><para>Click the pixel where you want the hotspot.</para>
|
|
</listitem></orderedlist>
|
|
</sect3>
|
|
<sect3 id="UG.IconE.div.28" role="Procedure">
|
|
<title>To Delete a Hotspot</title>
|
|
<indexterm><primary>hotspot in an icon</primary></indexterm>
|
|
<indexterm><primary>icons</primary><secondary>hotspot</secondary></indexterm>
|
|
<orderedlist><listitem><para>Choose Delete Hotspot from the Edit menu.</para>
|
|
</listitem></orderedlist>
|
|
</sect3>
|
|
</sect2>
|
|
<sect2 id="UG.IconE.div.29">
|
|
<title>Screen Captures</title>
|
|
<para>You can copy any area from any part of the screen into the Icon Editor.
|
|
You can copy (“grab”) a text or graphic that is displayed
|
|
and load it into the Icon Editor work area.</para>
|
|
<sect3 id="UG.IconE.div.30" role="Procedure">
|
|
<title>To Capture (Grab) a Region of the Display</title>
|
|
<indexterm><primary>capturing region of display</primary></indexterm>
|
|
<indexterm><primary>grabbing</primary><secondary>region of display</secondary></indexterm>
|
|
<indexterm><primary>display</primary><secondary>capturing region of</secondary></indexterm>
|
|
<orderedlist><listitem><para>Save your current icon, if necessary.</para>
|
|
</listitem><listitem><para>Choose Grab Screen Image from the Edit menu.</para>
|
|
</listitem><listitem><para>Drag a box around the portion of the workspace
|
|
you want to capture (press mouse button 1, drag, and release).</para>
|
|
</listitem></orderedlist>
|
|
<note>
|
|
<para>Capturing a region of the display could cause the icon to use up some
|
|
of the available colors on the desktop.</para>
|
|
</note>
|
|
</sect3>
|
|
</sect2>
|
|
<sect2 id="UG.IconE.div.31">
|
|
<title>Modifying the View of an Icon</title>
|
|
<para>You can change the view of an icon in the Icon Editor work area by changing
|
|
the magnification or using a grid.</para>
|
|
<sect3 id="UG.IconE.div.32" role="Procedure">
|
|
<title>To Hide the Grid</title>
|
|
<indexterm><primary>grid</primary><secondary>in Icon Editor</secondary></indexterm>
|
|
<indexterm><primary>Icon Editor</primary><secondary>hiding grid in</secondary></indexterm>
|
|
<indexterm><primary>hiding</primary><secondary>Icon Editor grid</secondary></indexterm>
|
|
<indexterm><primary>grabbing</primary><secondary>region of display</secondary></indexterm>
|
|
<indexterm><primary>display</primary><secondary>capturing region of</secondary></indexterm>
|
|
<orderedlist><listitem><para>Choose Visible Grid from the Options menu.</para>
|
|
<para>This will hide the grid. Choose Visible Grid from the Options menu
|
|
again to display the grid. The grid is displayed by default.</para>
|
|
</listitem></orderedlist>
|
|
</sect3>
|
|
<sect3 id="ug.icone.div.33" role="Procedure">
|
|
<title>To Change the Magnification of an Icon</title>
|
|
<indexterm><primary>capturing region of display</primary></indexterm>
|
|
<indexterm><primary>grabbing</primary><secondary>region of display</secondary></indexterm>
|
|
<indexterm><primary>display</primary><secondary>capturing region of</secondary></indexterm>
|
|
<orderedlist><listitem><para>Choose Magnification from the Options menu.</para>
|
|
</listitem><listitem><para>Choose the Magnification level you want from the
|
|
submenu.<indexterm><primary>icons</primary><secondary>changing magnification
|
|
of</secondary></indexterm><indexterm><primary>magnification of icons</primary>
|
|
</indexterm></para>
|
|
</listitem></orderedlist>
|
|
</sect3>
|
|
</sect2>
|
|
</sect1>
|
|
</chapter>
|
|
<!--fickle 1.14 mif-to-docbook 1.7 01/02/96 10:57:19-->
|
|
<?Pub *0000052204>
|