zoukankan      html  css  js  c++  java
  • iOS-UIWebview比例缩放

    你在使用UIWebview显示网页时。可能会注意到。UIWebView所支持的缩放倍率是非常有限的。而在Safari自己所支持的缩放系数比UIWebview要大得多。

    本文解释了怎样加大UIWebView的缩放系数。
    UIWebView类没有改动缩放系数的方法,我们仅仅能用HTML代码来做。

    Meta标签能够设置viewport。而viewport就包括了初始化缩放系数的參数。


    META标签例如以下所看到的:

    能够使用的參数有:
    minimum-scale:
    同意缩放的最小倍数。默觉得0.25,同意值为0-10。
    maximum-scale:
    执行缩放的最大倍数。默认1.6,同意值为0-10。
    initial-scale:
    当web页被载入,还未被用户缩放之前默认的缩放系数。默认值是自己主动依据页面大小和可用区域计算出来的,但这个值终于会在最小倍数到最大倍数之间。
    user-scalable
    是否执行用户缩放该web页。



    viewpoint的宽。默觉得980像素(iPhone)。同意值为200-10000 。

    ”device-width”表示设备宽度(iPhone为320,iPad为768)。

    注意device width不等于用户界面的宽度。设备宽度总是设备处于人像模式下的宽度(屏幕方向为正向)。假设我们想添加web页的最大缩放系数(默认1.6),我们仅仅须要在HTML代码中添加META标签。指定maximum-scale属性就可以。你能够直接在HTML源码中添加META标签。假设web页来自internet而且无法改动HTML源码,你能够用Javascript代码创建META标签并附加到web页的HTML代码中。读完剩下的内容。你就知道怎么做了。


    height:
    viewport的高。一般是依据width计算的。
    JavaScript代码例如以下:
    IncreaseZoomFactor.js:
    function increaseMaxZoomFactor() {
    var element = document.createElement(‘meta’);
    element.name = “viewport”;
    element.content = “maximum-scale=10”;
    var head = document.getElementsByTagName(‘head’)[0];
    head.appendChild(element);
    }
    在webViewDidFinishLoad:托付方法中,你能够把这段JS代码加到web页中:
    -(void)webViewDidFinishLoad:(UIWebView *)webView {
    NSString *path = [[NSBundle mainBundle]pathForResource:@”IncreaseZoomFactor” ofType:@”js”];
    NSString *jsCode = [NSStringstringWithContentsOfFile:path encoding:NSUTF8StringEncoding error:nil];
    [webViewstringByEvaluatingJavaScriptFromString:jsCode];
    [webView stringByEvaluatingJavaScriptFromString:@”increaseMaxZoomFactor()”];
    }

    当从web载入web页时。你须要小心,由于很多web页已经使用META标签去改变了缩放系数或其它的viewport參数。假设你添加了新的META标签,你会覆盖这些缩放系数以及其它未參数。也就是说,假设在多个META标签中定义同一參数。那么最后一个定义生效。

    大部分时候这不会产生什么问题,但某些时候例外。
    比如,假设web页定义了初始缩放系数4,由于web页未定义maximum-scale參数,那么默认值1.6将限制初始缩放系数仅仅能是1.6。如今,你加大了maximum-scale,initialzoom也会加大。由于原来的maximum-scale參数不能再限制它了。这会带来一个严重的后果,你须要检查其它參数并依据它们的值进行又一次定义(比如,你须要将initial-scale定义为1.6以防止maximum-scale将页面缩放得过多)。

  • 相关阅读:
    Sum Root to Leaf Numbers——LeetCode
    Search a 2D Matrix ——LeetCode
    Surrounded Regions——LeetCode
    Palindrome Partitioning——LeetCode
    Reverse Linked List II——LeetCode
    Word Break II——LeetCode
    POJ1163——The Triangle
    3Sum Closest——LeetCode
    House Robber——LeetCode
    amqp 抓包
  • 原文地址:https://www.cnblogs.com/jzssuanfa/p/7156502.html
Copyright © 2011-2022 走看看