Important: Please read the Qt Code of Conduct -

Qt widgets mixed with JavaScript components - is this possible? How?

  • Hallo,

    I would like to further develop an already existing application dealing with 3D scans. The existing version has a QML UI with the usual slot-signal-mechanism to interact with the 3D visualization widgets. Now, the new version should rely on a set of Javascript components (based on Bootstrap) in order to reuse existing code. However, the application should also still include a GL Widget (interacting with a scanner) and another such widget .(interacting with a 3D Library and visualization). The user should be able to control the widgets as well as the rest of the UI with the JavaScript components. How would I go about that?

    I have done some online research and cannot find anything in that regard. Coming closest was the remark in a 2013 book which states that QML does not support DOM manipulation or any feedback interaction. However, if I scrap the QML part and opt for a website approach for the whole UI, how would I include those widgets?

    It's quite important for me to be able to reuse those JavaScript components because otherwise I would be forced to implement their looks and behavior from scratch in QML and maybe at a later stage always update them accordingly when the JS components are updated. If it is not possible to mix those two, I would have to do it, but for the reason of reusability and especially maintainability I hope for a viable solution.

    Kind regards,

  • Perhaps use the QtWebkitBridge and an embedded QWebView to hold your JavaScript/HTML GUI components? The seamless back and forth between the Qt and embedded DOM is quite nice

  • Have a look at this:

    But beware, Qt is bringing a whole new shinny browser in 5.4 that will use the module QWebEngine, so you may what to check this also before coding too much with QWebKit that will get replaced by QWebEngine.

    Good luck

  • Thanks a lot, exactly what I was looking for!

Log in to reply