Xamarin 表单：用于播放视频的 Webview 在 iPhone 中不起作用？

Question

我正在使用 Webview 播放视频和音频，它在 android 和 iPhone 模拟器上运行良好。但在真实 iPhone 上，视频播放效果不佳。

为了在 iPhone 上播放视频，我需要多次点击视频播放按钮。之后播放视频也需要很长时间。另一件重要的事情是我的视频 link 没有视频格式 (.mp4,.mkv)。

XAML

<WebView 
    x:Name="web_view"
    HeightRequest="200"
    WidthRequest="200"
    HorizontalOptions="FillAndExpand"
    VerticalOptions="FillAndExpand"/>

XAML.cs

web_view.Source = "https://player.vimeo.com/video/303543322";

我试过Plugin.MediaManager.Forms，但link中需要视频格式(.mp4,.mkv)，否则无法使用。那么有什么方法可以解决 webview 本身的这个问题，还是我应该选择支持播放无视频格式的视频的任何其他播放器（视频和音频）？

Answer 1

首先，在您的 PCL 中创建一个继承自 WebView 的新 class。并定义一个可绑定的属性指向 url 应该加载到 iOS 上的内容。

public class MyWebView : WebView
{
    public static readonly BindableProperty UrlProperty = BindableProperty.Create(
        propertyName: "Url",
        returnType: typeof(string),
        declaringType: typeof(MyWebView),
        defaultValue: default(string));

    public string Url
    {
        get { return (string)GetValue(UrlProperty); }
        set { SetValue(UrlProperty, value); }
    }
}

此 class 在 iOS 上的自定义渲染器：

[assembly: ExportRenderer(typeof(MyWebView), typeof(MyWebViewRenderer))]
namespace xxx.iOS
{
    public class MyWebViewRenderer : ViewRenderer<MyWebView, WKWebView>
    {
        WKWebView _wkWebView;
        protected override void OnElementChanged(ElementChangedEventArgs<MyWebView> e)
        {
            base.OnElementChanged(e);

            if (Control == null)
            {
                var config = new WKWebViewConfiguration();
                _wkWebView = new WKWebView(Frame, config);
                SetNativeControl(_wkWebView);
            }
            if (e.NewElement != null)
            {
                Control.LoadRequest(new NSUrlRequest(new NSUrl(Element.Url)));
            }
        }
    }
}

对于Android

[assembly: ExportRenderer(typeof(MyWebView), typeof(MyWebViewRenderer))]
namespace xxx.Droid
{
    public class MyWebViewRenderer : WebViewRenderer
    {
        public MyWebViewRenderer(Context context) : base(context)
        {

        }

        protected override void OnElementChanged(ElementChangedEventArgs<WebView> e)
        {
            base.OnElementChanged(e);

            if (Control != null)
            {
                var customWebView = Element as MyWebView;
                Control.Settings.AllowUniversalAccessFromFileURLs = true;

                Control.Settings.JavaScriptEnabled = true;    
                Control.LoadUrl(customWebView.Url);          
            }

        }
    }
}

终于可以在PCL的页面中使用这个自定义控件了，用法如下：

<StackLayout>
    <local:MyWebView Url="https://www.microsoft.com" VerticalOptions="FillAndExpand"/>
</StackLayout>

Xamarin 表单：用于播放视频的 Webview 在 iPhone 中不起作用？

Xamarin forms: Webview for playing video is not working in iPhone?

video

webview

xamarin.forms