BYU Home pageBRIGHAM YOUNG UNIVERSITY
  Office of Digital Humanities
Back     BYU LiveCode Lessons Gateway

Computers & the Humanities 210
Aligning Objects in LiveCode

Objectives

By the end of this reading you should be familiar with:

  1. The basic tools available for aligning objects in LiveCode.
  2. How to distribute objects in a uniform way on a card.

LiveCode Tools for Aligning Objects

Often you will want to line objects up or make them uniform in some way in order to create a neater appearance on your card. For example, you may want your navigation buttons to be all the same size or be lined up horizontally along an invisible line. LiveCode provides tools and capabiliies that make this easy.

Menu Commands

Several useful commands are available from the Object menu. To access these menu items, select two or more objects that you want to align (Shift-click the objects or drag with the Pointer tool to enclose the objects you want to select), then choose Align Selected Controls from the Object menu. The following submenu items are then available:

Align Objects Panel of the Property Inspector

If you need to do more extensive aligning of objects it may be more convenient to use the Align Objects panel in the Property Inspector. This option is available as a choice every time more than one object is selected with the pointer tool.

This portion of the inspector contains several sets of tools that allow you to fine-tune the alignment of objects on your card. Remember: The first object selected is employed by LiveCode as the anchor or object of reference in terms of placement and dimensions.

  • Equalize:(left to right) Anchor is the first object selected.
    • Make Widths Equal: Make all widths same as anchor.
    • Make Heights Equal: Make all heights same as anchor.
    • Make Rects Equal: Gives all objects the same dimensions and location as anchor.
  • Align: (left to right; clockwise from left) Anchor is first object selected.
    • Align Objects Left: Align all to left edge of anchor.
    • Align Objects Top: Align all to top edge of anchor.
    • Align Objects Right: Align all to right edge of anchor.
    • Align Objects Bottom: Align all to bottom edge of anchor.
    • Align Objects Center: Align vertical axis with vertical axis of anchor.
    • Align Objects Middle: Align horizontal axis with horizontal axis of anchor.
  • Distribute: (left to right) Designate equal distribution of objects across a predetermined area.
    • Distribute Horizontally: Distributes objects according to parameters selected along the horizontal axis.
    • Distribute Vertically: Distributes objects according to parameters selected along the vertical axis.
      There are three choices as to the parameters under which the distribution operates:
      • First to Last Selected: Distributes objects in the order in which they were selected. The first and last objects selected stay in place, and the intervening objects are distributed between them with equal amounts of space separating them.
      • Edge to Edge: Puts objects edge to edge against each other, in the order selected.
      • Across Card: Equally distributes objects across the dimension of the card, in the order selected.
  • Nudge: Nudge the selected objects in four directions for fine placement. The number in the middle is the distance in pixels the objects will move.
  • Relayer Tools: (left to right) Re-order the object layers.
    • Relayer Down: Re-order from 1 to n in the order selected.
    • Relayer Up: Re-order from n down to 1 in the order selected.

Summary

These tools, used in conjuction with the dimension properties of an object, make it easy for you to arrange your objects neatly and symmetrically on your card.


Back     BYU LiveCode Lessons Gateway
Maintained by Devin Asay.
Copyright © 2005 Brigham Young University