Skip to content
  • Categories
  • Recent
  • Tags
  • Popular
  • Users
  • Groups
  • Search
  • Get Qt Extensions
  • Unsolved
Collapse
Brand Logo
  1. Home
  2. Qt Development
  3. Qt for WebAssembly
  4. QML Form in WebAssembly App?
Forum Updated to NodeBB v4.3 + New Features

QML Form in WebAssembly App?

Scheduled Pinned Locked Moved Unsolved Qt for WebAssembly
9 Posts 2 Posters 1.1k Views 2 Watching
  • Oldest to Newest
  • Newest to Oldest
  • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • D Offline
    D Offline
    DragonOsman
    wrote on last edited by
    #1

    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.

    1 Reply Last reply
    0
    • lorn.potterL Offline
      lorn.potterL Offline
      lorn.potter
      wrote on last edited by
      #2

      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

      Freelance Software Engineer, Platform Maintainer QtWebAssembly, Maintainer QtSensors
      Author, Hands-On Mobile and Embedded Development with Qt 5 http://bit.ly/HandsOnMobileEmbedded

      1 Reply Last reply
      1
      • D Offline
        D Offline
        DragonOsman
        wrote on last edited by
        #3

        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.

        lorn.potterL 1 Reply Last reply
        0
        • D DragonOsman

          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.

          lorn.potterL Offline
          lorn.potterL Offline
          lorn.potter
          wrote on last edited by
          #4

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

          Freelance Software Engineer, Platform Maintainer QtWebAssembly, Maintainer QtSensors
          Author, Hands-On Mobile and Embedded Development with Qt 5 http://bit.ly/HandsOnMobileEmbedded

          1 Reply Last reply
          0
          • D Offline
            D Offline
            DragonOsman
            wrote on last edited by
            #5

            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?

            1 Reply Last reply
            0
            • lorn.potterL Offline
              lorn.potterL Offline
              lorn.potter
              wrote on last edited by
              #6

              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.

              Freelance Software Engineer, Platform Maintainer QtWebAssembly, Maintainer QtSensors
              Author, Hands-On Mobile and Embedded Development with Qt 5 http://bit.ly/HandsOnMobileEmbedded

              1 Reply Last reply
              0
              • D Offline
                D Offline
                DragonOsman
                wrote on last edited by
                #7

                Alright, thanks for the info.

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

                1 Reply Last reply
                0
                • D Offline
                  D Offline
                  DragonOsman
                  wrote on last edited by
                  #8

                  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?

                  1 Reply Last reply
                  0
                  • D Offline
                    D Offline
                    DragonOsman
                    wrote on last edited by
                    #9

                    @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.

                    1 Reply Last reply
                    0

                    • Login

                    • Login or register to search.
                    • First post
                      Last post
                    0
                    • Categories
                    • Recent
                    • Tags
                    • Popular
                    • Users
                    • Groups
                    • Search
                    • Get Qt Extensions
                    • Unsolved