Text List Item (1.4.0 - 1.5.0)
(This is not the most recent version of AlexaTextListItem. Use the Other Versions option to see the documentation for the most recent version of AlexaTextListItem)
The Alexa text list item responsive component (AlexaTextListItem) displays text, formatted to display within a list.
Import the alexa-layouts package
To use AlexaTextListItem, import the alexa-layouts package.
The latest version of the alexa-layouts package is 1.7.0. AlexaTextListItem was introduced in version 1.1.0.
Use the Other Versions option at the top of this page to see documentation for different versions of AlexaTextListItem. The table of parameters notes the version of alexa-layouts in which each parameter was added.
AlexaTextListItem parameters
All parameters except type are optional.
| Name | Type | Default | Description | Version added |
|---|---|---|---|---|
|
|
String |
|
A string describing the text list item. Voice over reads this string when the user selects the item. |
1.5.0 |
|
|
Any |
|
The graphic to display to represent an 'empty' rating slot (such as an empty star). Used when |
1.2.0 |
|
|
Array |
— |
Array of entity data to bind to this component. |
1.2.0 |
|
|
Any |
|
The graphic to display to represent a 'full' rating slot (such as a full star). Used when |
1.2.0 |
|
|
Any |
|
The graphic to display to represent a 'half' rating slot (such as a half star). Used when |
1.2.0 |
|
|
Boolean |
|
When |
1.1.0 |
|
|
Boolean |
|
When |
1.2.0 |
|
|
Boolean |
|
When |
1.1.0 |
|
|
String |
|
Determines how to position the image within the bounding box. Used when the image is smaller than the bounding box. Options are bottom, bottom-left, bottom-right, center, left, right, top, top-left, top-right. This property works the same as the |
1.2.0 |
|
|
Boolean |
|
When |
1.2.0 |
|
|
String |
|
Determines how to scale the image to fit within the bounding box. Options are none, fill, best-fit, best-fill, best-fit-down. This property works the same as the |
1.2.0 |
|
|
Boolean |
|
When |
1.3.0 |
|
|
String |
— |
URI for an image to display next to the list item as a thumbnail. |
1.2.0 |
|
|
String |
|
Specifies the layout direction for the content. Set this property to either |
1.4.0 |
|
|
— |
The action to trigger when the user selects the list item. |
1.1.0 | |
|
|
String |
— |
Primary text to display for the list item. |
1.1.0 |
|
|
String |
|
The type of graphic to use for the rating. Set to |
1.2.0 |
|
|
Number |
-1 |
A numeric rating between 0 and 5. When set to a positive number, displays the number as a star rating. Set to a negative number or omit to leave off the rating. |
1.2.0 |
|
|
String |
— |
Determines whether to display a single graphical asset for the rating, or build the rating from multiple image assets. When set to |
1.2.0 |
|
|
String |
— |
Text to display next to the rating. Ignored when |
1.2.0 |
|
|
String |
— |
Secondary text for each list item. |
1.2.0 |
|
|
String |
|
The position to display the |
1.2.0 |
|
|
Any |
— |
The graphic to display to represent the rating. Used when |
1.2.0 |
|
|
— |
The width of the bounding box for the single graphic that represents the rating. Used when |
1.2.0 | |
|
|
String |
— |
Tertiary text for each list item. |
1.2.0 |
|
|
String |
|
The position to display the |
1.2.0 |
|
|
Boolean |
|
When |
1.4.0 |
|
|
String |
|
Set the dark or light color theme. The selected theme controls the colors used for the component. |
1.1.0 |
|
|
Boolean |
|
When |
1.2.0 |
|
|
String |
— |
Always set to |
1.1.0 |
AlexaTextListItem example
The following example shows an AlexaTextListItem with primaryText, secondaryText, and tertiaryText.
The following example shows an AlexaTextListItem with a thumbnail graphic and a rating. Note that both the secondaryText and tertiaryText display on the bottom.
For an example of using AlexaTextListItem in a list, see AlexaTextList.
Related topics
Last updated: Nov 28, 2023