如何将 iframe 视频缩放到更小的尺寸以适应 iOS 中的 UIWebView 框架？

Question

如何将 iframe 视频缩放到更小的尺寸以适应 iOS 中的 UIWebView 框架？

AVo*_*Vog 3 html iframe objective-c uiwebview ios

我的屏幕有两个UIWebViews设置为相等的高度。

顶部UIWebView是videoWebView显示来自 Vimeo API 的视频使用 loadHTMLString方法。底部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>

Run Code Online (Sandbox Code Playgroud)

在故事板中设置为“Aspect Fit ” webView。scalesPageToFit

有任何想法吗？我花了很长时间谷歌搜索但找不到答案。

Answer 1

AVo*_*Vog 5

这是我必须做的才能让它工作（一点点 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>

Run Code Online (Sandbox Code Playgroud)

将文件拖放videoEmbed.html到 Xcode 项目中

将 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];

Run Code Online (Sandbox Code Playgroud)

这就是我UIWebView现在的样子：

新截图

归档时间：	9 年，6 月前
查看次数：	4354 次
最近记录：	7 年，3 月前