Question WebCam preview in UI Toolkit

Hi all,
I am trying to get a webcam preview inside ui toolkit , to build a simple screen where the user can preview the camera before taking a photo.
I am facing many difficulties, and also the documentation is not very complete on these....
These are the steps I have followed:

1. I am using 2022.3, main targets are Android and iphones
2. i created a uidocument, with a single VisualElement, with a backgroundImage (a simple white rectangle from my assets)
3. I connected the code below, that compiles but doesn't work

My issues:

1. I am not sure to get a reference to the backgroundImage right (currently I get NULL)
2. how should I apply the webcam texture to the VisualElement?

Any help would be appreciated, thanks!!!
Luigi

Code (CSharp):

1. using System.Collections;
2. using System.Collections.Generic;
3. using UnityEngine;
4. using UnityEngine.UIElements;
5.  
6. using myDebugger;
7.  
8.  
9. public class scr_takephoto : myDebuggerUiParent {
10.  
11.     public override void Start ()
12.     {
13.         base.Start();
14.         Application.RequestUserAuthorization(UserAuthorization.WebCam);
15.  
16.         StartCoroutine(CamStart());
17.     }
18.  
19.     // https://discussions.unity.com/t/getting-a-web-cam-to-play-on-ui-texture-image/131628/2      
20.     // https://docs.unity3d.com/2022.3/Documentation/ScriptReference/UIElements.Image.html
21.  
22.     public Texture2D Convert_WebCamTexture_To_Texture2d(WebCamTexture _webCamTexture)
23.         {
24.         Texture2D _texture2D = new Texture2D(_webCamTexture.width, _webCamTexture.height);
25.         _texture2D.SetPixels32(_webCamTexture.GetPixels32());
26.         return _texture2D;
27.         }
28.     IEnumerator CamStart(){
29.         yield return null;
30.  
31.         WebCamDevice[] cam_devices = WebCamTexture.devices;
32.  
33.         myDebuggerDebug("Available cams:",cam_devices);
34.  
35.         VisualElement campreview=rootVisualElement.Q<VisualElement>("campreview");
36.         myDebuggerDebug("VisualElement done", campreview);
37.         StyleBackground backgroundImage = campreview.style.backgroundImage;
38.         myDebuggerDebug("Background image", backgroundImage);
39.  
40.         WebCamTexture webcamTexture = new WebCamTexture();
41.      
42.         backgroundImage = Background.FromTexture2D(Convert_WebCamTexture_To_Texture2d(webcamTexture));
43.  
44.         myDebuggerDebug("Now play!");
45.         webcamTexture.Play();
46.     }
47. }
48.  

 

Hi Alexandre,
thanks for the hint. And then, how can I plug the Image into a VisualElement? If I am not wrong Image is not part of "UI toolkit"
Luigi

 

There's an Image visual element: https://docs.unity3d.com/ScriptReference/UIElements.Image.html

Not to be confused by the component of the same name from uGUI.

 

Hi, this has been asked, and answered recently in another thread. Maybe this will help you:
https://forum.unity.com/threads/how...e-as-a-background-of-a-visualelement.1463870/

@AlexandreT-unity It would be nice if the webcam would offer and api to automatically hook it up to a render texture. Seems like that would be a handy feature.

 

Many thanks, with the latest thread hints I was able to do it!