如何将iframe视频缩放到更小的尺寸以适应iOS中的UIWebView框架？
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了如何将iframe视频缩放到更小的尺寸以适应iOS中的UIWebView框架？相关的知识，希望对你有一定的参考价值。
我的屏幕有两个UIWebViews，设置为相等的高度。
顶部UIWebView是videoWebView，使用loadhtmlString方法显示来自Vimeo API的视频。底部UIWebView是视频描述，也是一个HTML字符串。
视频的iFrame大小比videoWebView框架大。如何缩放它以适应videoWebView框架？
目前，它看起来像这样：
视频的HTML字符串是：
<iframe src="https://player.vimeo.com/video/168639256?title=0&byline=0&portrait=0&badge=0&autopause=0&player_id=0" width="1920" height="1080" frameborder="0" title="Sleepy Steve" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
webView在故事板中设置为scalesPageToFit和'Aspect Fit'。
有任何想法吗？我花了很长时间用谷歌搜索，但找不到答案。
这是我必须做的才能使它工作（一点点HTML和CSS魔术）：
- 在文本编辑器中创建一个
videoEmbed.html文件（例如Sublime） - 在
videoEmbed.html文件中添加以下格式化程序代码<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>embedded video</title> <style> .video-responsive{ overflow:hidden; padding-bottom:56.25%; position:relative; height:0; } .video-responsive iframe{ left:0; top:0; height:100%; width:100%; position:absolute; } </style> - 将
videoEmbed.html文件拖放到Xcode项目中
将videoEmbed.html文件添加到Xcode项目中 - 示例：
- 在
ViewController，你在HTML String加载UIWebView，添加一个属性：
@property (nonatomic, strong) NSString *videoEmbedHTML;
- 最后，将以下代码添加到
view中，在HTML String中加载UIWebView：// create a filePath for the videoEmbed.html file that you added to your Xcode project NSString *videoEmbedFilePath = [[NSBundle mainBundle] pathForResource:@"videoEmbed" ofType:@"html"]; NSError *err; self.videoEmbedHTML = [NSString stringWithContentsOfFile:videoEmbedFilePath encoding:NSUTF8StringEncoding error:&err]; NSString *html = [self.videoEmbedHTML stringByReplacingOccurrencesOfString:@"<embeddedVideo>" withString:self.video.videoLink]; // videoLink is the iframe src html link to load the video from an API endpoint [self.videoWebView loadHTMLString:html baseURL:nil];
这就是我的UIWebView现在的样子：
我在尝试加载YouTube视频时遇到了同样的问题。诀窍是操纵URL本身。通常，您将获得的URL看起来像这样，<iframe width="854" height="480" src="https://www.youtube.com/embed/neV3EPgvZ3g" frameborder="0" allowfullscreen></iframe>。
如果您操纵宽度和高度，它将改变webView中iframe的大小。
在目标C中：
CGFloat width = self.webView.frame.size.width;
CGFloat height = self.webView.frame.size.height;
NSString *URL = [NSString stringWithFormat:@"<iframe width="%f" height="%f" src="https://www.youtube.com/embed/7ksb_64XWPA" frameborder="0" allowfullscreen></iframe>", width * 2.6, height * 2.6];
[self.webView loadHTMLString:URL baseURL:nil];
在Swift中：
var width: CGFloat = webView.frame.size.width;
var height: CGFloat = webView.frame.size.height;
var URL = String(format: "<iframe width="%f" height="%f" src="https://www.youtube.com/embed/7ksb_64XWPA" frameborder="0" allowfullscreen></iframe>", width * 2.6, height * 2.6)
webView.loadHTMLString(URL, baseURL: nil)
注意：因子2.6是通过反复试验来实现的。我不知道是否有任何逻辑证据。
请注意样式属性。
let toLoadInWebView = "<body style="margin:0px;padding:0px;overflow:hidden">"
+ " <iframe style="overflow: hidden; overflow-x: hidden; overflow-y:
hidden; height: 0;" + " max-height: 100%; max-width: 100%; min-height: 100%;
min-width: 100%; width: 0;
scrolling:no;position:absolute;top:0px;left:0px;right:0px;bottom:0px" " + "
src=https://google.com"></iframe>" + "</body>"
webView.loadHTMLString(toLoadInWebView, baseURL: nil)
以上是关于如何将iframe视频缩放到更小的尺寸以适应iOS中的UIWebView框架？的主要内容，如果未能解决你的问题，请参考以下文章
iOS9：在另一个以编程方式添加的视图中居中以编程方式添加的视图
如何缩放 UIImage 以适应 UIScrollView 的尺寸？
以更快的方式和更小的尺寸将图像和硬拷贝文件（超过 100 个）附加和存储到 .NET 应用程序