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

Mobile-specific Controls
and Capabilities

Controls

On the various desktop OS's LiveCode controls can be functionally identical, because mouse interaction with interface elements is essentially identical from Mac to Windows to Linux.

However, because the way we interact with mobile device interfaces is radically different from the way we interact with desktop computers—no mouse, touch screen, use of gestures, etc.—the way that mobile native controls work is also radically different from the way controls work in desktop applications. So while standard LiveCode fields, option menus, and scrollers work on mobile devices, they do not look or feel native to those devices.

To bridge this gap, LiveCode has ways of creating native mobile controls that only appear on the mobile app (or simulator.) We are going to take a look at these native controls and learn how to implement them. We looked at several of these in class, and the stack "testMobileControls.livecode" shows several examples.

Discussions of these mobile-specific controls can be found in the iOS and Android Release Notes, available through the Help menu in LiveCode. You should become familiar with these documents and know how to implement the capabilities they desribe.

Some Native Mobile Control Types:

NOTE ON SCRIPTING LANGUAGE USAGE
The mobile language syntax is much newer than the rest of the LiveCode language. Because of this there may be complexities and differences in the way mobile native controls are created and how their properties are set, as compared to the standard LiveCode control objects. You should become familiar with LiveCode's online guide to mobile-specific features, as well as the How-to Lessons on LiveCode Mobile Tasks. There are also dictionary entries for these commands, but the online guide tends to be more complete and up to date, so get in the habit of checking both sources.

The Easy Stuff - "just works"


The Little-bit-harder Stuff

Some mobile native controls require a different command on mobile vs. desktop, but it is only a single command

The More Involved Stuff

It is very difficult to emulate some mobile native controls on the desktop (or the analogous desktop controls are too different to make an automatic one-for-one mapping to controls in the mobile environment.) For this LiveCode gives us the mobileControlCreate command that allows us to dynamically create native mobile controls in the mobile environment.

This is the basic process for creating native mobile controls:

  1. Upon arriving on the card in the mobile environment, create the control.

    Syntax:

    mobileControlCreate control type, control name
    

    Where control type is the type of control to create, chosen from the following.

    And where control name is the name you give the control object for later reference.

    Example:

    local sControlID
    
    on preOpenCard
      if the environment is "mobile" then
    	mobileControlCreate "input", "nameinput"
    	put the result into sControlID -- save it for later reference
    	...
      end if
    end preOpenCard
    
  2. Use the mobileControlSet command to configure the mobile control's properties.

    Syntax:

    mobileControlSet controlID, property, value
    

    Examples:

    mobileControlSet "nameinput", "visible", true
    mobileControlSet "nameinput", "rect", "100,150,400,176"
    
  3. When leaving the card delete the native control.

    Syntax:

    mobileControlDelete control name or id
    

    Example:

    on closeCard
      if the environment is "mobile" then
        mobileControlDelete "nameinput"
      end if
    end closeCard
    

Native Controls Actions and Messages

Once a mobile native control is created you can script the way it behaves using actions and messages. Actions are essentially commands that you send to a specific control. They are generated with the mobileControlDo command. For instance, let's say you have created a native text input control that you named "myinput". You could focus on the input field, displaying the keyboard if necessary, by issuing the command:

mobileControlDo "myinput", "focus"

Mobile native controls also generate messages in the same way that other controls do. For example, when a mobile scroller object's scroll properties have changed, a scrollerDidScroll message is sent. You can write a handler for this message to control what happens when that event happens.

on scrollerDidScroll pHorScroll, pVertScroll
    lock screen
    set the hScroll of group "mapGrp" to pHorScroll
    set the vScroll of group "mapGrp" to pVertScroll
    unlock screen
end scrollerDidScroll

Functionality

Android and iOS mobile devices typically come with advanced hardware sensors and functionality like still and video cameras, GPS and other location services, audio recording and playback, and more. LiveCode gives developers access to many of these devices, with additional support being added frequently. LiveCode's online guide to mobile-specific features also describes how to access these capabilities.

We will explore these capabilities in greater depth in future lessons.


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