Important: Please read the Qt Code of Conduct -

QML Form in WebAssembly App?

  • I came across this post when trying to search for app ideas: . 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:

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

  • 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