Luxe and Universal Windows Apps

stisa, Nov 21, 2015

I’m still playing with luxe, and I heard that there is the possibility to turn html5 apps into Windows Universal Apps(also known as UWA) and I had to try it, even if it’s just (from my understanding, anyway) a wrapper around a webview.
The following steps assume that:

Starting from the base empty project, add this to your Main.hx

    ...
    override function ready() {

        var s : Sprite = new Sprite({
            name : "s",
            size: new Vec(48,48),
            pos: Luxe.screen.mid
        });

    } //ready
    ...

Now, follow those steps:

  1. Build a luxe project for web: flow build web (or flow run web if you want to make sure it works by launching it in your browser).
  2. Open Visual Studio (I used Visual Studio 2015)
  3. Create a new project in Visual Studio : New Project -> JavaScript -> Blank App (Windows Universal), I named it TestSnowkit
  4. Now grab the project.js generated by flow, and copy it into your Visual Studio Project folder
  5. Now in Visual Studio, in Solution Explorer right click on TestSnowkit-> Add-> Existing item (or press Shift+Alt+A) and select project.js
    (If you need sound, do the same for howler.js)
  6. Update the default.html to reference project.js. The other references are not needed, but you can keep them if you want to use some UWA specific feature
  7. In Visual Studio, press F5 to test your project.
    ...
    <body class="win-type-body">
        <p>Content goes here</p>
        <script src="project.js"></script>
    </body>
    ...

modified default.html

Here’s a picture of the project running:

Our white square running in a UWA

Problems

If when you build your project in Visual Studio it only shows a black screen, try changing :

    snow : {
        config : {
          has_loop : true,
          config_path : 'config.json' -> ''
        }
    },

Inside your framework.flow in your snow lib folder. If you leave it as config.json, snow tries loading it with a XMLHttpRequest, the problem is javascript is not allowed to request local files. Passing in an empty string instead bypasses this.

Thanks for reading this, and if you find errors or if I got something wrong, please open an issue on github

Tags:

  • uwa
  • windows
  • luxe
  • example
  • haxe