<< . .

. 37
( : 41)



. . >>

long as they™re all selected.
To delete a node, press Delete.
To select several nodes, hold down the Shift key while clicking them.
To select several nodes at one time, make sure that you™re in Node Edit
mode (this action doesn™t work if you™re in Drawing or Knife mode) and
draw a square around the nodes you want to select.
To select all nodes, right-click a node and choose Edit➪Select All from
the context menu that pops up.
To join two line segments that are part of the same object (for example,
if they were created by cutting a line in half with the Pen tool in Knife
mode), select the two ends you want to join by Shift+clicking both of
them and then right-click your image and choose Edit➪Join.

TEAM LinG - Live, Informative, Non-cost and Genuine !
315
Chapter 18: Ten Topics a Little Too Advanced for the Rest of This Book

Note that a line has direction, based on the order in which you create the line.
The control arrow that appears on a node in Node Edit mode points in the line™s
direction. The word Start or End that appears when you pause your mouse
cursor over the end nodes of a line also tells you the direction. A few things you
do may be dependent on direction, such as aligning text to the line or shape.



Slicing shapes in half
The Pen tool is mightier than the Sword tool ” or would be, if a Sword tool
existed. Ironically, though, Knife mode is a part of the Pen tool, and it™s might-
ier than the rest of the Pen tool because it slices in half the lines and shapes
you have drawn.

Select Knife mode from the Tool Options palette and drag a line through your
vector object. This action separates the object into two separate sets of
nodes, cut cleanly where you drew through them with the Knife. Be warned
that even if you separate an image in two with the Knife, both still count as
one vector object.




Aligning Objects
After you have painstakingly added all the text, shapes, and Bezier curves to
an image, quite often you must complete one more step: You want these ele-
ments to line up cleanly. The right edge of the text should match up with the
end of your Bezier curve, or the elements all should be aligned to the bottom,
as shown in Figure 18-10. Fortunately, you can easily align all the objects in
your file.



Figure 18-10:
Both images
and text are
lined up
neatly along
the bottom
in the right-
hand box.




TEAM LinG - Live, Informative, Non-cost and Genuine !
316 Part V: The Part of Tens

Unfortunately, one of the sillier things about Paint Shop Pro is that you have
no way (or at least no easy way) to convert a layer or selection into an object.
And, you can use this technique only to align objects. You can™t align, for
example, a pasted-in image with a text object in one click; if you need to do
that, you have to do it by hand. Sorry!

Simply select all the objects you want lined up (refer to Chapter 12 for details
on how to do that) and choose Objects➪Align. You™re presented with a daz-
zling array of options:

Top, Bottom, Left, Right: Paint Shop Pro aligns all the selected objects
along the margin you have chosen. For example, if you choose Right, the
objects are all moved so that their right margins are placed on the same
line.
Vertical Center, Horizontal Center: These items are aligned along their
vertical or horizontal axis.
Center in Canvas, Horizontal Center in Canvas, Vertical Center in
Canvas: These options move all selected items (even if it™s just one item)
so that it™s in the appropriate place in the canvas.




Distributing Objects
When you have several objects on a page, you often want to space them in
some manner ” so that a row of hand-drawn Christmas lights is evenly
spread across the page or items are arranged neatly by their center.

Simply select three or more objects (you can™t distribute just two items!),
and then choose Objects➪Distribute. You™re given a couple of choices:

Vertical Center: The centers of the objects are spaced out evenly along
a vertical axis, as shown in Figure 18-11. Notice that their uneven hori-
zontal positions have been left untouched.
Horizontal Center: The centers of the objects are spaced out evenly
along a horizontal axis.
Vertical Bottom, Horizontal Bottom, Vertical Top, Horizontal Top:
Sometimes, when you have objects of differing sizes, spacing out items
by their centers looks funny, as you can see in Figure 18-12. In that case,
you can space your objects according to where their bottom or top mar-
gins are, which can make things easier.
Space Evenly Horizontal, Space Evenly Vertical: This option spaces the
selected objects evenly across the canvas height or width, depending on
whether you choose Horizontal or Vertical.



TEAM LinG - Live, Informative, Non-cost and Genuine !
317
Chapter 18: Ten Topics a Little Too Advanced for the Rest of This Book


Figure 18-11:
These
circles are a
little spaced
out, but a
little vertical
centering
neatens
them right
up. Notice
that even
though the
circles have
been
distributed
evenly along
a vertical
axis, their
uneven
horizontal
positions
have been
left
untouched.




Figure 18-12:
The large
circle and
small circles
here are all
spaced out
evenly by
their
centers, but
they still look
funny. Using
Vertical
Bottom
as an
alignment
method
makes them
look a little
more
natural.

TEAM LinG - Live, Informative, Non-cost and Genuine !
318 Part V: The Part of Tens


Using the Paint Shop Pro Grids
If you™re the sort of person who really likes to have your ducks in a row, Paint
Shop Pro can display a grid so that you know precisely where your objects
are at all times. (As an unexpected bonus, it also makes your image look
much like a game of Battleship.) The grid is handy for lining up items.

Furthermore, you can set the grid so that when you drag a selection, object,
or layer to within a certain distance of a gridline, the item™s edge “snaps” to
the grid and moves the edge automatically so that it™s aligned with one of the
lines.

To see the grid, choose View➪Grid. A fine tracery of gray lines now overlays
your image; you can™t draw over or erase the grid lines. If you want to have
your selections snap to the grid, choose View➪Snap to Grid.

To adjust the grid™s properties, choose View➪Change Grid, Guide and Snap
Properties, which brings up the not-at-all-interestingly-named Grid, Guide &
Snap Properties dialog box, as shown in Figure 18-13.




Figure 18-13:
The Matrix
has you, but
the grid
merely
helps you
set things
into place.



From there, you can adjust both the default settings for all grids and the set-
tings for the grid in this particular image. In either case, the controls are
fairly intuitive as Paint Shop Pro goes:

Units: In this area of the dialog box, you can decide which style of mea-
surement Paint Shop Pro should use to set grid lines: pixels, centime-
ters, or inches.
Horizontal Grids: This option controls how far apart your horizontal
grid lines should be, as measured in whatever units you choose.

TEAM LinG - Live, Informative, Non-cost and Genuine !
319
Chapter 18: Ten Topics a Little Too Advanced for the Rest of This Book

Vertical Grids: This option controls how far apart your vertical grid
lines should be. (Note that you can set the vertical and horizontal grid
lines to different values, though we can™t imagine why you would want to
do so.)
Color: By default, this option is set to a neutral gray, but you can choose
a vibrant pink or muted yellow for your grid lines, if you like. Clicking
this box brings up a dialog box much like the Color palette, which we
explain thoroughly in Chapter 9.
Snap Influence: This option controls how strong an influence your grid
lines have when you turn on the Snap To option. By default, it™s set to
100 pixels, which means that if a selected item™s edge comes within 100
pixels of a grid line, the edge is automatically aligned with the line. You
can reduce this number, which allows you to move your items about the
grid without always having your items snap to an edge.

When you™re done, click OK. To stop displaying your grid (which also tem-
porarily disables any snap-to settings), choose View➪Grid once more.




Advanced Selecting Techniques
Sometimes, you want to select lots of areas that are the same color, scattered
throughout your image ” for example, you want to select only the sky, as
seen through the intersecting branches of a tree. You could Shift+click each
spot manually with the Magic Wand tool and painstakingly add area after
area. But, fortunately, Paint Shop Pro offers an automatic version of that
same task.

First, use any selection tool to select one area. Then, choose Selections➪
Modify➪Select Similar. Paint Shop Pro selects all pixels similar to the colors
within your selection.

How similar? The Select Similar command looks to the Magic Wand tool™s
Tolerance control to determine how similar to the original color a selected
pixel should be. A high tolerance means that a color can be significantly dif-
ferent and still be selected; a low tolerance selects only colors that are very
close to those in your original selection.

A difference between the Magic Wand tool and the Select Similar command
is that it asks whether you want to select an area contiguously. A contiguous
Select Similar action adds only the areas that are right next to the current
selection; discontiguous selections add parts from all over your image, regard-
less of where they are.

You can also add or remove selections based on how close they are to certain
colors. For example, if you™re trying to cut and paste The Artist Formerly

TEAM LinG - Live, Informative, Non-cost and Genuine !
320 Part V: The Part of Tens

Known As Prince Who Is Back to Being Called Prince Again (and who is
known for wearing purple outfits), you may want to expand your selection
to only lavender areas. Choose Selections➪Modify➪Select Color Range,
and choose a nice shade of magenta in the color box.

Sometimes, you don™t really want all the pixels of similar color, just those
within a certain region of the image. Fussy, fussy. For example, you may want
all the blue sky, including the stuff that peeks through the tree branches, but
not the blue pond. No problem. Just draw a freehand selection around the
pond while pressing the Ctrl key to subtract that area.




Creating Interactive Web
Pages from Graphics
Paint Shop Pro not only creates static Web images (images that just sit there),
but can also create the interactive graphical portion of the Web page itself.
For example, Paint Shop Pro can help you

Slice a single image into a multi-image grid and create the Web page that
assembles the pieces into a grid and makes each image a hot link.
Create graphical rollovers ” images that change as you pass your mouse
cursor over them ” and write the Web page code to make the rollover
happen.

To accomplish its Webbish wonders, Paint Shop Pro writes HTML files (Web
pages), not just image files. You can then use these HTML files on their own
or copy their HTML code (including JavaScript code) into other Web pages.

You probably need to understand how Web pages, hot links, and rollovers
work before trying to use Paint Shop Pro to make these features. Check out
the Wiley Web site, at www.wiley.com, to find various books on Web pages
and design.



Creating image slices
Professional Web designers rarely design in HTML; instead, they create an
image of how they want their Web page to look, by using multiple layers and
futzing with the page until it looks perfect. Then, when they™re done, they
slice that image into multiple images (known as cells) and assign a link to
each cell. Paint Shop Pro creates the HTML code (a table) that™s necessary
to hold the images in a grid and also creates a series of new images from
your original, single image.


TEAM LinG - Live, Informative, Non-cost and Genuine !
321
Chapter 18: Ten Topics a Little Too Advanced for the Rest of This Book

You can use another technique, called image mapping, but it has two major
disadvantages: The entire image has to be downloaded completely before
the viewer can do anything (and haven™t we told you about the importance
of speedy downloads?), and you can™t use rollovers effectively. We advise
skipping this technique unless you have a pressing need.

To slice an image, follow these steps:

1. Choose File➪Export➪Image Slicer, as shown in Figure 18-14.
2. Zoom and position your image in the Image Slicer so that you can see
the whole area you intend to slice.
To zoom, click either of the magnifier icons below the image: + to zoom
in or “ to zoom out. To position (pan) your image, click and hold the
mouse button on the Pan icon and drag in the preview window until you
see what you want.


Selection Slice Pan
tool tool tool
Preview
(click here to see
Grid Erase a preview of this sliced
tool tool image in a browser window)




Figure 18-14:
Slicin™ dice
with the
Image
Slicer.




TEAM LinG - Live, Informative, Non-cost and Genuine !
322 Part V: The Part of Tens

3. Click either the Slice tool or the Grid tool.
The Grid tool divides your image by using a grid of evenly spaced lines.
You can adjust the lines and their positions afterward. The Slice tool,
although tricky to control, enables you to slice wherever you like.
4. Slice your image.
If you use the Grid tool, click anywhere on the image. In the Grid Size
dialog box that appears, enter values for the number of rows and
columns in your grid.
If you use the Slice tool, click where you want the center of your cut to
be and drag either horizontally or vertically; the Slice tool creates a hori-
zontal or vertical cut that expands in both directions from where you
originally clicked. You don™t need to drag entirely across the image; the
line automatically extends to the image edge or to the next line it
encounters.
Note that you can use both the Slice tool and the Grid tool to provide
extremely fine control; for example, you can create a grid of boxes and
then subdivide each of those boxes with the Slice tool.
5. Use the Delete tool to remove any extra lines.
Click the Delete tool in the Tools area and click lines you don™t want.
6. Use the Arrow tool to drag any lines that need moving.

If your image has any solid white cells, you can improve the Web page™s
downloading speed by not placing an image in that cell. Using the Arrow tool,
click the cell and then uncheck the Include Cell in Table check box. This trick
also works for other solid-color areas, but you have to edit the resulting
HTML file to set the background color to match the image color.

At this point, you™re ready to enter the hyperlink (Web address) information
that describes what Web page appears when the person viewing your page
clicks a cell (see the following section).



Entering links
After you have created your hot spot areas or cells, the next step is to enter
the Web address that you want each hot spot or cell to link to when someone
clicks it on the Web. Follow these steps:

1. Choose the Arrow tool (in the Tools area) and click a hot spot or cell.
2. Enter the URL (address of the Web page) you want to link to in the
URL text box.
If you intend for the page to appear in a named frame of the current
page, enter the frame name in the Target area.

TEAM LinG - Live, Informative, Non-cost and Genuine !
323
Chapter 18: Ten Topics a Little Too Advanced for the Rest of This Book

3. Enter a text description of that new page in the Alt Text text box.
4. Select where you want the new page to open on the Target menu.
If you want the page to open in the same browser window, you can leave
this area blank. Otherwise, you can force the user™s browser to display

<< . .

. 37
( : 41)



. . >>