Home » Working with widgets » Working with Invisible Buttons

About Invisible Buttons

Adding a new Invisible Button

Renaming an Invisible Button

Changing the position of an Invisible Button

Resizing an Invisible Button

Changing the action and sound of an Invisible Button

Moving an Invisible Button Forward or Backward

Centering an Invisible Button

Deleting an Invisible Button

About Invisible Buttons:

Like Push Buttons, Invisible Buttons can perform one of several actions when clicked, such as going to the next card in a stack. Optionally, they can play a system sound. Unlike Push Buttons, however, they are Invisible. In addition, Invisible Buttons can be resized vertically.

Adding a new Invisible Button:

Choose Widget > Insert Control > Invisible Button. If the current Edit Mode is Edit Background Layer, then the Invisible Button will be added to the Background. Otherwise, it will be added to the current card.

Alternately, you can type ^⌘I.

An Invisible Button can also be added using the Widgets pull-down menu in the toolbar.
Widgets Pull Down

Renaming an Invisible Button:

  1. If the Invisible Button is located in the Background, then change the Edit Mode to Edit Background Layer. Otherwise, change the Edit Mode to Edit Card Layer. (See Changing the Edit Mode of a stack for more information regarding Edit Modes.)
  2. Click on the Invisible Button.
  3. Click the “Widget” button on top right of the Info sidebar.
    Widgets Button
  4. In the “General” section of the Info sidebar, type the new name of the Invisible Button into the Name field.
    Rename

Changing the position of an Invisible Button:

  1. If the Invisible Button is located in the Background, then change the Edit Mode to Edit Background Layer. Otherwise, change the Edit Mode to Edit Card Layer. (See Changing the Edit Mode of a stack for more information regarding Edit Modes.)
  2. Click and drag the Invisible Button to the desired destination.

    Alternately, the location can altered using the Invisible Button’s “Metrics” section of the Info side bar.

Resizing an Invisible Button:

  1. If the Invisible Button is located in the Background, then change the Edit Mode to Edit Background Layer. Otherwise, change the Edit Mode to Edit Card Layer. (See Changing the Edit Mode of a stack for more information regarding Edit Modes.)
  2. Click on the Invisible Button.
  3. Click and drag one the anchors in the desired direction.
    Anchors

    Alternately, the width and height can altered using the Invisible Button’s “Metrics” section of the Info sidebar.

Changing the action and sound of an Invisible Button:

  1. If the Invisible Button is located in the Background, then change the Edit Mode to Edit Background Layer. Otherwise, change the Edit Mode to Edit Card Layer. (See Changing the Edit Mode of a stack for more information regarding Edit Modes.)
  2. Click on the Invisible Button.
  3. Click the “Widget” button on top right of the Info sidebar.
    Widgets Button
  4. In the “Action” section of the Info sidebar, choose the action type using the “Type” pop up.
    Action Type
  5. To complement the the action with a sound, choose a system sound using the “Sound” pop up.
    Action Sound

Moving an Invisible Button Forward or Backward:

  1. If the Invisible Button is located in the Background, then change the Edit Mode to Edit Background Layer. Otherwise, change the Edit Mode to Edit Card Layer. (See Changing the Edit Mode of a stack for more information regarding Edit Modes.)
  2. Click on the Invisible Button.
  3. To move an Invisible Button one position at a time, choose Widget > Bring Forward or Send Backward.

    To move an Invisible Button in front of all other widgets in a card or the background, choose Widget > Bring to Front.

    To move an Invisible Button behind all other widgets in a card or the background, choose Widget > Send to Back.

Centering an Invisible Button:

  1. If the Invisible Button is located in the Background, then change the Edit Mode to Edit Background Layer. Otherwise, change the Edit Mode to Edit Card Layer. (See Changing the Edit Mode of a stack for more information regarding Edit Modes.)
  2. Click on the Invisible Button.
  3. To center an Invisible Button horizontally, choose Widget > Center Horizontally in Card or Center Horizontally in Background.

    To center an Invisible Button vertically, choose Widget > Center Vertically in Card or Center Vertically in Background.

Deleting an Invisible Button:

  1. If the Invisible Button is located in the Background, then change the Edit Mode to Edit Background Layer. Otherwise, change the Edit Mode to Edit Card Layer. (See Changing the Edit Mode of a stack for more information regarding Edit Modes.)
  2. Click on the Invisible Button.
  3. Press the Delete key.