Player

The Player is a standalone desktop application that serves as your playground. It’s the easiest way to preview your UI and it also provides you with all the tools needed.

Running it

Running it is as simple as double-clicking the provided Player.bat on Windows or Player.sh on Mac. Alternatively, click the Player button in the Launcher.

Capabilities

Here’s a list of what the Player is capable of doing:

  • Dragging and dropping HTML files from your file system into the app will load them.
  • The Player will propagate mouse and keyboard input to the UI. Gamepad and touch input is propagated only on Windows.
  • It’s a great tool for profiling - run the app, hit F12 to open the dev tools and use the Performance panel to measure how fast your UI is.
  • It has a number of command-line arguments which you can use to control its behavior (e.g. what the initial page should be, where to read resources from, etc.). Open Player.bat / Player.sh in your favorite text editor for a list of supported arguments.

Player Configurations

The Player comes with a Config.json file. Currently, there is a limited amount of settings and options you can configure, but we will expand these in the future. For now, you can specify where you want your coui:// root to be, as well as how and what fonts you want to register in advance. For example, if you are on Windows and want your root to be C:/, simply do the following:

"general-options":{
    "coui-root": "C:/"
},

Leaving the coui-root empty, it will by default be relative to the Samples directory.

The font options adhere to the following schema:

"font-options": {
    "register-fonts": [
        {
            "path": "coui://fonts/DroidSans.ttf",
            "family": "",
            "sdf": "off",
            "style": "auto",
            "weight": "auto"
        },
        // More fonts
    ]
}
  • The path (mandatory) is where you specify the full location of the font you want to load, relative to your coui:// root (similar to what you would normally do in CSS, using src)
  • family (optional) is equivalent to font-family in CSS and can be left blank, in which case the original font family specified in the font itself will be used, but you can also optionally give it a custom family name
  • sdf (optional) can be either on or off, depending on whether or not you would like to use Signed Distance Fields
  • style (optional) is equivalent to font-style in CSS and you can either leave it auto, to use the original style specified in the font, or set it to either one of the following:
    • normal
    • italic
    • oblique
  • weight (optional) is equivalent to font-weight in CSS and you can either leave it auto, to use the original weight specified in the font, or set it to either one of the following:
    • thin
    • extra-light
    • light
    • normal
    • medium
    • semi-bold
    • bold
    • extra-bold
    • black

Keyboard shortcuts

  • F1 opens this page in your browser
  • F5 will reload the current scene
  • F12 will launch Prysm’s Dev tools which allow you to inspect, debug and profile your UI.
Player Overrides →