mina-painter/dist/weapp/painter-taro/utils.ts

一个小程序图片生成库，轻松通过 json 方式绘制一张可以发到朋友圈的图片

import { equal } from './lib/util';
import { IView } from './index';
import { toPx } from 'painter-kernel';

const ACTION_DEFAULT_SIZE = 24;
const ACTION_OFFSET: any = '2rpx';

/**
 * 判断一个 object 是否为 空
 * @param {object} object
 */
export function isEmpty(object) {
  for (const _i in object) {
    return false;
  }
  return true;
}

export function isInView(x, y, rect) {
  return x > rect.left && y > rect.top && x < rect.right && y < rect.bottom;
}

export function isInDelete(x, y, block) {
  if (block) {
    for (const view of block.views) {
      if (view.id === 'delete') {
        return isInView(x, y, view.rect);
      }
    }
  }
  return false;
}

export function isInScale(x, y, block) {
  if (block) {
    for (const view of block.views) {
      if (view.id === 'scale') {
        return isInView(x, y, view.rect);
      }
    }
  }
  return false;
}

export function isNeedRefresh(newVal, oldVal, dirty) {
  if (!newVal || isEmpty(newVal) || (dirty && equal(newVal, oldVal))) {
    return false;
  }
  return true;
}

export function getBox(rect, type, customActionStyle) {
  const boxArea: IView = {
    id: 'box',
    type: 'rect',
    css: {
      height: `${rect.bottom - rect.top}px`,
      width: `${rect.right - rect.left}px`,
      left: `${rect.left}px`,
      top: `${rect.top}px`,
      borderWidth: '4rpx',
      borderColor: '#1A7AF8',
      color: 'transparent',
    },
  };
  if (type === 'text') {
    boxArea.css = Object.assign({}, boxArea.css, {
      borderStyle: 'dashed',
    });
  }
  if (customActionStyle && customActionStyle.border) {
    boxArea.css = Object.assign({}, boxArea.css, customActionStyle.border);
  }
  return boxArea;
}

export function getScaleIcon(rect, type, customActionStyle) {
  const scaleArea: IView = {
    id: 'scale',
    type: 'rect',
    css: {
      color: '#0000ff',
    },
  };
  if (customActionStyle && customActionStyle.scale) {
    Object.assign(scaleArea, {
      type: 'image',
      url: type === 'text' ? customActionStyle.scale.textIcon : customActionStyle.scale.imageIcon,
      css: {},
    });
  }
  const actionOffset = toPx(ACTION_OFFSET);
  const commonLength = `${2 * ACTION_DEFAULT_SIZE}rpx`;
  scaleArea.css = Object.assign({}, scaleArea.css, {
    align: 'center',
    height: commonLength,
    width: commonLength,
    borderRadius: `${ACTION_DEFAULT_SIZE}rpx`,
    left: `${rect.right + actionOffset}px`,
    top:
      type === 'text'
        ? `${rect.top - actionOffset - toPx(commonLength) / 2}px`
        : `${rect.bottom - actionOffset - toPx(commonLength) / 2}px`,
  });
  return scaleArea;
}

export function getDeleteIcon(rect, customActionStyle) {
  const deleteArea: IView = {
    type: 'rect',
    id: 'delete',
    css: {
      color: '#0000ff',
    },
  };
  if (customActionStyle && customActionStyle.delete) {
    Object.assign(deleteArea, {
      type: 'image',
      url: customActionStyle.delete.icon,
      css: {},
    });
  }
  const actionOffset = toPx(ACTION_OFFSET);
  const commonLength = `${2 * ACTION_DEFAULT_SIZE}rpx`;
  deleteArea.css = Object.assign({}, deleteArea.css, {
    align: 'center',
    left: `${rect.left - actionOffset}px`,
    top: `${rect.top - actionOffset - toPx(commonLength) / 2}px`,
    height: commonLength,
    width: commonLength,
    borderRadius: `${ACTION_DEFAULT_SIZE}rpx`,
  });
  return deleteArea;
}