Skip to content
UI for the keyboard included with the Vuplex 3D WebView asset.
TypeScript CSS JavaScript HTML
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
public
scripts
src
.gitignore
LICENSE.txt
README.md
demo.gif
package-lock.json
package.json
tsconfig.json

README.md

Unity Keyboard

Unity Keyboard is the UI for the 3D keyboard included in the Vuplex 3D WebView asset. It's a React.js app that the asset renders in a webview, and it emits keyboard characters as the player clicks keys. You can try an online version of the keyboard UI here.

demo

This code is open source so that users can customize it and so that it can demontrate the 3D WebView's ability to pass messages between C# and JavaScript. The 3D WebView asset is needed in order to embed this UI in a project, because it handles rendering the UI to a Texture2D, processing click events, and providing the window.vuplex JavaScript API needed for message passing.

Development

This is a React + TypeScript project created using Create Creact App.

  • Install dependencies: npm install

  • Start the dev server: npm start

  • Type checking: npm run tsc

  • Build for production: npm run build

Generating KeyboardUi.cs

In order to simplify usage of the Unity Keyboard UI in the 3D WebView asset, the generate-c-sharp script is used to inline the various assets into the HTML and generate a KeyboardUi C# class with an Html property that gets passed to IWebView.LoadHtml(). This saves users from having to ensure that the various web assets are compiled correctly into their apps.

npm run generate-c-sharp
You can’t perform that action at this time.