PlayCanvas - User Interface


I am trying to upload some interface images to my PlayCanvas project, but it is imported as a texture. Textures are power-of-two images, and that is not what I want.

Solutions I’ve found:

1) Upload that images to another server, and reference them in an HTML interface.
2) Create interface using PlayCanvas Sprite. But I will deal with the same problem when hosting images in another server.

  • Can I host interface images in my PlayCanvas project? Without conversion to power-of-two?
  • Does PlayCanvas have an “official” way to build User Interfaces?

Thank You!

It shouldn’t matter that it’s power of two; using the sprite you set the texture (power of two) and then set the width and height of the texture to be the original dimensions and it looks just fine.

It’s basically just being stretched to be power of two, so “un-strectching” to the proper dimensions would make the texture look normal.

As you have discovered we currently always convert images to be a power of 2 as this is required by WebGL. We’re currently working on a new asset pipeline which will let you choose whether or not you want this conversion to happen, but at the moment you will have to either: “unstretch” the image as Richard suggests, or reference content from another server.

We don’t have an official method of building UIs. A couple of possible solutions are:

  1. Using HTML & CSS assets to build your UIs using regular HTML
  2. Using sprites from our Github account which lets you do 2D UI in the canvas.
1 Like

Testing sprites I was able to notice that these “un-streched” images should look a little blurry, and that was a problem showing some details. I’ve built the interface in HTML and CSS hosting in PlayCanvas. And the images were uploaded to my own external server. That is a little confusing sometimes to deal with interface assets, but it is working fine.

Thank you for your reply :smile: