Man*_*ish 3 iframe youtube-api ios swift wkwebview
我已经WKWebView("myPlayer" in below code)为iFrame嵌入在其中的动态指定了帧的大小,但 youtube 视频视图显示 1/3 的WKWebView. 下面是我的代码和参考图片。
let videoURL:URL = URL(string: "https://www.youtube.com/embed/695PN9xaEhs")!
@IBOutlet weak var myPlayer: WKWebView!
var didLoadVideo = false
var embedVideoHtml:String?
override func viewDidLoad() {
super.viewDidLoad()
embedVideoHtml = {
return """
<!DOCTYPE html>
<html>
<body>
<!-- 1. The <iframe> (and video player) will replace this <div> tag. -->
<div id="player"></div>
<script>
var tag = document.createElement('script');
tag.src = "https://www.youtube.com/player_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
var player;
function onYouTubeIframeAPIReady() {
player = new YT.Player('player', {
playerVars: { 'autoplay': 1, 'controls': 0, 'playsinline': 1 },
height: '\(myPlayer.frame.height)',
width: '\(myPlayer.frame.width)',
videoId: '\(videoURL.lastPathComponent)',
events: {
'onReady': onPlayerReady
}
});
}
function onPlayerReady(event) {
event.target.playVideo();
}
</script>
</body>
</html>
"""
}()
}
Run Code Online (Sandbox Code Playgroud)
所以有人知道如何在 myPlayer 框架中适应 youtube 视频视图吗?
在您embedVideoHtml之前<body>添加以下代码:
<style>
* { margin: 0; padding: 0; }
html, body { width: 100%; height: 100%; }
</style>
Run Code Online (Sandbox Code Playgroud)
并在播放器参数中更改以下参数:
height: '\(myPlayer.frame.height)',
width: '\(myPlayer.frame.width)',
Run Code Online (Sandbox Code Playgroud)
到:
height: '100%',
width: '100%',
Run Code Online (Sandbox Code Playgroud)
进行这些更改后,您的播放器应调整为 WKWebView
| 归档时间: |
|
| 查看次数: |
1405 次 |
| 最近记录: |