美文网首页
2018-12-18 缩放方案

2018-12-18 缩放方案

作者: 056cc6443751 | 来源:发表于2018-12-18 15:38 被阅读0次

参照别人写的缩放方案试了下

var React = require('react-native')

var PixelRatio = React.PixelRatio;

const screenWidth = React.Dimensions.get('window').width;

const screenHeight = React.Dimensions.get('window').height;

const fontScale = PixelRatio.getFontScale();

const w = PixelRatio.getPixelSizeForLayoutSize(screenWidth);

const h = PixelRatio.getPixelSizeForLayoutSize(screenHeight);

const DEFAULT_WIDTH = 411;

const DEFAULT_HEIGHT = 683;

const MIN_SCALE = Math.min(screenHeight/DEFAULT_HEIGHT, screenWidth/DEFAULT_WIDTH);

export default class ScreenUtil {


     static caleHeight(value) {
        return screenHeight/DEFAULT_HEIGHT*value;
    }

    static caleHeight2(value) {
        return screenHeight/DEFAULT_HEIGHT*value;
    }

    static scaleFontSize(fontSize) {
         return fontSize*MIN_SCALE;
    }

    static scaleImageWidth(width) {
        return width*MIN_SCALE;
    }

    static scaleImageHeight(height) {
        return height*MIN_SCALE;
    }
}

相关文章

  • 2018-12-18 缩放方案

    参照别人写的缩放方案试了下

  • H5页面窗口缩放解决方案

    窗口缩放解决方案 来自veb taro基于 react 的解决方案(京东)

  • Android画板(二):Matrix实现美图APP的旋转缩放

    一、美图旋转缩放方案 最近遇到了对图像进行旋转缩放操作的需求,以往的双指缩放、双指旋转体验明显没有美图app的旋转...

  • 安卓支持手势缩放图片

    背景 显示图片时,希望支持手势缩放图片. 解决方案 添加依赖 使用

  • 移动端适配

    移动端适配 1.适配宽高等问题REM方案:改变页面根部的font-size js方案:通过缩放viewport,达...

  • 移动端适配开发

    主要有两种方案,通过viewport设置画布缩放比例、通过设置html的font-size用rem适配。 方案一:...

  • 屏幕适配

    这里是画布大小适配的方案 1 .适配的思路, 可利用相机缩放让内容区域缩放到最合适的大小, 然后利用相机移动让内容...

  • Ant Design Mobile高清方案后iframe变形

    因高清脚本全局加载,造成缩放作用于iframe,进而iframe内样式变形临时解决方案:方案1:独立出高清脚本,按...

  • UIScrollView 缩放实现漫画阅读效果!

    需求 想实现漫画阅读放大效果需要利用UIScrollView的缩放功能。 方案一 思路:利用UICollectio...

  • iOS字体适配

    1.适配方案总结 1.等比例缩放+加减->1.1按不同机型或屏幕宽等比缩放->1.2按不同机型或屏幕宽加减2.ru...

网友评论

      本文标题:2018-12-18 缩放方案

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