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 yourcoui://
root (similar to what you would normally do in CSS, usingsrc
) family
(optional) is equivalent tofont-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 namesdf
(optional) can be eitheron
oroff
, depending on whether or not you would like to use Signed Distance Fieldsstyle
(optional) is equivalent tofont-style
in CSS and you can either leave itauto
, 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 tofont-weight
in CSS and you can either leave itauto
, 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.