PagePlus

Gradient and bitmap fills

Gradient fills provide a gradation or spectrum of colors spreading between two or more points on an object. A gradient fill has an editable path with nodes that mark the origin of each of these key colors. A bitmap fill uses a named bitmap—often a material, pattern, or background image—to fill an object.

Linear	Elliptical	Conical	Bitmap

You can apply preset gradient and bitmap fills from the Swatches tab to the fill or outline of a shape or text frame; table cells as well as artistic, frame, and table text can also take a gradient or bitmap fill. The fill’s path on an object’s fill or line can also be varied for different effects.

Click the links below for subtopics on:

Applying a gradient or bitmap fill

Editing the fill path

Editing the gradient fill spectrum

Changing the set of gradient gallery fills

Changing the set of bitmap gallery fills

Applying a gradient or bitmap fill

There are several ways to apply a gradient or bitmap fill: using the Swatches tab, the Fill Tool, or a dialog.

The easiest way to apply a gradient or bitmap fill is to use one of a range of pre-supplied swatch thumbnails in the Swatches tab’s Gradient or Bitmap palettes. The Fill Tool and a Fill dialog are alternative methods for creating gradient fills.

To apply a gradient or bitmap fill using the Swatches tab:

1. Display the Swatches tab and ensure either  Fill or Line is selected (for an object’s fill or outline, respectively).
   Note that the color of the underline reflects the color of your selected object.

2.  For gradient fills, select a gradient category, e.g. Linear, Elliptical, etc., from the Gradient button’s drop-down menu.
   – or -

    For bitmap fills, select a drop-down menu category from the Bitmap button.

3. Select the object(s), and then click the appropriate gallery swatch for the fill you want to apply.
   – or -

   For fills only, drag from the gallery swatch onto any object and release the mouse button.

4. If needed, adjust the fill’s Tint at the bottom of the tab with the tab slider or set a percentage value in the input box.

5. Applying different transparency effects (using the Transparency tab) won’t alter the object’s fill settings as such, but may significantly alter a fill’s actual appearance.

To apply a gradient fill with the Fill Tool:

1. Select an object.

2. Click the  Fill Tool button on the Attributes toolbar’s Fill flyout.

3. Display the Swatches tab and ensure either  Fill or Line is selected (for an object’s fill or outline, respectively).

4. Click and drag on the object to define the fill path. The object takes a simple Linear fill, grading from the object’s current color to monochrome white.

   

5. If the object is white already (or has no fill), grading is from white to black.

Alternatively, a dialog can be used to add or subtract key co
lors from the gradient (see Editing the gradient fill spectrum below), apply different key colors to individual nodes, or vary the overall shading of the effect applied to the object.

To apply or edit a gradient or bitmap fill using a dialog:

1. Display the Swatches tab and ensure either  Fill or Line is selected (for an object’s fill or outline, respectively).

2. Right-click the object and choose Format>Fill, or select it and choose Fill… from the Format menu.
   – or -
   Click the  Edit Fill button on the Attributes toolbar’s Fill flyout.

3. Choose the fill type and the desired fill category. Note that you can also use the dialog to apply a solid fill.

• For gradient fills, select Gradient from the Type drop-down menu, and pick a gradient preset. A two-color gradient has two nodes, one at each end of its path.
  – or -

  Click the From and To buttons to specify the gradient’s start and end colors.
  – or -

  Click the Edit button if you want to add or subtract key colors from the currently chosen gradient (see Editing the gradient fill spectrum below), apply different key colors to individual nodes, or vary the overall shading of the effect applied to the object. You can adjust the fill’s shade/tint as needed using the drop-down list.

• For bitmap fills, select Bitmap from the Type drop-down menu, choose a category, and then click a gallery swatch.

3. Click OK to apply the effect or fill to the object.

Editing the fill path

When you select a fillable object, the Fill Tool becomes available (otherwise it’s grayed out). When you select the Fill Tool, if the object uses a gradient fill, you’ll see the fill path displayed as a line, with nodes marking where the spectrum between each key color begins and ends. Adjusting the node positions determines the actual spread of colors between nodes. You can also edit a gradient fill by adding, deleting, or changing key colors (see below).

Linear Fill based on key colors (A)	Filled object showing fill path (B)

To adjust the gradient fill path on a selected object:

1. Display the Swatches tab and ensure either  Fill or Line is selected (for an object’s fill or outline, respectively).

2. Click the  Fill Tool button on the Attributes toolbar’s Fill flyout. The fill path appears on the object’s fill or outline.

3. Use the Fill Tool to drag the start and end path nodes, or click on the object for a new start node and drag out a new fill path. The gradient starts where you place the start node, and ends where you place the end node.

Each gradient fill type has a characteristic path. For example, Linear fills have single-line paths, while Radial fills have a two-line path so you can adjust the fill’s extent in two directions away from the center. If the object uses a bitmap fill, you’ll see the fill path displayed as two lines joined at a center point. Nodes mark the fill’s center and edges.

Experiment to discover new effects! For example, you can widen or narrow the gradient’s extent, even drag either node completely outside the object. Or, for Radial fills on a round shape, try placing the start node near the figure’s upper edge, off-center, to create a reflection highlight.

Unlike the other fill types, bitmap fills don’t simply “end” at the edges of their fill path. Rather, they tile (repeat) so you can fill indefinitely large regions at any scale. By dragging the edge nodes in or out with the Fill Tool, you can “zoom” in or out on the fill pattern. (A) Edge nodes (B) Center handle

For example, these two shapes use identical bitmap fills with different fill path settings:

 

To adjust the path of a bitmap fill on a selected object:

1. Display the Swatches tab and ensure either .png" style="width:28px;height:28px" width="28" height="28" border="0" class="hcp11"> Fill or Line is selected (for an object’s fill or outline, respectively).

2. Click the  Fill Tool button on the Attributes toolbar’s Fill flyout. The object’s fill path appears.

3. Use the Fill Tool to drag the center and/or edge nodes, or click on the object for a new center node and drag out a new fill path.

4. To reposition the fill’s center, drag the center node.

5. To adjust the fill’s extent and tiling, drag one or both edge nodes in or out with respect to the center.

6. To create a skewed or tilted fill region, drag one or both edge nodes sideways.

7. To tilt the fill path in 15-degree increments, hold down the Shift key while dragging. The fill path is unskewed and “regularly sized”—that is, its size jumps in steps. To preserve the fill’s aspect ratio, hold down the Ctrl key. For a combined effect, use both keys together.
   Tip: The Ctrl-constrain technique is convenient if you want a bitmap fill to extend to fill a box without tiling. One of the “regular” steps includes a setting where the fill matches the object’s bounding box.

Editing the gradient fill spectrum

Whether you’re editing a gradient fill that’s been already been applied to an object, or redefining one of the gallery fills, the basic concepts are the same. Whereas solid fills use a single color, all gradient fills utilize at least two key colors, with a spread of hues in between each key color, creating a “spectrum” effect. You can either edit the fill spectrum directly, using the Fill Tool, or use a dialog.

To edit a gradient fill directly:

1. Select the filled object and select the Fill Tool to display the object’s fill path. Nodes mark the key colors where color spread(s) begin and end.
   

2. Select the Swatches tab and ensure the solid color palette is showing.

3. To add a key color, drag from a color swatch onto a portion of the fill path where there is no node. A new node appears.
    
    

4. Be sure the tip of the pointer is over the node or path (watch the cursor) when you release the mouse button. Otherwise the color will be applied to the whole object as a solid fill.

4. To change a key color, click its node, then click a color swatch.

          
   – or -
   Drag from a color swatch (e.g., Magenta) onto any node to change the key color of the node.
    
    

5. To move a key color (except the end colors), simply use the Fill Tool to drag its node to a new position along the fill path.

6. To delete a key color (except the end colors), select it and press Delete.

To edit a gradient fill using a dialog:

1. On an object) Right-click the filled object and choose Format>Fill…. In the dialog, click the Edit button. You can also click the Edit Fill button on the Attributes toolbar’s Fill flyout.
   – or -
   (Gallery fill) Right-click the fill swatch thumbnail and choose Edit….

In either case, an edit dialog appears displaying the gradient spectrum, with pointers marking the key colors where color spread(s) begin and end.

Key colors

In this example, the gradient has just one spread, between blue and yellow key colors. The dialog also includes a gallery with the solid colors from the publication’s palette. Click More Colors… to choose colors from outside the palette.

2. The color of the gradient’s start node appears at the left, and that of the end node at the right.

2. To add a key color for more c
   omplex banding, click either on the spectrum or just below it, where you want to place the new key color. A new pointer appears, using black in this example. Note that the new pointer’s arrow is black, indicating that it’s selected; unselected pointers have white arrows.
    

3. To change a key color, click to select its pointer, then click the gallery swatch for the color you want. In the example below, we’ve changed the new key color to red. Note that the pointer shows the new key color, and is still selected.
    

4. To move a key color (except the end colors), simply drag its pointer to a new position along the spectrum, or select a node and type a new value into the Location box for fine-tuning the position.

5. To delete a key color (except the end colors), right-click its pointer, or select the pointer and press Delete.

6. Click OK to accept changes, or Cancel to abandon changes.

7. Key color deletion is not reversible using Undo.

8. If the color gallery doesn’t contain precisely the right colors for the gradient effect you want, you can add, delete, or redefine palette colors as needed. For details, see the topic Managing publication colors and palettes.

Changing the set of gradient gallery fills

If you’ve defined a new gradient fill by setting fill path and/or key colors, you can add it to the set of gradient gallery fills shown on the Swatches tab so that it will be available to use again. You can also add new fills or delete any of the existing gallery fills (covered in the Swatches tab topic).

To add an object’s fill to a fill gallery:

• Select the object and choose Add Fill to Studio from the Format menu.
  – or -
  Right-click the object and choose Format>Add fill to Studio.

Changing the set of bitmap gallery fills

The Bitmap gallery on the Swatches tab provides a large selection of preset bitmaps. You can add or delete a bitmap or an entire category (covered in the Swatches tab topic) or import a bitmap.

To import a bitmap to the Swatches tab’s bitmap fill gallery:

1. Choose the category to which you want to add a bitmap.

2. Right-click any thumbnail and choose Add. The standard Import Picture dialog appears.

3. Use the dialog to locate the bitmap image file to import, and click Open.

A bitmap thumbnail appears, labeled with the image file name, in the selected gallery.

Setting the default fill

See Updating and saving defaults for more details.

Gradient and bitmap fills