User Guides and Screencasts

Screencasts (video screen capture) and quick instructions for end users to start using Pencil in just half an hour.

Working with Shapes

Screencast: Working-With-Shapes.ogv (6 mins, ~20 MB, Ogg Theora video)

How can I use the Ogg Theora video format?
Table of contents:
  1. Changing Dimension and Rotation
  2. Changing Shape Attributes
    1. Changing Common Attributes
    2. Editing Texts
    3. Changing Shape-specific Attributes
    4. Changing other Attributes
  3. Moving and Aligning Shapes
  4. Grouping and Ungrouping

This piece of texts provides you with basic guide on how to work with shapes in Pencil.

Shapes are created by dragging from the 'Shape Collections' pane and dropped into the drawing canvas on the right. After being dropped in to the canvas, shape attributes can be changed in many ways.

Changing Dimension and Rotation

Dimension: most of the shapes including rectangle, text field and dialog pane... have their dimensions changeable using the on-screen tool. To change the shape dimension, select the shape by clicking it and Pencil will show up 9 handles around the shape. Dragging each handle resizes the shape to the correspondent side.

Note: note all the shapes have the dimension changeable. You will not find these handles on non-resizable shapes like 'Plain Text' shape.

Rotation: while focusing the shape in the canvas, every click on it toggle the handle colors between blue and red. When the handles are in red, they can be used to rotate the shape around its center.

Note: While scaling and rotating the shape, handles are snapped to the grid. To disable snapping, hold the Shift key when performing the operation.

Changing Shape Attributes

Changing Common Attributes

Most of the attributes including: text color, border color, background color and text style of a shape can be changed using elements in the toolbar while focusing the shape. Batch changing of these attributes for multiple shapes at a same time is also supported.

To select multiple shapes, you can either:

Editing Texts

Both plain texts and rich texts are supported in Pencil. While rich text support is just in the experimental phase, on-screen editing for it are fully implemented.

To start editing the text content of a shape you can either:

To commit your editing task just:
In case you want to discard text changes, to cancel the editing task, press the ESC key.

Changing Shape-specific Attributes

A specific shape in Pencil may have it own set of attributes that serve its own characteristics. An example for this is the Radio Button shape which has the attribute named 'Selected' to indicate Pencil to draw the radio button in the selected mode (with a green circle inside.)

To make changes to these shape-specific attributes, use the context menu by right-clicking the shape or pressing the Context Menu key while focusing it.

Changing other Attributes

Other attributes that don't fit the toolbar and the context menu can be accessed and changed using the Property Dialog. To open this dialog, just activate the context menu for a specific shape and select the Properties menu entry.

Moving and Aligning Shapes

Moving: shapes can be moved visually using either mouse or keyboard arrow operation. While being moved using mouse, shapes are snapped to the grid. This helps arranging shapes can be done quickly and easily.

Aligning: multiple selected shapes can be aligned in a specific manner. The following manners of aligning shapes are supported:

Grouping and Ungrouping

Multiple shapes in a same logical group can be grouped using the Ctrl + G key combination the Group menu entry in the context menu. After being grouped, shapes can be moved to together as a single shape. To ungroup a grouped set of shape, focus the group and press the Ctrl + U key combination or use the Ungroup menu entry in the context menu.


For more details on how to work with shapes, please refer the screencast.