Xamarin 版本
- 可以在视图加载时添加(硬编码高度)。我还为 playerVars 添加了 "rel",只显示我的频道相关视频。
WKWebview 是动态创建并添加到容器中的。想法是让 iframe 填充 WKWebView,WKWebView 填充容器。我无法将高度设置为 100%,因此它会根据设备进行缩放,但似乎硬编码的 640 高度适用于大多数设备。
我还直接通过变量传递 youtube id,这基本上就是 videoURL.lastPathComponent 返回的内容。
自动播放正常工作,这是该线程的主要解决方案。
var wkWebConfig = UIDevice.CurrentDevice.CheckSystemVersion(10, 0)
? new WKWebViewConfiguration
{
MediaTypesRequiringUserActionForPlayback = WKAudiovisualMediaTypes.None
}
: new WKWebViewConfiguration
{
MediaPlaybackRequiresUserAction = false
};
_wkYoutubePlayer = new WKWebView(new CGRect(), wkWebConfig)
{
AccessibilityIdentifier = "viewPlayerYouTube",
TranslatesAutoresizingMaskIntoConstraints = false
};
viewPlayerContainerYouTube.AddSubview(_wkYoutubePlayer);
NSLayoutConstraint.Create(_wkYoutubePlayer, NSLayoutAttribute.Top, NSLayoutRelation.Equal, viewPlayerContainerYouTube, NSLayoutAttribute.Top, 1, 0).Active = true;
NSLayoutConstraint.Create(_wkYoutubePlayer, NSLayoutAttribute.Leading, NSLayoutRelation.Equal, viewPlayerContainerYouTube, NSLayoutAttribute.Leading, 1, 0).Active = true;
NSLayoutConstraint.Create(_wkYoutubePlayer, NSLayoutAttribute.Trailing, NSLayoutRelation.Equal, viewPlayerContainerYouTube, NSLayoutAttribute.Trailing, 1, 0).Active = true;
NSLayoutConstraint.Create(_wkYoutubePlayer, NSLayoutAttribute.Bottom, NSLayoutRelation.Equal, viewPlayerContainerYouTube, NSLayoutAttribute.Bottom, 1, 0).Active = true;
var html = $"<!DOCTYPE html><html><body><div id=\"player\"></div><script>var tag = document.createElement('script');tag.src = \"https://www.youtube.com/iframe_api\";var firstScriptTag = document.getElementsByTagName('script')[0];firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);var player;function onYouTubeIframeAPIReady() {{ player = new YT.Player('player', {{ height: '640', width: '100%', videoId: '{_youtubeVideoId}', playerVars: {{ rel: '0' }}, events: {{ 'onReady': onPlayerReady }} }}); }} function onPlayerReady(event) {{ event.target.playVideo(); }}</script></body></html>";
_wkYoutubePlayer.LoadHtmlString(html, null);