hml/container/list.json

{
  "name": "list",
  "version": [
    {
      "name": "v3.0"
    }
  ],
  "description": [
    {
      "name": "The <list> component provides a list container that presents a series of list items arranged in a column with the same width. Lists support presentations of the same data in a multiple and coherent row style, for example, images and texts."
    }
  ],
  "attributes": [
    {
      "name": "cachedcount",
      "required": false,
      "description": [
        {
          "name": "Minimum number of cached list-items when the long list is loaded with delay. When the number of list-items cached outside the visible area is less than the value of this attribute, a requestitem event is triggered."
        }
      ],
      "type": "number"
    },
    {
      "name": "dir",
      "required": false,
      "description": [
        {
          "name": "Specify the text direction of an element."
        }
      ],
      "type": "enum",
      "options": [
        {
          "name": "ltr"
        },
        {
          "name": "rtl"
        },
        {
          "name": "auto"
        }
      ]
    },
    {
      "name": "scrollbar",
      "required": false,
      "description": [
        {
          "name": "Display mode of the side scroll bar. (Currently, only the vertical scroll bar is supported.) off: No display; auto: Displayed on demand (The side scroll bar is displayed when you touch it and disappears 2s later.); on: Always displayed."
        }
      ],
      "type": "enum",
      "options": [
        {
          "name": "off"
        },
        {
          "name": "auto"
        },
        {
          "name": "on"
        }
      ]
    },
    {
      "name": "scrolleffect",
      "required": false,
      "description": [
        {
          "name": "Scroll effect. Available values are as follows: spring: Similar to the physical dynamic effect of a spring. After scrolling to the edge, you can continue to scroll for a distance based on the initial speed or by using a touch event. After you release your hand, the screen is rebounded; fade: Similar to the physical dynamic effect of fade. When you scroll to the edge, a wave shape fades. The fade changes according to the speed and scrolling distance; no: No effect after the scroll bar is moved to the edge."
        }
      ],
      "type": "enum",
      "options": [
        {
          "name": "spring"
        },
        {
          "name": "fade"
        },
        {
          "name": "no"
        }
      ]
    },
    {
      "name": "divider",
      "required": false,
      "description": [
        {
          "name": "Whether list items are separated by dividers.For details about divider styles, see divider-color, divider-height, divider-length, and divider-origin in the Styles table."
        }
      ],
      "type": "enum",
      "options": [
        {
          "name": "true"
        },
        {
          "name": "false"
        }
      ]
    },
    {
      "name": "shapemode",
      "required": false,
      "description": [
        {
          "name": "Shape of the side scroll bar. default: Not specified (following the theme); rect: Rectangle; round: Circle."
        }
      ],
      "type": "enum",
      "options": [
        {
          "name": "default"
        },
        {
          "name": "rect"
        },
        {
          "name": "round"
        }
      ]
    },
    {
      "name": "updateeffect",
      "required": false,
      "description": [
        {
          "name": "Whether a dynamic effect is displayed when an item in the list is deleted or added. false: No dynamic effect is displayed; true: A dynamic effect is displayed when an item is added or deleted."
        }
      ],
      "type": "enum",
      "options": [
        {
          "name": "true"
        },
        {
          "name": "false"
        }
      ]
    },
    {
      "name": "initialindex",
      "required": false,
      "description": [
        {
          "name": "Item displayed at the start position of the viewport when the current list is loaded for the first time. The default value is 0, indicating that the first item is displayed. If the number you set is greater than the index of the last item, the setting does not take effect. When the initialoffset attribute is set, the current attribute does not take effect."
        }
      ],
      "type": "number"
    },
    {
      "name": "initialoffset",
      "required": false,
      "description": [
        {
          "name": "The start offset of the viewport when the current list is loaded for the first time. The offset cannot exceed the scrolling range of the current list. Otherwise, the offset is truncated to the maximum value of the scrolling range."
        }
      ],
      "type": "length"
    },
    {
      "name": "selected",
      "required": false,
      "description": [
        {
          "name": "Selected item in the current list. The value can be a section value of any list items."
        }
      ],
      "type": "string"
    },
    {
      "name": "id",
      "required": false,
      "description": [
        {
          "name": "Unique ID of a component."
        }
      ],
      "type": "string"
    },
    {
      "name": "style",
      "required": false,
      "description": [
        {
          "name": "Style declaration of a component."
        }
      ],
      "type": "string"
    },
    {
      "name": "class",
      "required": false,
      "description": [
        {
          "name": "Style class of a component, which is used to refer to a style table."
        }
      ],
      "type": "string"
    },
    {
      "name": "disabled",
      "required": false,
      "description": [
        {
          "name": "Whether the component is disabled. If the component is disabled, the component cannot respond to user interaction."
        }
      ],
      "type": "enum",
      "options": [
        {
          "name": "true"
        },
        {
          "name": "false"
        }
      ]
    },
    {
      "name": "voicelabel",
      "required": false,
      "description": [
        {
          "name": "Voice label. When a voice label is triggered, the click event of the component is triggered. NOTE: The voice label takes effect only when the click event is set."
        }
      ],
      "type": "string"
    },
    {
      "name": "subscriptflag",
      "required": false,
      "description": [
        {
          "name": "Voice subscript switch. Available values are as follows: auto: For the <image> and <list-item> components, if subscriptflag is set to auto, the voice subscript is turned on. For other components, if subscriptflag is set to auto, the voice subscript is turned off. on: Turn on the voice subscript. off: Turn off the voice subscript. If no customized subscript is set, the subscript is automatically accumulated from 1. NOTE The voice subscript takes effect only when the click event is set."
        }
      ],
      "type": "enum",
      "options": [
        {
          "name": "auto"
        },
        {
          "name": "on"
        },
        {
          "name": "off"
        }
      ]
    },
    {
      "name": "subscriptlabel",
      "required": false,
      "description": [
        {
          "name": "Custom subscript. After it is set, the subscript is displayed in the way you specified. To make this attribute take effect, you need to turn on the voice subscript."
        }
      ],
      "type": "string"
    },
    {
      "name": "scenelabel",
      "required": false,
      "description": [
        {
          "name": "Available values are as follows: video: Video scenario. For example, to watch a video, a user can say the voiceLabel (usually the video name), play voiceLabel, see voiceLabel, or watch voiceLabel, etc. audio: Music scenario. For example, to listen to a song, a user can say the voiceLabel (usually the song name), play voiceLabel, or listen voiceLabel, etc. page: Page scenario. For example, to go to a page, a user can say the voiceLabel (usually the page name), switch to voiceLabel, go to voiceLabel, or jump to voiceLabel, etc. switch: Switch scenario. For example, to turn on or turn off a switch, a user can say the voiceLabel (usually the switch name), turn on voiceLabel, open voiceLabel, turn off voiceLabel, close voiceLabel, etc. common: Common scenario, which is triggered by the voiceLabel."
        }
      ],
      "type": "enum",
      "options": [
        {
          "name": "video"
        },
        {
          "name": "audio"
        },
        {
          "name": "page"
        },
        {
          "name": "switch"
        },
        {
          "name": "common"
        }
      ]
    },
    {
      "name": "accessibilitygroup",
      "required": false,
      "description": [
        {
          "name": "Accessibility group. If this attribute is set to true, the component and all its child components form an entire selectable component, and the accessibility service will no longer available for the content of its child components."
        }
      ],
      "type": "enum",
      "options": [
        {
          "name": "true"
        },
        {
          "name": "false"
        }
      ]
    },
    {
      "name": "accessibilitytext",
      "required": false,
      "description": [
        {
          "name": "Accessibility text. If a component does not contain text information, it will not be read when the component is selected by the screen reader. In this case, the screen reader user cannot know which component is selected. To solve this problem, you can set this attribute for components without text information. When the component is selected by the screen reader, the specified accessibility text will be read, informing the user which component is selected. If a component with this attribute set contains text information, only the accessibility text will be read."
        }
      ],
      "type": "string"
    },
    {
      "name": "accessibilitydescription",
      "required": false,
      "description": [
        {
          "name": "Accessibility description. You can specify further explanation of the current component, for example, possible operation consequences, especially those cannot be learned from component attributes and accessibility text. You can set a detailed description text for the attribute of the component to help users understand the operation to be performed. If a component contains both text information and the accessibility description, the text is read first and then the accessibility description, when the component is selected."
        }
      ],
      "type": "string"
    },
    {
      "name": "accessibilityimportance",
      "required": false,
      "description": [
        {
          "name": "Accessibility importance, which is used to decide whether a component can be identified by the accessibility service. The value can be auto, yes, no, or no-hide-descendants. The last value forces the screen reader to ignore the current component and all its subcomponents. yes: The current component is selectable for the accessibility service. no: The current component is not selectable for the accessibility service."
        }
      ],
      "type": "string"
    },
    {
      "name": "for",
      "required": false,
      "description": [
        {
          "name": "Expands the current element based on the configured data list."
        }
      ],
      "type": "string"
    },
    {
      "name": "tid",
      "required": false,
      "description": [
        {
          "name": "The tid attribute is used to accelerate the for loop. It is used to improve the re-rendering efficiency when data in a loop changes. The tid attribute specifies the unique ID of each element in the array. If it is not specified, the index of each element in the array is used as the ID. For example, tid='id' indicates that the id attribute of each element is its unique identifier."
        }
      ],
      "type": "string"
    },
    {
      "name": "if",
      "required": false,
      "description": [
        {
          "name": "Whether the element is added or removed."
        }
      ],
      "type": "enum",
      "options": [
        {
          "name": "true"
        },
        {
          "name": "false"
        }
      ]
    },
    {
      "name": "elif",
      "required": false,
      "description": [],
      "type": "enum",
      "options": [
        {
          "name": "true"
        },
        {
          "name": "false"
        }
      ]
    },
    {
      "name": "else",
      "required": false,
      "description": [],
      "type": "string"
    },
    {
      "name": "show",
      "required": false,
      "description": [
        {
          "name": "Whether the element is displayed or hidden."
        }
      ],
      "type": "enum",
      "options": [
        {
          "name": "true"
        },
        {
          "name": "false"
        }
      ]
    }
  ],
  "events": [],
  "supportedSubComponents": true,
  "supportedSubComponentsRestriction": [
    {
      "name": "list-item",
      "level": 2
    }
  ],
  "unSupportSubComponentsRestriction": [],
  "parentComponentsRestriction": []
}