Scripts¶

Lucy Studio combines visual editing with standard JavaScript and platform APIs so you can implement complex logic and dynamic behavior.

What Scripts Do¶

• Implement interactions: Respond to taps, value changes, and user events in real time.
• Control widgets: Update widget properties dynamically at runtime (text, color, visibility, and more).
• Integrate data: Request data from servers and transform responses for UI.
• Control app flow: Handle page navigation, popup calls, and shared data.

Lifecycle Events¶

Lifecycle events are callbacks invoked automatically as a screen is created, used, and closed.

Global Object APIs¶

Lucy Studio provides global objects you can use immediately.

• $app (app-level control)

  • Manages app-wide settings and shared data.
  • Supports page transitions and app-level operations.
  • Common methods
    • $app.openPage(path)
    • $app.setSharedData(..) / $app.getSharedData(..)
    • $app.isAndroid() / $app.isWindows() / $app.isMacOS() / $app.isLinux()
    • $app.changeTheme(themeName)

• $form (screen-level control)

  • Controls the active screen or popup.
  • Common methods
    • $form.openPage(path)
    • $form.openStartDrawer() / $form.openEndDrawer()
    • $form.getVar(key) / $form.setVar(key, value) / $form.clearVar(key)

• $vm (data management)

  • Requests server data and manages Data Sets.
  • Common methods
    • $vm.requestData(...)
    • $vm.subscribeData(...) / $vm.cancelSubscribeData(...)
    • $vm.setDSValue(...)

• $log (debugging)

  • Writes logs during development.
  • Supports levels d, i, w, e.
  • Common methods
    • $log.d(message) / $log.i(message) / $log.w(message) / $log.e(message)

Widget Control¶

All Lucy Studio widgets are controlled through Property, Method, and Event.

1. Property

   • Represents widget state.
   • Use setProperty() to write values and getProperty() to read values.

   // Set text widget value
   txt_userName.setProperty("text", "John Doe");
   
   // Read current tab index
   let idx = tabbar1.getProperty("index");
   
   // Disable checkbox
   checkBox1.check = false;
   

2. Method

   • Executes built-in widget behavior.

   // Start timer widget
   timer1.start();
   
   // Move calendar to today
   calendar1.goToToday();
   
   // Insert item at first position in list view
   listView1.insert(0);
   

3. Event

   • Binds functions to user actions.

   function onStart(arg) {
       button1.onTap = button1_onTap;
       checkBox1.onChanged = checkBox1_onChanged;
   }
   
   function button1_onTap() {
       alert("Hello, World");
   }
   
   function checkBox1_onChanged() {
       $vm.showToastMessage("normal", "Checkbox is checked.");
   }
   

Code Sample¶

The sample below implements a basic login flow.

function onStart(arg) {
    btnLogin.onClick = btnLogin_OnClick;
}

function btnLogin_OnClick() {
    let sID = textField_ID.getText();
    let sPwd = textField_Pwd.getText();

    $vm.setDSValue("TR_LOGIN.inBlock.szID", sID);
    $vm.setDSValue("TR_LOGIN.inBlock.szPwd", sPwd);

    $vm.requestData("TR_LOGIN");
}

function onResponseUpdateAfter(dsName, pi) {
    $vm.showToastMessage("success", "Login successful.");
}

function onReceiveError(piName, code, message) {
    $log.e("[ERR] " + piName + " " + code + " " + message);
}