Back to Browse

Alexa APL Tutorial - Lesson 9: ScrollView Components

756 views
Nov 30, 2021
21:18

Join Alexa Champion Mark Tucker as he discusses how to make your screen scroll when there are more child components than there is available height with the non-visual ScrollView Component in Alexa Presentation Language's (APL). A ScrollView wraps a single child component and responds to manual scrolling. ScrollView has an onScroll event and can be controlled by 3 commands: Scroll, ScrollToComponent, and ScrollToIndex. If you would like to follow along, please use this APL Ninja Link: https://apl.ninja/document/MarkTucker/dabble-lab-scroll-view-qqp2 APL ScrollView Documentation: https://developer.amazon.com/en-US/docs/alexa/alexa-presentation-language/apl-scrollview.html APL Scroll Commands: https://developer.amazon.com/en-US/docs/alexa/alexa-presentation-language/apl-standard-commands.html#scroll-command ScrollView Button Sample: https://apl.ninja/MarkTucker/scroll-view-button-wd9g You will learn various ways to control scrolling as well as a limitation of the ScrollView component. Some background information... Alexa Presentation Language (APL) is the visual design framework that allows you to build interactive voice and visual experiences on supported devices such as the Echo Show, Fire TV, some Fire Tablets, etc. APL allows you to include graphics, images, animations, slideshows, and videos to visual experiences in order to make skills more engaging and delightful to users. About Mark Tucker: Mark is an Alexa Champion. He is also a full-stack developer who’s on a mission to help businesses reach millions of customers through devices with Alexa. Mark is a Sr. Technical Director at RAIN and co-host of the Two Voice Devs podcast. He also owns Shazaml Design LLC, based in Gilbert, Arizona, and strives to help companies connect with customers via voice, our most natural form of interaction. We love hearing from you! Do you have questions? New tutorial ideas you would like to see? Comment below, and we will do our best to help out. Other Relevant Dabble Lab: Alexa APL Tutorial - Lesson 1: Introducing Containers: https://youtu.be/WDLtlEfjHnc Alexa APL Tutorial - Lesson 2: Containers Wrap Up: https://youtu.be/5AXvtS2kTQE Alexa APL Tutorial - Lesson 3: Frame Components: https://youtu.be/6nfDvF4dj9Y Alexa APL Tutorial - Lesson 4: Text Components: https://youtu.be/TvgIhoacwxE Alexa APL Tutorial - Lesson 5: Data Binding: https://youtu.be/1uvSOtp5kSo Alexa APL Tutorial - Lesson 6: Image Components: https://youtu.be/mDr-YLGSzbI Alexa APL Tutorial - Lesson 7: VectorGraphic Components: https://youtu.be/QRWVug1uA4Y Alexa APL Tutorial - Lesson 8: TouchWrapper Components: https://youtu.be/jh9RrGlOH9E Follow Us! Twitter: https://twitter.com/dabblelab?s=20 LinkedIn: https://www.linkedin.com/company/dabblelab/ Facebook: https://www.facebook.com/dabblelab GitHub: https://github.com/dabblelab Subscribe to our YouTube Channel for more tutorials to help you build custom solutions for Amazon Alexa, Twilio Autopilot, Google Assistant, and other platforms. About Dabble Lab: Dabble Lab is a company dedicated to creating tutorials to help you learn how to build custom solutions for Amazon Alexa, Google Assistant, Twilio Autopilot, and other emerging digital assistant platforms. Learn more about Dabble Lab at https://dabblelab.com. #DabbleLab #MarkTucker #APL #AlexaSkills #VoiceFirst 5:11 Positioning 6:28 Changing to other viewport sizes 11:03 Unscroll Event 12:44 Navigating the ScrollView 15:05 Scroll Command 15:24 Scroll to Component Command 17:17 Scroll to Index Command 20:40 Wrap up

Download

0 formats

No download links available.

Alexa APL Tutorial - Lesson 9: ScrollView Components | NatokHD