MediaElement 上的视频流不起作用

Question

我正在尝试使用 MAUI CommunityToolkit 中的 MediaElement 在我的 MAUI 应用程序（当前在 Android 上）中播放视频，并且我作为源传递的流是来自通过 WiFi 热点连接的摄像机的 RTSP 我已经使用

MediaSource.FromUri

转换了源网址，但仍然不起作用，我看到的只是红屏。 此外，我尝试在其中播放视频的视图是 ContentView，因此它是 ContentPage 内的组件

<ContentPage>
    ...
    <components:StreamView />
    ...
</ContentPage>

关于错误，我看到一个错误

[MediaSessionCompat] Couldn't find a unique registered media button receiver in the given context.
[0:] MediaManager: Error: AndroidX.LocalBroadcastManager.Content.LocalBroadcastManager not supported on Android 13 and above.

和

[ExoPlayerImplInternal] Playback error
[ExoPlayerImplInternal]   com.google.android.exoplayer2.ExoPlaybackException: Source error
[ExoPlayerImplInternal]       at com.google.android.exoplayer2.ExoPlayerImplInternal.handleIoException(ExoPlayerImplInternal.java:684)
[ExoPlayerImplInternal]       at com.google.android.exoplayer2.ExoPlayerImplInternal.handleMessage(ExoPlayerImplInternal.java:660)
[ExoPlayerImplInternal]       at android.os.Handler.dispatchMessage(Handler.java:102)
[ExoPlayerImplInternal]       at android.os.Looper.loopOnce(Looper.java:226)
[ExoPlayerImplInternal]       at android.os.Looper.loop(Looper.java:313)
[ExoPlayerImplInternal]       at android.os.HandlerThread.run(HandlerThread.java:67)
[ExoPlayerImplInternal]   Caused by: java.io.IOException: java.lang.IllegalArgumentException: missing profile-level-id param
[ExoPlayerImplInternal]       at com.google.android.exoplayer2.source.rtsp.RtspMediaPeriod$InternalListener.onSessionTimelineRequestFailed(RtspMediaPeriod.java:695)
[ExoPlayerImplInternal]       at com.google.android.exoplayer2.source.rtsp.RtspClient.dispatchRtspError(RtspClient.java:330)
[ExoPlayerImplInternal]       at com.google.android.exoplayer2.source.rtsp.RtspClient.access$700(RtspClient.java:84)
[ExoPlayerImplInternal]       at com.google.android.exoplayer2.source.rtsp.RtspClient$MessageListener.handleRtspResponse(RtspClient.java:690)
[ExoPlayerImplInternal]       at com.google.android.exoplayer2.source.rtsp.RtspClient$MessageListener.handleRtspMessage(RtspClient.java:523)
[ExoPlayerImplInternal]       at com.google.android.exoplayer2.source.rtsp.RtspClient$MessageListener.lambda$onRtspMessageReceived$0$com-google-android-exoplayer2-source-rtsp-RtspClient$MessageListener(RtspClient.java:516)
[ExoPlayerImplInternal]       at com.google.android.exoplayer2.source.rtsp.RtspClient$MessageListener$$ExternalSyntheticLambda0.run(Unknown Source:4)
[ExoPlayerImplInternal]       at android.os.Handler.handleCallback(Handler.java:942)
[ExoPlayerImplInternal]       at android.os.Handler.dispatchMessage(Handler.java:99)
[ExoPlayerImplInternal]       ... 3 more
[ExoPlayerImplInternal]   Caused by: com.google.android.exoplayer2.source.rtsp.RtspMediaSource$RtspPlaybackException: java.lang.IllegalArgumentException: missing profile-level-id param
[ExoPlayerImplInternal]       ... 9 more
[ExoPlayerImplInternal]   Caused by: java.lang.IllegalArgumentException: missing profile-level-id param
[ExoPlayerImplInternal]       at com.google.android.exoplayer2.util.Assertions.checkArgument(Assertions.java:62)
[ExoPlayerImplInternal]       at com.google.android.exoplayer2.source.rtsp.RtspMediaTrack.processAacFmtpAttribute(RtspMediaTrack.java:337)
[ExoPlayerImplInternal]       at com.google.android.exoplayer2.source.rtsp.RtspMediaTrack.generatePayloadFormat(RtspMediaTrack.java:245)
[ExoPlayerImplInternal]       at com.google.android.exoplayer2.source.rtsp.RtspMediaTrack.<init>(RtspMediaTrack.java:175)
[ExoPlayerImplInternal]       at com.google.android.exoplayer2.source.rtsp.RtspClient.buildTrackList(RtspClient.java:362)
[ExoPlayerImplInternal]       at com.google.android.exoplayer2.source.rtsp.RtspClient.access$1700(RtspClient.java:84)
[ExoPlayerImplInternal]       at com.google.android.exoplayer2.source.rtsp.RtspClient$MessageListener.onDescribeResponseReceived(RtspClient.java:724)
[ExoPlayerImplInternal]       at com.google.android.exoplayer2.source.rtsp.RtspClient$MessageListener.handleRtspResponse(RtspClient.java:630)
[ExoPlayerImplInternal]       ... 8 more

在搜索时我发现了一些建议的解决方法，但也没有帮助 这里提到的解决方法： https://github.com/CommunityToolkit/Maui/issues/2143

我已验证在流式传输/尝试播放视频时已连接到摄像机。

这是我的 StreamView.xaml：

<?xml version="1.0" encoding="UTF-8"?>

<ContentView xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:toolkit="http://schemas.microsoft.com/dotnet/2022/maui/toolkit"
             x:Class="MyApp.UI.Components.StreamView">

    <ContentView.Content>
        <StackLayout
            HorizontalOptions="FillAndExpand"
            VerticalOptions="FillAndExpand"
            HeightRequest="185">
            <StackLayout.BackgroundColor>
                <OnPlatform x:TypeArguments="Color">
                    <OnPlatform.Platforms>
                        <On Platform="iOS" Value="Black" />
                        <On Platform="Android" Value="Transparent" />
                    </OnPlatform.Platforms>
                </OnPlatform>
            </StackLayout.BackgroundColor>

            <toolkit:MediaElement 
                x:Name="mediaElement"
                MetadataArtworkUrl = "https://lh3.googleusercontent.com/pw/AP1GczNRrebWCJvfdIau1EbsyyYiwAfwHS0JXjbioXvHqEwYIIdCzuLodQCZmA57GADIo5iB3yMMx3t_vsefbfoHwSg0jfUjIXaI83xpiih6d-oT7qD_slR0VgNtfAwJhDBU09kS5V2T5ZML-WWZn8IrjD4J-g=w1792-h1024-s-no-gm" />

        </StackLayout>
    </ContentView.Content>
</ContentView>

和 StreamView.xaml.cs：

using CommunityToolkit.Maui.Views;
using MyApp.Core;

namespace MyApp.UI.Components
{
    public partial class StreamView : ContentView
    {

        public StreamView()
        {
            InitializeComponent();
            BindingContext = this;

            mediaElement.Source = MediaSource.FromUri(Constants.StreamUrl);

        }
    }
}

Answer 1

经过一番研究和调查，我找到了解决方案 但对于某些上下文，在使用 MAUI CommunityToolKit 中的

MediaElement

之前 我使用了

LibVLCSharp

包及其

VideoView

元素 搜索后，我读到 MAUI 不支持 VideoView 元素，但我仍然尝试使用它并收到错误，认为 VideoView 元素没有 VideoViewHandler，从该错误我认为这是导致它不受支持的错误在毛伊岛

长话短说，显然我所要做的就是在MauiProgram.cs（我在LibVLCSharp文档中没有找到）中配置VideoViewHandler（它已经在LibVLCSharp.MAUI包中实现）

var builder = MauiApp.CreateBuilder();

// In order to use VideoView element in the needed pages, we need
// to configure the VideoViewHandler from the LibVLCSharp.MAUI NuGet package
builder.ConfigureMauiHandlers(handlers =>
{
    handlers.AddHandler(typeof(VideoView), typeof(VideoViewHandler));
});