The viewport size determines the height or thickness of the bar. Set the width on the AlexaProgressBar component itself, or on its parent Container. Use the base component width property to control the length of the progress bar. Use the standard width property on AlexaProgressBar or on its parent Container to determine the size of the bar. Note: The total time doesn't determine the width of the bar drawn on the screen. For example, set totalValue to 100,000 to create a progress bar that represents 1 minute, 40 seconds of time. Value in milliseconds for the total duration the progress bar represents. The selected theme controls the colors used for the component. For details about updating this property to show ongoing progress, see Advancing a determinate progress bar. Applies when progressBarType is determinate. The progress bar represents this value by filling in with the color specified in progressFillColor. Value representing the amount of time that has passed for a determinate progress bar. Indeterminate – the progress bar displays an animation indicating ongoing activity, but the bar isn't connected to color to indicate progress of a determinate progress bar. You update the progressValue property with the elapsed time to fill the bar. Set to determinate or indeterminate.ĭeterminate – the bar represents a set amount of time. Therefore, explicitly set this property when needed.įor more details about support for right-to-left languages in the responsive components, see Support for Right-to-left Languages.ĭetermines the type of progress bar to display. This property doesn't inherit the layoutDirection from the component's parent container. Set this property to either LTR (left-to-right) or RTL (right-to-left). Specifies the layout direction for the progress bar. When true, display an animation in the unfilled portion of a determinate progress bar to indicate that content is loading. Applies when progressBarType is determinate and isLoading is false.Īrray of entity data to bind to this component. The buffer bar is visible when the bufferValue is larger than progressValue. The progress bar represents this value by filling in with a lighter color. Value representing the amount of buffer time that has passed for a determinate progress bar. Voice over reads this string when the user selects this component. Nameįor example: "20 seconds out of 2 minutes."Ī string describing the progress bar. For details about viewport profiles, see Viewport Profiles.Īll parameters except type are optional. The "Widget support" column indicates the widget viewport profiles that support each parameter. Unless otherwise noted, standard viewport profiles support all parameters. The following table shows the parameters you can set on AlexaProgressBar. AlexaProgressBar was introduced in version 1.2.0. The latest version of the alexa-layouts package is 1.7.0. To use AlexaProgressBar, import the alexa-layouts package. When used within a widget, AlexaProgressBar doesn't support the right-to-left orientation ( layoutDirection). Widget Medium ( All standard viewport profiles in the alexa-viewport-profiles package:įor details about viewport profiles, see Viewport Profiles.The following widget viewport profiles in the alexa-viewport-profiles package:.CompatibilityĪlexaProgressBar is designed to work with the following viewport profiles: You can choose from different styles to communicate different types of activity progress. The Alexa progress bar responsive component ( AlexaProgressBar) displays a progress bar to indicate ongoing activity. alexa-presentation-language/apl-alexa-progress-bar-layout.html Widget Information in the Skill Request.APL Visual Context in the Skill Request.Viewport Object in the Data-binding Context.Best Practices for Screen Reader Support.Build APL Visuals that Support Screen Readers.Build Responsiveness into Your Templates.Host Layouts, Graphics, and Other Resources in an APL Package.Synchronize Spoken Text with Text on the Screen.Combine Visual Content with Alexa Speech and Audio.Combine Content with Backgrounds, Borders, and Headers. Support Devices with Character Displays.Select the Viewport Profiles Your Skill Supports.Support Tablets and Other Devices that Can Change Size.Experiment with APL Examples in the Authoring Tool.Import a Scalable Vector Graphic (SVG) (Beta).Build Documents in the Developer Console.Test APL Skills in the Developer Console Simulator.Configure Your Skill with the APL Interface.Create Visual Experiences for Your Skill.Test APL Examples with the Code Sandbox.Tutorial: Add Your First Visual Response to a Custom Skill.
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |