Медиа-проигрыватель Azure Xamarin WebView Гадкий значок воспроизведения Фоновое изображение - PullRequest
Новая
       65

Медиа-проигрыватель Azure Xamarin WebView Гадкий значок воспроизведения Фоновое изображение

0 голосов
/ 04 октября 2018

Я перепробовал почти все, чтобы попытаться разобраться в этом, но натолкнулся на стену.

В большинстве примеров требовалось, чтобы вы использовали css во введенном HTML, например: 

video::-webkit-media-controls-overlay-play-button {
  display: none;
}

video::-webkit-media-controls-overlay-play-button

video::-webkit-media-controls

video::--webkit-media-controls-play-button

Я видел большую часть вопроса здесь, но мой немного отличается, так как плакат по умолчанию для WebView в xaml, где я вставляю HTML-проигрыватель Azure, возвращается как ноль при созданииновый WebChromeClient и вернул плакат по умолчанию обратно в виде растрового изображения:

enter image description here

Фрагменты кода My Code выглядят следующим образом: (xaml и внедренный HTML) 

<WebView HorizontalOptions="FillAndExpand" WidthRequest="600" HeightRequest="300">
    <WebView.Source>
        <HtmlWebViewSource Html="{Binding LatestVideoUrl}"/>
    </WebView.Source>
</WebView>

Строка HTML: 

<html>
    <head>
        <link href=""https://amp.azure.net/libs/amp/2.2.0/skins/amp-default/azuremediaplayer.min.css"" rel=""stylesheet"">
        <script src=""https://amp.azure.net/libs/amp/2.2.0/azuremediaplayer.min.js""></script>
    </head>
    <body>
        <video id=""azuremediaplayer"" style=""background-color: black !important; font-size: 12px !important;"" class=""azuremediaplayer amp-default-skin amp-big-play-centered"" type=""video/webm"" tabindex=""0""></video>
        <script>
            var myOptions = {
                ""nativeControlsForTouch"": false,
                ""logo"": { ""enabled"": false },
                controls: true,
                autoplay: true,
                width: ""100%"",
                height: ""100%"",
                poster: ""{Binding ThumbnailUrl}"",
                hotKeys: { ""enableFullscreen"": true }
            };
            myPlayer = amp(""azuremediaplayer"", myOptions);
            myPlayer.src([
                {
                    src: ""{Binding LatestVideoUrl}"",
                    type: ""application/vnd.ms-sstr+xml""
                }
            ]);
        </script>
    </body>
</html>

В теге видео я попытался отключить элементы управления, чтобы отменить элементы управления видеопроигрывателя по умолчанию, чтобы Azure Media Play мог иметь приоритет, но не повезло.

Я также попробовал метатег Content-Security-Policy из-за интереса, но это не правильный способ сделать это, потому что он очень хакерский: он работал, но когда я его собрал и развернулИз-за этого на моем устройстве видео становилось слишком медленным, а элементы управления Azure Media Play не отображались. 

<meta http-equiv="Content-Security-Policy"
  content="default-src *;
  style-src 'self' http://* 'unsafe-inline' ;
  media-src * ;
  img-src * 'self' http://* 'unsafe-inline';
  script-src 'self' http://* https://* 'unsafe-inline' 'unsafe-eval'"/>

Любая помощь будет принята с благодарностью.

...