圖像變換

2024-02-16 13:58 更新

圖片處理指對PixelMap進(jìn)行相關(guān)的操作,如獲取圖片信息、裁剪、縮放、偏移、旋轉(zhuǎn)、翻轉(zhuǎn)、設(shè)置透明度、讀寫像素數(shù)據(jù)等。圖片處理主要包括圖像變換、位圖操作,本文介紹圖像變換。

開發(fā)步驟

圖像變換相關(guān)API的詳細(xì)介紹請參見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. 進(jìn)行圖像變換操作。

    原圖:

    • 裁剪
      1. // x: 裁剪起始點橫坐標(biāo)0
      2. // y: 裁剪起始點縱坐標(biāo)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);

    • 旋轉(zhuǎn)
      1. // 順時針旋轉(zhuǎn)90°
      2. pixelMap.rotate(90);

    • 翻轉(zhuǎn)
      1. // 垂直翻轉(zhuǎn)
      2. pixelMap.flip(false, true);

      1. // 水平翻轉(zhuǎn)
      2. pixelMap.flip(true, false);

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

以上內(nèi)容是否對您有幫助:
在線筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號
微信公眾號

編程獅公眾號