Progress Dots

Note: Register now for Alexa Live, Amazon’s annual Alexa developer conference on July 20, 2022.

The Alexa progress dots responsive component (AlexaProgressDots) displays animated dots to indicate an action is in progress.

Import the alexa-layouts package

The latest version of the alexa-layouts package is 1.5.0. AlexaProgressDots was introduced in version 1.2.0.

All parameters except type are optional.

Name	Type	Default	Description	Version added/updated
`accessibilityLabel`	String	accessibilityLabel	An accessibility label to describe the progress dots to customers who use a screen reader.	1.2.0
`componentId`	String	AlexaProgressDots	A unique ID for this component. Provide a separate, unique ID for each instance of `AlexaProgressDots` in the same document.	1.2.0
`dotSize`	Dimension	32dp	Size of the progress dots.	1.2.0
`entities`	Array	[]	Array of entity data to bind to this component.	1.2.0
`theme`	String	dark	Set the dark or light color theme. The selected theme controls the colors used for the component.	1.2.0

{
  "type": "AlexaProgressDots",
  "dotSize": "72dp",
  "componentId": "largeDotsId",
  "spacing": "@spacingMedium"
}

This example illustrates a complete document that displays progress dots in different sizes.

To see the animation, copy the sample JSON into the authoring tool.