Using Widgets

Widgets were intoduced in LiveCode 8. Widget add extensibility to the LiveCode control set by allowing antyone to create new, atomic controls for LiveCode. Widgets are more stable and efficient than custom controls created using groups. Widgets are also simple to install and use in LiveCode.

Introduction

Widgets can be simple or complex and can provide a wide range of features and functionality.

You will see your set of widgets, both built-in and user installed, at the top of the Tools Palette.

Adding widgets to your stack

In this example we will add an SVG widget.

  1. Create a new mainstack
  2. Drag an SVG widget to the stack
  3. Drag the widget out to make it larger
  4. Open the Property Inspector for the widget
    1. Choose a preset path
    2. Set the rotation to 30
    3. Got to the Colors pane and set the Hilite color

Each widget will have a unique set of properties, defined by the developer who wrote the widget. There is a set of basic properties that all widgets have inlcuding name, visible, disabled, left, top, right, bottom, layer, textFont, textSize and some others.

Widget Messages

Like classic controls widgets also receive, and can respond to messages. The messages that a widget receives are defined by the developer.

The SVG widget responds to mouseUp, but does not have any custom messages.

Open the Script Editor for the widget, you will see it has a default mouseUp handler which toggles the hilied state of the widget.

on mouseUp
   -- Toggle the hilited property when clicked
   set the hilited of me to (not the hilited of me)
end mouseUp

Switch to Run mode and test it. The SVG widget should change color, from the normal color to the hilited color and back, when you click it and the hilited property toggles.

Including Widgets in Standalones

You need to make sure any widgets you use in your stack are included when you build a standalone.

If you leave your Standalone Application Setting on "Search for required inclusions" any widgets you used should be automatically included.

If you use "Select inlcusions" make sure you go to the Inclusions pane and tick any widgets you want to inlclude.

Widget Documentation

The documentation for widgets is inlcuded in the Dictionary. In the Dictionary choose the API tab and select the widget you are interested in from the drop down.

0 Comments

Add your comment

E-Mail me when someone replies to this comment