export default class ImageExample {
  palette() {
    return {
      width: '654rpx',
      height: '600rpx',
      background: '#eee',
      views: [
        {
          type: 'rect',
          css: {
            top: '40rpx',
            left: '327rpx',
            color: 'rgba(255, 0, 0, 0.5)',
            width: '5rpx',
            height: '500rpx',
          },
        },
        {
          type: 'image',
          url: '/palette/avatar.jpg',
          css: {
            top: '40rpx',
            left: '327rpx',
            width: '100rpx',
            height: '100rpx',
          },
        },
        {
          type: 'qrcode',
          content: '/palette/avatar.jpg',
          css: {
            top: '180rpx',
            left: '327rpx',
            width: '120rpx',
            height: '120rpx',
          },
        },
        {
          type: 'text',
          text: "align: 'left' 或者不写",
          css: {
            top: '320rpx',
            left: '327rpx',
            fontSize: '30rpx',
          },
        },
        {
          type: 'text',
          text: "align: 'right'",
          css: {
            top: '370rpx',
            left: '327rpx',
            align: 'right',
            fontSize: '30rpx',
          },
        },
        {
          type: 'text',
          text: "align: 'center'",
          css: {
            top: '420rpx',
            left: '327rpx',
            align: 'center',
            fontSize: '30rpx',
          },
        },
        {
          type: 'text',
          text: "在多行的情况下，align 会影响内部 text 的对齐，比如这边设置 align: 'center'",
          css: {
            top: '480rpx',
            right: '327rpx',
            width: '400rpx',
            align: 'center',
            fontSize: '30rpx',
          },
        },
      ],
    };
  }
}
