Caution: moving the cursor before releasing the mouse button will make the line curved, not perfectly straight.
You can always create a straight segment (or a curved segment with only a single curve handle) by releasing the mouse button without moving the cursor.
Double-click on a bezier shape to edit it. Alternatively, you can also select the shape first and then click on the “Edit” tool in the toolbar.
Beziers that are not closed can be extended from both ends. To extend a bezier:
To add a new control point in the middle of a bezier, simply click at the point where you want to add the new control point. This will split the curve at that particular point to two curves, maintaining the original curvature.
You can move individual control points around by dragging them with the cursor. WebCode will help you draw sharp drawings by aligning control points to certain positions. This behavior depends on your stroke and stroke width settings, so it is always a good idea to set these settings to final values before moving the control points.
Don't worry, even if you forget to do so, you can always fix it later. But if, for example, you draw your bezier with stroke width = 1, and later change it to stroke width = 2, your drawing will not be as crisp as it could be. To fix this, you will have to readjust the control points manually, since WebCode does NOT automatically rearrange all control points when you change the stroke settings.
Without any modifier key pressed the control point will be “crisp” at the new position (by snapping to the nearest “crisp” coordinate).
With OPTION pressed, the dragged control point will lie in the half-point grid when released.
With COMMAND pressed, the snapping behavior of the dragged control point is suppressed entirely - the control point will be at an arbitrary position when released.
The dragged control point will also snap to coordinates of other control points to help you out. However, you can turn this behavior off by holding down the CONTROL key.
It is also possible to move the control points around using the keyboard. First, select a control point by clicking on it. Then, press an ARROW key to move it. By default, this moves the control point by a single point. To move the control point more quickly, hold down the SHIFT key while pressing the ARROW key. This moves the control point by multiples of 10. You can also move the control point by half-points - just hold down the OPTION key while pressing the ARROW key.
Curve handles can be adjusted by dragging them. If the control point and both of its handles are aligned, the opposing curve handle will move together with the handle you are dragging to preserve the alignment. To suppress this behavior, press OPTION while dragging.
On the other hand, if the control point and its curve handles are not aligned, the handles will move independently. In such cases, pressing OPTION will force the opposing handle to align.
In order to snap curve handle to horizontal, vertical and diagonal lines, press SHIFT while dragging it.
A control point does not always have both curve handles. For example, in the case of a line or polyline, the control points do not have any curve handles. You can add and remove curve handles to a bezier at any time.
To remove a curve handle, select it by clicking on it and press DELETE or BACKSPACE.
To add both curve handles to a control point, select the “Make Point Round” option in the control point context menu. To remove both curve handles, select the “Make Point Sharp” option.
WebCode supports 3 boolean operations: union, intersection and difference. Using them is simple. First, select two or more shapes from the Canvas. Then, click on the desired operation icon in the toolbar or use one of the “Selection / Union”, “Selection / Intersection” and “Selection / Difference” options from the application menu.
WebCode will create the resulting shape. This shape will take its appearance settings (such as stroke, fill, ...) from the bottommost original shape. All original shapes will remain intact.