Where can I find a tutorial to implement a video call with the "VideoTile" component?

Yossi Cahen 60

Hello, I'm looking for resources to implement a video call with Azure's Communication UI Library. Specifically, I would like to know how to get the video stream of remote participants in a Teams meeting using the VideoTile component. Are there any tutorials or samples available that can help with this implementation? Thank you for your help.

VenkateshDodda-MSFT 18,281 Reputation points Microsoft Employee

2024-04-05T11:37:19.7+00:00

@Yossi Cahen Thank you for posting for your question in Microsoft Q&A, apologize for any inconvenience caused on this.

I am checking with internal team on this and will update you here once I hear back from them.
VenkateshDodda-MSFT 18,281 Reputation points Microsoft Employee

2024-04-17T06:51:13.7266667+00:00

@Yossi Cahen Thanks for your patience on this, I have checked with internal team and sharing the below. There is no specific tutorial/sample about leveraging a single video stream and putting it into a video tile from a team's meeting interop call.

I would suggest going to this link for rendering a single stream from the web calling SDK

https://learn.microsoft.com/en-us/azure/communication-services/how-tos/calling-sdk/manage-video?pivots=platform-web#render-remote-participant-videoscreensharing-streams

If you can create a videoStreamRendererView, the target is a an HTMLElement reference then you can apply to the VideoTile renderElement prop to render the stream in the VideoTile component with a stream from a participant in a teams meeting.

Hope this helps, let me know if you have any further questions on this.
VenkateshDodda-MSFT 18,281 Reputation points Microsoft Employee

2024-04-18T04:01:04.9733333+00:00

Hello @Yossi Cahen ,

Following up to see if you have a chance to check my previous response and helped. Do let us know if you have any further questions on this.
Yossi Cahen 60 Reputation points

2024-04-18T09:34:47.8233333+00:00

@VenkateshDodda-MSFT Thanks for your help, but it didn't help me. I found a react example that helped me: https://github.com/Azure/communication-ui-library/blob/main/samples/ComponentExamples/src/examples/RenderSingleVideoTileExample.tsx

Accepted answer

VenkateshDodda-MSFT 18,281 Reputation points Microsoft Employee

2024-04-18T11:07:04.58+00:00

@Yossi Cahen
I'm glad that you were able to resolve your issue and thank you for posting your solution so that others experiencing the same thing can easily reference this!

Since the Microsoft Q&A community has a policy that "The question author cannot accept their own answer. They can only accept answers by others ", I'll repost your solution in case you'd like to accept the answer .

Refer to this Github Sample on how to work with video tile component in video call in ACS.

Please accept as Yes if the answer provided is useful, so that you can help others in the community looking for remediation for similar issues.
Please sign in to rate this answer.

1 person found this answer helpful.

0 comments No comments
Sign in to comment

Where can I find a tutorial to implement a video call with the "VideoTile" component?

0 additional answers