Description
Application: Messaging Application (Chat and Video Calls) using SignalR and WebRTC
Framework: MAUI Blazor Hybrid
Android OS: 15 - API 35
.Net Version: 9
Is Picture-In-Picture supported in BlazorWebView?
You see i tried to implement a PIP that similar to video calls (Ex. Skype,Messenger,Instagram).
if i missing some declaration and implement please correct me or atleast give documentation for blazor hybrid thank you!
<div id="video-call-body">
<div id="primary-active-video" class="position-relative">
<video id="remoteVideo" class="w-100 h-100" style="pointer-events: none; object-fit: cover;" autoplay></video>
<div class="position-absolute end-0 top-0 text-white small">
@_iceStatus
</div>
</div>
<div id="smaller-active-video">
<video id="localVideo" class="w-100 h-100" style="pointer-events: none; object-fit: cover;" autoplay muted></video>
</div>
</div>
<div id="video-call-footer">
<div class="call-icon">
<i class="bi bi-pip" @onclick=EnabledPIP></i>
</div>
</div>
@code{
private async Task EnabledPIP()
{
await JSRuntime.InvokeVoidAsync("enablePiP");
}
}
I would like to execute a remote video at very least (it should be both but it seems pip only trigger one video).
async function enablePiP() {
const video = document.getElementById("remoteVideo");
if (video !== null && video.readyState >= 3) {
if (video.requestPictureInPicture) {
await video.requestPictureInPicture().catch(error => {
console.log('PiP failed:', error);
});
}
}
}
Added SupportPictureInPicture = true, ResizeableActivity = true in MainActivity.cs
[Activity(Theme = "@style/Maui.SplashTheme", MainLauncher = true, LaunchMode = LaunchMode.SingleTop, SupportsPictureInPicture = true, ResizeableActivity = true, ConfigurationChanges = ConfigChanges.ScreenSize | ConfigChanges.Orientation | ConfigChanges.UiMode | ConfigChanges.ScreenLayout | ConfigChanges.SmallestScreenSize | ConfigChanges.Density)]
public class MainActivity : MauiAppCompatActivity
but unfortunately it still throws Not SupportedError
I already posted the same question in community no one answer so i posted here as well.
Thank you