Hey! I’ll take a look at this soon
The issue here is that viewports are square-shaped, so they won’t conform to a rect with rounded corners. You could make the viewport smaller to account for it: Camera as gui control_no5 | Babylon.js Playground (babylonjs-playground.com)
1 Like
Is there any way to use view of Camera in gui control like this?
I tried use renderTargetTexure.readPixels() and use canvas.toDataURL() to get image url for gui image, but this method get very slow fps.
You could use a post-process to mask the output with a circle: Babylon.js Node Material Editor (babylonjs.com), Post process created in NME | Babylon.js Playground (babylonjs.com), and use that post process in the camera used for the GUI.
You need to enable the post process alpha mode to make the post process render to blend with the existing screen. However, this still won’t work because the post process class disables clearing when alpha mode is used.
One way to do this is to perform the clearing in scene.onBeforeDrawPhaseObservable:
2 Likes