Important: Please read the Qt Code of Conduct - https://forum.qt.io/topic/113070/qt-code-of-conduct

QML Form in WebAssembly App?



  • I came across this post when trying to search for app ideas: https://blog.bitsrc.io/15-app-ideas-to-build-and-level-up-your-coding-skills-28612c72a3b1 . I want to try the Notes App with QML and WebAssembly. Would it be possible? I was thinking of trying to implement something like localStorage in JS with a custom data-type that stores users' notes in a data structure. Of course, first I need to learn how to use QML.



  • Yes, it is possible:
    https://s3.eu-west-2.amazonaws.com/wasm-qt-examples/last/qtbase/notepad/notepad.html

    You have local storage, but it is not persistent. You can get and save content to the system using QFileDialog::getOpenFileContent and QFileDialog::saveFileContent

    https://doc.qt.io/qt-5/qfiledialog.html#getOpenFileContent



  • How can I get the filesystem to work in a Qt Wasm app? Is there a command I can pass to qmake to have it give emscripten the command to take in the user's filesystem? I should need this in order to save files in a WebAssembly app.



  • @DragonOsman See my previous comment. That is the only way due to the sandbox that webassembly lives in.



  • I thought those functions save files to the local filesystem though? Not the sandbox? When I tried the notepad example (after coding it myself), I saw that the file saving functionality didn't work in the Wasm version. Emscripten has a command that you can pass to be able to take local files into the sandbox, right? Isn't there a way to pass that command through qmake?



  • getOpenFileContent is how you get content (file data) from the system into the sandbox.

    That notepad example has not been updated to use these special wasm only functions.



  • Alright, thanks for the info.

    I'll try to look for a QML example next, I guess.



  • For seeing how to make a form in QML, would looking at the QML XMLHttpRequest app (the example in the C:\Qt\Examples\Qt-5.14.0\qml\xmlhttprequest directory) help me?



  • @lorn-potter For the notes app I'm thinking I want to have a page with three buttons with C++ functions connected to them where the first would add a textarea along with a button to save a note and a button to delete a note; the second one to let the user delete a note (works the same as the aforementioned one: shows a list of notes in a modal dialog box where the user can select one or more (adjacent) notes and delete them); and the third to browse notes (of course if the user decides he/she delete a note from the list while browsing, he/she should be able to do so).

    Originally I was thinking I'd use QML but I want to try this in regular HTML, with CSS and JavaScript (I'll just write the C++ code and have Emscripten take care of the HTML and JavaScript, though). So is this possible like what I described? If so, I'd like some help with this. Thanks.


Log in to reply