For this demonstration I have a sample app consisting of 2 cards. On the first card we need a label field with some basic instructions (1), a Pattern Lock Widget (2) and a Set button (3). Enter the instructions for the label field into its Contents tab in the Property Inspector and on the first pane uncheck visible next to "show border ". Right click on the button to bring up the Property Inspector and enter "Set" as both its name and its label. Right click on the widget and in its Property Inspector name it "Register".

On the second card we need a label field, (1), a Pattern Lock Widget (2), a login button (4), a back button (5) and there is also an output field (3) just so we can see something happening. Name the output field "messages" in the Property Inspector. Name the Pattern Lock Widget "login".

Open up the Script Editor and enter this code (don't forget to hit Apply):

on mouseUp pButtonNumber
   local tPin
   put the PIN of widget "Register" into tPin
   if the length of tPin < 4 then
      answer "At least 4 points required"
   else
      set the cPin of this stack to tPin
      go next card
   end if
end mouseUp

This is fairly self explanatory. When the user lets go of the mouse after drawing their pattern, the result is analysed. PIN is a property of the Pattern Lock widget, where the sequence is stored. We've instructed the user to pick a pin longer than 4 digits, so if they let go on 3 or less, they will see the message "At least 4 points required". If the PIN is long enough then we store the number in tPin, a local variable, and set the custom property cPin to tPin. In contrast to tPin, cPin is visible to the whole stack. Finally, we go to the next card.

Open up the Script Editor and enter this code:

on mouseup
   if the PIN of widget "Login" is the cPin of this stack then
      answer "Success! Pin is correct"
   else
      answer "Incorrect PIN, please try again"
   end if
end mouseup

Again, pretty self explanatory. When the user draws the pattern on the second widget, it is stored in the PIN property. We check if this matches the cPin custom property we saved on the previous card. If it matches, a success dialog is shown. If not, a try again dialog appears.

We have also applied a piece of code directly to the widget on card 2. This is:

on InputComplete pPIN
   if the length of pPIN < 4 then
      answer "At least 4 points required" 
   else
      put pPIN into field "message"
   end if
end InputComplete

  This is again performing a length check on the entered pin, and allowing us to see the pin after the user enters it. Obviously, this isn't something you'd often want to put in your app, but its helpful here to see that the widget is operating as we expect.

In order to repeat the process without resorting to "go previous card" in the LiveCode menu, we have a back button. Its script is simply:

on mouseup
   go previous card
end mouseup

And that's it. A working Pattern Lock widget. Handy for all sorts of login purposes.