zoukankan      html  css  js  c++  java
  • react-native-webview禁止缩放

    一、需求

    RN-webview禁止缩放,即固定屏幕大小,但同时要能够监听到其他手势识别

    二、实现

    仅仅设置webview的大小自适应是不够的,因为webview所引入的h5页面有可能是能够缩放的。

    因此先向h5页面注入代码:

    const INJECTEDJAVASCRIPT = `
      const meta = document.createElement('meta'); 
      meta.setAttribute('content', 'initial-scale=0.5, maximum-scale=0.5, user-scalable=0'); 
      meta.setAttribute('name', 'viewport'); 
      document.getElementsByTagName('head')[0].appendChild(meta); 
    `

    而后设置webview:

    <WebView
      ref={ref => (this.webview = ref)}
      javaScriptEnabled={true}
      scalesPageToFit={false}
      injectedJavaScript={ INJECTEDJAVASCRIPT }
      source={{ uri: this.state.source }}
    />

    即可固定页面。

  • 相关阅读:
    Swing 2
    Swing 1
    集合
    关于sql 模糊字段查询语句
    关于前端开发的几篇文章
    黄金点游戏
    word count
    四则运算
    软件工程——《构建之法》读后困惑
    自我介绍
  • 原文地址:https://www.cnblogs.com/bbcfive/p/10989367.html
Copyright © 2011-2022 走看看