Overview
Coursera Flash Sale
40% Off Coursera Plus for 3 Months!
Grab it
Learn to build interactive rotating dial components using DragHandler and JavaScript functions in this 10-minute Qt Quick tutorial. Master the creation of complex interactive components by implementing DragHandler to detect and manage drag actions, then enhance functionality with inline JavaScript functions. Start by creating a DeviceDial component, then explore the DragHandler QML Type and discover how to integrate JavaScript functions within QML. Implement DragHandler with custom rotation functions, troubleshoot rotation angle issues, and complete the project by adding two additional dials. This hands-on tutorial provides practical experience with advanced Qt Quick interactive controls, perfect for developers expanding their UI toolkit or designers bringing interactive concepts to life. Access the complete code repository and continue your Qt Quick journey through the full learning path available at Qt Academy.
Syllabus
Introduction
Creating the DeviceDial component
Introducting the DragHandler QML Type
JavaScript Functions in QML
Implementing the DragHandler with function for rotation
Fixing rotation angle issue
Finalising with two more dials
Summary and Final words
Taught by
Qt Group