Ask AI
Skip to main content

Add title ui element to vertical list

Function: Add Title UI Element to Vertical List

This function allows you to easily add a new title or heading to a "Vertical List" UI element within your application. It's perfect for structuring content, creating sections, or adding clear headings to dynamic lists.

Input

  • List UI Element (Type: PART, Subtype: vertical-list, Required): The specific "Vertical List" UI element on your page where you want to add the title. You'll typically select this from your existing UI elements.
  • Title (Type: STRING, Required): The actual text you want to display as the title.
  • Level (Type: NUMBER, Optional): This determines the heading level of your title, similar to H1, H2, H3 in web pages. A lower number (e.g., 1) usually means a larger, more prominent title, while a higher number (e.g., 3) indicates a smaller sub-heading. If not specified, it defaults to 1.
  • Size Y (Type: NUMBER, Optional): This sets the vertical height (in pixels) of the title element within the list. If not specified, it defaults to 30 pixels.

Output

This function does not produce a direct output value that can be used in subsequent steps. Its action is to modify the specified "List UI Element" by adding the new title directly to it.

Execution Flow

Real-Life Examples

Here are a few ways you can use the "Add Title UI Element to Vertical List" function:

Example 1: Adding a Main Section Title to an Empty List

Imagine you have a "Vertical List" UI element named ProductDetailsList on your product page, and you want to add a main heading for the product specifications.

  • Inputs:
    • List UI Element: ProductDetailsList
    • Title: "Product Specifications"
    • Level: 1
    • Size Y: (Left blank, will use default 30 pixels)
  • Result: The ProductDetailsList UI element will now display "Product Specifications" as a prominent main heading at the top.

Example 2: Adding a Sub-Section Heading within an Existing List

You have a "Vertical List" UI element named CustomerFeedback that already contains several customer reviews. You want to add a sub-heading to separate positive feedback from negative feedback.

  • Inputs:
    • List UI Element: CustomerFeedback
    • Title: "Positive Reviews"
    • Level: 2
    • Size Y: (Left blank, will use default 30 pixels)
  • Result: A new sub-heading "Positive Reviews" will be added to the CustomerFeedback list, appearing slightly smaller than a level 1 title, helping to organize the content.

Example 3: Adding a Title with Custom Height

You're building a dashboard and have a "Vertical List" UI element named DashboardWidgets. You want to add a title for a specific widget section, and you need it to have a slightly larger vertical space.

  • Inputs:
    • List UI Element: DashboardWidgets
    • Title: "Sales Performance Overview"
    • Level: 1
    • Size Y: 50
  • Result: The DashboardWidgets UI element will include "Sales Performance Overview" as a main title, occupying 50 pixels of vertical space, making it stand out more.