This guide describes the features of the Prysm integration in Unity3D. A basic understanding of the Unity3D engine, as well as HTML/JavaScript is assumed.
Prysm is a modern user interface middleware solution that allows you to integrate HTML pages built with CSS and JavaScript in your game. The communication between your game and the HTML engine is done through the CohtmlUISystem
component. Each HTML page is called a View
. The View
component allows you to perform operations on the page, such as resizing, navigating to a different URL, sending input events and so on.
Prysm for Unity3D is distributed as an archive for the Unity3D package manager
You can import the archive in your project by following these steps:
First, open your project in Unity3D Editor, then:
The trial version includes a 30 day trial license key. After the key expires you won't be able to initialize Prysm and an error message will be logged in the console.
The pro version requires entering your license key first. The license key is located at Standard Assets/Cohtml/Detail/License.cs. You should've received this file already prefilled with your license key when you bought the pro version. Replacing the existing empty License.cs file from the package with the provided one will activate Prysm.
The UPM package has the following structure:
The root folder of your package should be located in the Packages/Cohtml folder of your project.
Package
folder.Prysm comes with several predefined example scenes, showcasing some of the features and capabilities of the product. In order to preview them, you need to install them manually, as shown below.
Import
Assets/Samples/Cohtml/[Version]/[SampleFolder]/[SampleName].unity
. This step will import the UI resources for the CohtmlView
automatically inside the Assets/StreamingAssets/Cohtml/UIResources/[SampleScene]
folder and will import the scene inside build settings.ContextMenu
-> Gameface
-> Remove samples
. That action will remove the samples:Assets/Samples
Assets/StreamingAssets/Cohtml/UIResources
Additional packages for import
Documentation
button will import Prysm offline documentation.Player
button will import Prysm native player.Assets/StreamingAssets/Cohtml/UIResources
, other than the ones used in the samples.In Prysm there are two types of views - Screen and World views, the first is used for HUDs and menus, while the latter can be used for in-game UI (interactions between the player and the game). Let's start by creating and displaying a simple HTML page - call it HelloHTML.html
Create an HTML file and place it in the UIResources folder (By default, this is the Assets/Streaming Assets/Cohtml folder.). The page will be displayed instead of a HUD, so click on the MainCamera
(it will be the GameObject
on which the html will be attached), open Prysm (in the main menu) and choose Add Screen View. Go to the Page
property of the view and set the relative URL of the HelloHTML page here, for example: coui://uiresources/HelloHTML.html
. Click Play and you'll see the result.