Introduction to LiveCode Create

Welcome to LiveCode Create, the intuitive platform for building responsive, data-driven apps without writing extensive code. Whether you're creating a business application, a personal project, or a prototype, LiveCode Create empowers you to design, connect data, and add logic—all in one streamlined environment.

This guide provides a quick introduction to LiveCode Create and walks you through creating your first simple app.

---

What is LiveCode Create?

LiveCode Create is a no-code and low-code app development platform that lets you build powerful apps with ease. Here's what you can do with it:

• Design User Interfaces (UI):

  • Use the drag-and-drop Tools Palette to create layouts with widgets like buttons, text fields, and lists.
  • Build responsive designs that adapt to desktop, tablet, and mobile screens.

• Work with Data:

  • Manage your app’s data with built-in Collections (data storage) and Data Views (filtered or joined subsets of data).
  • Link data to widgets through Data Binding for seamless integration.

• Add App Logic:

  • Use the Actions Workflow to define what happens when users interact with your app.
  • For advanced users, write custom scripts using LiveCode’s easy-to-learn scripting language.

---

Quick Start: Build a Simple To-Do List App

Let’s create a basic To-Do List App to get you started with LiveCode Create.

Step 1: Create a New Project

1. Open LiveCode Create and click Create New Project on the dashboard.
2. Enter a name for your project (e.g., "To-Do List") and click Create.

---

Step 2: Design the Layout

1. Add a Header:

   • Drag a Label Widget from the Tools Palette onto your canvas.
   • Use the Property Inspector to set the label text to “To-Do List” and adjust its font size.

2. Add an Input Field and Button:

   • Drag a Text Field Widget onto the canvas for entering tasks. Set its placeholder text to “Enter a task.”
   • Drag a Button Widget next to the text field and set its label to “Add Task.”

3. Add a Simple List Widget:

   • Drag a Simple List Widget below the input field and button. This will display the tasks in your list.

---

Step 3: Connect Data to Your App

1. Create a Collection:

   • Click the Data Tab in the left-hand menu.
   • Create a new Collection named “Tasks.”
   • Add a single field called “Task Name” (Text).

2. Bind the Simple List to the Collection:

   • Select the Simple List Widget.
   • In the Property Inspector, go to the Data Tab and bind the list to the “Tasks” collection.
   • Map the “Task Name” field to the primary text of the list.

---

Step 4: Add Logic to the App

1. Create an Action for the Add Task Button:
   • Select the Add Task Button and open the Actions Tab in the Property Inspector.
   • Create a new workflow:
     1. Set the trigger to onMouseUp (when the button is clicked).
     2. Add a Create Record Action Block:
        • Target the “Tasks” collection.
        • Bind the “Task Name” field to the text of the input field widget.
     3. Add a Set Property Action Block (if available):
        • Clear the input field by setting its text to an empty string ("").

---

Step 5: Test Your App

1. Switch to Run Mode:

   • Click the Run Button at the top of the IDE to test your app.
   • Enter a task in the input field, click the "Add Task" button, and see it appear in the list.

2. Preview Your App:

   • Use the Preview Button to test the app in a browser.

---

What’s Next?

Congratulations! You’ve built your first app in LiveCode Create. Here are some next steps to continue learning:

• Learn About Data Binding
• Explore Responsive Layouts
• Add Advanced Logic with Actions

With LiveCode Create, the possibilities are endless. Experiment with widgets, add logic, and explore data integrations to build the app of your dreams.

---