美文网首页
UIWebview 和 WKWebView渲染区域不能全屏加载,

UIWebview 和 WKWebView渲染区域不能全屏加载,

作者: LGByte | 来源:发表于2019-04-29 16:21 被阅读0次

    一 、UIWebview全屏适配

    键盘弹出时候 Simulator Screen Shot - iPhone X - 2019-04-29 at 16.13.09.png

    1 iOS端 加上

     if (@available(iOS 11.0, *)) {
            [[UIScrollView appearance] setContentInsetAdjustmentBehavior:UIScrollViewContentInsetAdjustmentNever];
    
        }else{
            self.automaticallyAdjustsScrollViewInsets = NO;
        }
    

    加入这段话,使UIScrollView自视图不受安全区域影响造成布局乱变化

    H5 端

     <!DOCTYPE html>
    <html>
    <head>
       <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
       <meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>
       <meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover">
       <head>
           <title></title>
           <style>
               html,body{
                   height:100%;
                   background: yellowgreen;
                   color:#fff;
               }
           </style>
       </head>
    </head>
    <body bgcolor="yellow">
    
    <form action="/demo/demo_form.asp">
    First name:<br>
    <input type="text" name="firstname" value="Mickey">
    <br>
    Last name:<br>
    <input type="text" name="lastname" value="Mouse">
    <br><br>
    <input type="submit" value="Submit">
    </form> 
    
    <p>如果您点击提交,表单数据会被发送到名为 demo_form.asp 的页面。</p>
    
    </body>
    </html>
    

    viewport-fit=cover 是设置Html 可以撑满iOS设备的安全区域

    最后正常效果 Simulator Screen Shot - iPhone X - 2019-04-29 at 16.14.44.png

    参考文章1:http://guokelide.com/2018/03/13/%E7%AC%AC3%E7%AF%87-Wkwebview%E9%80%82%E9%85%8DiPhoneX%E8%B8%A9%E5%9D%91%E8%AE%B0/
    参考文章2:https://cloud.tencent.com/developer/article/1006338

    相关文章

      网友评论

          本文标题:UIWebview 和 WKWebView渲染区域不能全屏加载,

          本文链接:https://www.haomeiwen.com/subject/orzynqtx.html