评论

根据模板布局大小动态计算用户手机布局相对大小

根据模板布局大小动态计算用户手机布局相对大小, 包含两种方式,一种默认模板大小(base),第二种不固定模板大小(custom)

/**
 * 根据模板布局大小动态计算用户手机布局相对大小
 *
 */
module.exports = {
  /**
   *  模板Width=1080,Height=1920
   */
  base: {
    base: {
      /**
       *  大屏策略
       *  绘图:原来T的基础上增加N倍或者减少N倍  例:T=T+(T*N)
       */
      baseFont: 0.0,
      /**
       *  大屏策略
       *  绘图:原来T的基础上增加N倍或者减少N倍  例:T=T+(T*N)
       */
      baseWidh: 0.0,
      /**
       *  大屏策略
       *  绘图:原来T的基础上增加N倍或者减少N倍  例:T=T+(T*N)
       */
      baseHeight: 0.0
    },
    initi:false,
    setInitiResize: function() {
      this.initi=true;
      var windowHeight = wx.getSystemInfoSync().windowHeight;
      var windowWidth = wx.getSystemInfoSync().windowWidth;
      this.base.baseFont = base.baseWidh = new Number(this.getSelfAdaptionBaseW(windowWidth, 1080));
      this.base.baseHeight = new Number(this.getSelfAdaptionBaseH(windowHeight, 1920));
    },
    getSelfAdaptionBaseW: function(windowWidth, base) {
      return ((windowWidth - base) / base);
    },
    getSelfAdaptionBaseH: function(windowHeight, base) {
      return ((windowHeight - base) / base);
    },
    /**
     * 返回相对宽度,最小1
     * @param {Object} k
     */
    getBaseResizeW: function(k) {
      if (k == 0) {
        return 0;
      }
      var t = k + (k * this.base.baseWidh);
      if (t > 1) {
        return t;
      }
      return 1;
    },
    /**
     * 返回相对字体大小,最小5
     * @param {Object} k
     */
    getBaseResizeF: function(k) {
      if(!this.initi){
        this.setInitiResize();
      }
      if (k == 0) {
        return 0;
      }
      var t = k + (k * this.base.baseFont);
      if (t > 5) {
        return t;
      }
      return 5;
    },
 
    /**
     * 返回相对高度,最小5
     * @param {Object} k
     */
    getBaseResizeH: function(k) {
      if (!this.initi) {
        this.setInitiResize();
      }
      if (k == 0) {
        return 0;
      }
      var t = k + (k * this.base.baseHeight);
      if (t > 1) {
        return t;
      }
      return 1;
    },
 
    getBaseResizePX: function (k, base) {
      if (!this.initi) {
        this.setInitiResize();
      }
      if (k == 0) {
        return 0;
      }
      var t = k + (k * this.base.baseWidh);
      if (t > 1) {
        return t;
      }
      return 1;
    },
    /**
     *
     * 返回相对rem大小,最小1
     * @param {Object} k
     */
    getBaseResize: function(k) {
      k = k * 16;
      return this.getBaseResizePX(k);
    }
  },
  /**
   *  模板Width=base=?,Height=base=?
   */
  custom:{
    getSelfAdaptionBaseW: function (base) {
      var windowWidth = wx.getSystemInfoSync().windowWidth;
      return ((windowWidth - base) / base);
    },
    getSelfAdaptionBaseF: function (base) {
      return getSelfAdaptionBaseW(base);
    },
    getSelfAdaptionBaseH: function (base) {
      var windowHeight = wx.getSystemInfoSync().windowHeight;
      return ((windowHeight - base) / base);
    },
    /**
     * 返回相对宽度,最小1
     * @param {Object} k
     */
    getBaseResizeW: function(k, base) {
      if (k == 0) {
        return 0;
      }
      var t = k + (k * this.getSelfAdaptionBaseW(base));
      if (t > 1) {
        return t;
      }
      return 1;
    },
    /**
     * 返回相对字体大小,最小5
     * @param {Object} k
     */
    getBaseResizeF: function(k, base) {
      if (k == 0) {
        return 0;
      }
      var t = k + (k * this.getSelfAdaptionBaseF(base));
      if (t > 5) {
        return t;
      }
      return 5;
    },
 
    /**
     * 返回相对高度,最小5
     * @param {Object} k
     */
    getBaseResizeH: function(k, base) {
      if (k == 0) {
        return 0;
      }
      var t = k + (k * this.getSelfAdaptionBaseH(base));
      if (t > 1) {
        return t;
      }
      return 1;
    },
    /**
     *
     * 返回相对px大小,最小1
     * @param {Object} k
     */
    getBaseResizePX: function(k, base) {
      if (k == 0) {
        return 0;
      }
      var t = k + (k * this.getSelfAdaptionBaseW(base));
      if (t > 1) {
        return t;
      }
      return 1;
    },
    /**
     *
     * 返回相对rem大小,最小1
     * @param {Object} k
     */
    getBaseResize: function(k, base) {
      k = k * 16;
      return this.getBaseResizePX(k, base);
    }
  }
}

包含两种方式,一种默认模板大小(base),第二种不固定模板大小(custom

最后一次编辑于  11-18  
点赞 0
收藏
评论