[FEATURE] - Customize the DisabledVideoWidget

[haroonkhan335]

There is absolutely no way to customize the UIKIT VideoViewer. For example, the DisabledVideoWidget cannot be customized at all. There are cases when people want to show their profile image or even just the name of the user when they disabled the camera. There is no callback or anything on the UIKIT on knowing which user disabled the camera. Even if you provide your own widget it just stays the same for everyone that disables the video.

Describe the solution you'd like
Maybe a callback in the VideoViewer class when someone disables the video that returns a Widget to set the disabled video widget for anyone that have disabled their camera. That way we can customize the disabled widget for each user that disables the camera.

[Meherdeep]

You can use the onRemoteVideoStateChanged and onLocalVideoStateChanged callback to check which user has disabled/enabled the camera.
However, UIKit already takes care of that with the DisabledVideoWidget as you mentioned and gives you method to customise it as well. Are you getting any error while using this?
For example, if you want to display the profile pic when the video is disabled you can do something like this inside the AgoraVideoViewer

disabledVideoWidget: Container(
    color: Colors.black,
    padding: const EdgeInsets.all(8.0),
    child: Center(
        child: Image.network(
            'https://link-to-your-img.png',
        ),
     ),
)

[tadaspetra]

Closing issue, since the UI Kit does support disabled Video customization. Please reopen if you disagree

[haroonkhan335]

This

You can use the onRemoteVideoStateChanged and onLocalVideoStateChanged callback to check which user has disabled/enabled the camera. However, UIKit already takes care of that with the DisabledVideoWidget as you mentioned and gives you method to customise it as well. Are you getting any error while using this? For example, if you want to display the profile pic when the video is disabled you can do something like this inside the AgoraVideoViewer

disabledVideoWidget: Container(
    color: Colors.black,
    padding: const EdgeInsets.all(8.0),
    child: Center(
        child: Image.network(
            'https://link-to-your-img.png',
        ),
     ),
)

This sets the image for all the canvases who have joined the call. Consider 4 people in the video call with 4 different canvases. If all of them have disabled their camera then I would be showing the same image on all of the canvases which should not be the case. Each canvas should show its own image, which is impossible with the current setup.