Gradient Coloring and Illustrating Diagrams

From RAD Studio
Jump to: navigation, search

Go Up to Modeling Concepts


In Diagram View, you can improve the view of your diagrams:

  • Color gradients -- you can use linear color gradients to paint diagram elements and the diagram background.
  • Background image -- you can use images to draw the diagram background. Thus you can illustrate your diagrams.


Using images to fill the background of diagrams

Open the Modeling > (level) > Diagram > Appearance page of the Options dialog box (Tools > Options). It contains several options managing usage of images to fill the background of diagrams.

Diagram background image file -- use this option to specify files storing the images to be used to fill the diagram backgrounds.

Diagram background image mode -- set the Backdrop value to draw the image behind the diagram elements. If you set it to Overdrop, the image draws in front of diagram elements; therefore, the image will obscure diagram elements. To make diagram elements partially visible through the image, use the Diagram background image transparency option. Possible values are between 0 and 1. When its value is 0, the image is totally transparent and does not hide diagram elements. When its value is 0.5, the image is half-transparent and partially hides diagram elements.

Gradient Coloring

In general, a linear color gradient is specified by two points, and a color at each point. The colors along the line between these points are calculated using linear interpolation, then extended perpendicular to that line. Thus, colors produced by a gradient vary continuously with position, producing smooth color transitions.

You can use linear color gradients to fill nodes and background of diagrams.

Using gradient coloring to fill background of diagrams

Open the Modeling > (level) > Diagram > Appearance page of the Options dialog box (Tools > Options). It contains several gradient coloring options.

Diagram background gradient ON -- set it to True to use the linear gradient coloring for the diagram background.

Diagram background gradient mode -- defines Horizontal or Vertical direction of gradient coloring:

  • Horizontal -- defines the horizontal direction of the linear color interpolation. Diagram background color defines the color used on the left border and Diagram background gradient color defines the color used on the right border of diagrams.
  • Vertical -- defines the vertical direction of the linear color interpolation. Diagram background color defines the color used on the upper border and Diagram background gradient color defines the color used on the lower border of diagrams.

Using gradient coloring to fill nodes

Open the Modeling > (level) > Diagram > Appearance page of the Options dialog box (Tools > Options). It contains the Gradient coloring of nodes group of options.

Gradient ON -- set it to True to use the linear gradient coloring of all diagram nodes.

Gradient mode -- defines Horizontal or Vertical direction of gradient coloring:

  • Horizontal -- defines the horizontal direction of the linear color interpolation. Gradient color 1 defines the color used on the left border and Gradient color 2 defines the color used on the right border of nodes.
  • Vertical -- defines the vertical direction of the linear color interpolation. Gradient color 1 defines the color used on the upper border and Gradient color 2 defines the color used on the lower border of nodes.

Gradient area -- defines which parts of node rectangles to fill with gradient colors.

  • Whole Shape -- whole node rectangles
  • Caption -- only captions of nodes
  • Caption and Compartments -- only captions and compartment names of nodes

Using gradient coloring to fill particular node

In the Diagram View or Model View, select a node; the Object Inspector shows properties of the selected node. Set the Gradient ON property to True to use linear gradient coloring of the selected node.

Gradient mode -- defines Horizontal or Vertical direction of gradient coloring:

  • Horizontal -- defines the horizontal direction of the linear color interpolation. Gradient color 1 defines the color used on the left border and Gradient color 2 defines the color used on the right border of the node.
  • Vertical -- defines the vertical direction of the linear color interpolation. Gradient color 1 defines the color used on the upper border and Gradient color 2 defines the color used on the lower border of the node.

See Also