图像变换

2024-02-16 13:58 更新

图片处理指对PixelMap进行相关的操作,如获取图片信息、裁剪、缩放、偏移、旋转、翻转、设置透明度、读写像素数据等。图片处理主要包括图像变换、位图操作,本文介绍图像变换。

开发步骤

图像变换相关API的详细介绍请参见API参考

  1. 完成图片解码,获取Pixelmap对象。
  2. 获取图片信息。
    1. // 获取图片大小
    2. pixelMap.getImageInfo().then( info => {
    3. console.info('info.width = ' + info.size.width);
    4. console.info('info.height = ' + info.size.height);
    5. }).catch((err) => {
    6. console.error("Failed to obtain the image pixel map information.And the error is: " + err);
    7. });
  3. 进行图像变换操作。

    原图:

    • 裁剪
      1. // x: 裁剪起始点横坐标0
      2. // y: 裁剪起始点纵坐标0
      3. // height: 裁剪高度400,方向为从上往下(裁剪后的图片高度为400)
      4. // width: 裁剪宽度400,方向为从左到右(裁剪后的图片宽度为400)
      5. pixelMap.crop({ x: 0, y: 0, size: { height: 400, width: 400 } });

    • 缩放
      1. // 宽为原来的0.5
      2. // 高为原来的0.5
      3. pixelMap.scale(0.5, 0.5);

    • 偏移
      1. // 向下偏移100
      2. // 向右偏移100
      3. pixelMap.translate(100, 100);

    • 旋转
      1. // 顺时针旋转90°
      2. pixelMap.rotate(90);

    • 翻转
      1. // 垂直翻转
      2. pixelMap.flip(false, true);

      1. // 水平翻转
      2. pixelMap.flip(true, false);

    • 透明度
      1. // 透明度0.5
      2. pixelMap.opacity(0.5);

以上内容是否对您有帮助:
在线笔记
App下载
App下载

扫描二维码

下载编程狮App

公众号
微信公众号

编程狮公众号