Using Qt 3D to visualize music

As the development of the Qt 3D module is proceeding we wanted to give it a try and test how one could visualize music using the module. The result of this experiment was a new example, Audio Visualizer Example, to the Qt 3D module.

https://youtu.be/s3YbFr2IVSo

The example shows how you can use Qt 3D rendering with Qt Quick elements. The 3D content is rendered using the Scene3D type. The bars are objects in NodeInstantiator and they are animated to visualize the magnitude of the music played. On top of the scene we’ve placed buttons to pause/play and to stop the music. These buttons are Qt Quick elements. The music is played using MediaPlayer provided with Qt Multimedia module.

In the example there’s a curve shaped 3D entity to show the progress based on the duration of the played track. There’s also a prism 3D entity to show the title of the example and the song. The prism shows the title of the song while the song is played and the title of the example becomes visible when the playing is stopped. The titles are placed on different edges of the prism and the angle of the prism is animated once the title needs to be changed.

If you want to give the example a try you can find it from codereview.qt-project.org under examples\qt3d\audio-visualizer-qml. We are aware that there are still some improvements that could be made to the backend performance to make the animation of the bars smoother, but as Qt 3D is Technology Preview in the upcoming Qt 5.6 release these improvements are more than likely.

This example was created to give some ideas of what you can achieve using Qt 3D. We hope you like it!


Blog Topics:

Comments