Image APIs

my.chooseImage

Takes a photo or selects an image from the phone album.

Input parameters

Name	Type	Required	Description
count	Number	No	Maximum number of photos to select. Default: 1.
sizeType	StringArray	No	original for the original image, compressed for the compressed image. Default: both.
sourceType	StringArray	No	Image source: album or camera. Default: ['camera', 'album'].
success	Function	No	Callback on success.
fail	Function	No	Callback on failure.
complete	Function	No	Callback on completion, regardless of success or failure.

Return value on success

Name	Type	Description
apFilePaths	StringArray	Array of image paths.

Error codes

error	Description	Solution
11	The user canceled the operation.	Normal interaction flow. No handling required.

Code examples

// API-DEMO page/API/image/image.json
{
    "defaultTitle": "Image"
}

<!-- API-DEMO page/API/image/image.axml -->
<view class="page">
  <view class="page-section">
    <view class="page-section-btns">
      <view onTap="chooseImage">Choose Image</view>
      <view onTap="previewImage">Preview Image</view>
      <view onTap="saveImage">Save Image</view>
    </view>
  </view>
</view>

// API-DEMO page/API/image/image.js
Page({
  chooseImage() {
    my.chooseImage({
      sourceType: ['camera','album'],
      count: 2,
      success: (res) => {
        my.alert({
          content: JSON.stringify(res),

        });
      },
      fail:()=>{
        my.showToast({
          content: 'fail', // Text content
        });
      }
    })
  },
  previewImage() {
    my.previewImage({
      current: 2,
      urls: [
        'https://img.alicdn.com/tps/TB1sXGYIFXXXXc5XpXXXXXXXXXX.jpg',
        'https://img.alicdn.com/tps/TB1pfG4IFXXXXc6XXXXXXXXXXXX.jpg',
        'https://img.alicdn.com/tps/TB1h9xxIFXXXXbKXXXXXXXXXXXX.jpg'
      ],
    });
  },
  saveImage() {
    my.saveImage({
      url: 'https://img.alicdn.com/tps/TB1sXGYIFXXXXc5XpXXXXXXXXXX.jpg',
      showActionSheet: true,
      success: () => {
        my.alert({
          title: 'Saved successfully',
        });
      },
    });
  }
});

my.previewImage

Previews images. Local image viewing is not supported.

On iOS, base library 1.0.0 does not support using my.previewImage and my.chooseImage together.

Input parameters

Name	Type	Required	Description
urls	Array	Yes	List of image URLs to preview. Supports web URLs and apFilePaths.
current	Number	No	Index of the currently displayed image. Default: 0 (the first image in urls).
success	Function	No	Callback on success.
fail	Function	No	Callback on failure.
complete	Function	No	Callback on completion, regardless of success or failure.
enablesavephoto	Boolean	No	Allows saving the photo with a long press. Supported in base libraries 1.13.0 and later.
enableShowPhotoDownload	Boolean	No	Displays a download button in the lower-right corner. Must be used with enablesavephoto. Supported in base libraries 1.13.0 and later.

Code examples

// API-DEMO page/API/image/image.json
{
    "defaultTitle": "Image"
}

<!-- API-DEMO page/API/image/image.axml -->
<view class="page">
  <view class="page-section">
    <view class="page-section-btns">
      <view onTap="chooseImage">Choose Image</view>
      <view onTap="previewImage">Preview Image</view>
      <view onTap="saveImage">Save Image</view>
    </view>
  </view>
</view>

// API-DEMO page/API/image/image.js
Page({
  chooseImage() {
    my.chooseImage({
      sourceType: ['camera','album'],
      count: 2,
      success: (res) => {
        my.alert({
          content: JSON.stringify(res),

        });
      },
      fail:()=>{
        my.showToast({
          content: 'fail', // Text content
        });
      }
    })
  },
  previewImage() {
    my.previewImage({
      current: 2,
      urls: [
        'https://img.alicdn.com/tps/TB1sXGYIFXXXXc5XpXXXXXXXXXX.jpg',
        'https://img.alicdn.com/tps/TB1pfG4IFXXXXc6XXXXXXXXXXXX.jpg',
        'https://img.alicdn.com/tps/TB1h9xxIFXXXXbKXXXXXXXXXXXX.jpg'
      ],
    });
  },
  saveImage() {
    my.saveImage({
      url: 'https://img.alicdn.com/tps/TB1sXGYIFXXXXc5XpXXXXXXXXXX.jpg',
      showActionSheet: true,
      success: () => {
        my.alert({
          title: 'Saved successfully',
        });
      },
    });
  }
});

my.saveImage

Saves an online image to the phone album.

Input parameters

Name	Type	Required	Description
url	String	Yes	URL of the image to save.
showActionSheet	Boolean	No	Displays the image operation menu. Default: true. Supported in base libraries 1.24.0 and later.
success	Function	No	Callback on success.
fail	Function	No	Callback on failure.
complete	Function	No	Callback on completion, regardless of success or failure.

Error codes

error	Description	Solution
2	Invalid parameter: URL not provided.	Provide a valid URL.
15	Album permission not granted. iOS only.	Grant album permission.
16	Insufficient album storage space. iOS only.	Free up phone storage space.
17	Other error during image save.	Try again later.

FAQ

• Q: Can my.saveImage save Base64 images? A: No. Base64 images are not supported.

Code examples

// API-DEMO page/API/image/image.json
{
    "defaultTitle": "Image"
}

<!-- API-DEMO page/API/image/image.axml -->
<view class="page">
  <view class="page-section">
    <view class="page-section-btns">
      <view onTap="chooseImage">Choose Image</view>
      <view onTap="previewImage">Preview Image</view>
      <view onTap="saveImage">Save Image</view>
    </view>
  </view>
</view>

// API-DEMO page/API/image/image.js
Page({
  chooseImage() {
    my.chooseImage({
      sourceType: ['camera','album'],
      count: 2,
      success: (res) => {
        my.alert({
          content: JSON.stringify(res),

        });
      },
      fail:()=>{
        my.showToast({
          content: 'fail', // Text content
        });
      }
    })
  },
  previewImage() {
    my.previewImage({
      current: 2,
      urls: [
        'https://img.alicdn.com/tps/TB1sXGYIFXXXXc5XpXXXXXXXXXX.jpg',
        'https://img.alicdn.com/tps/TB1pfG4IFXXXXc6XXXXXXXXXXXX.jpg',
        'https://img.alicdn.com/tps/TB1h9xxIFXXXXbKXXXXXXXXXXXX.jpg'
      ],
    });
  },
  saveImage() {
    my.saveImage({
      url: 'https://img.alicdn.com/tps/TB1sXGYIFXXXXc5XpXXXXXXXXXX.jpg',
      showActionSheet: true,
      success: () => {
        my.alert({
          title: 'Saved successfully',
        });
      },
    });
  }
});

my.compressImage

Compresses images.

Input parameters

Name	Type	Required	Description
apFilePaths	StringArray	Yes	Array of image paths to compress.
compressLevel	Number	No	Compression level (integer, 0-4). Default: 4. See the compressLevel table below.
success	Function	No	Callback on success.
fail	Function	No	Callback on failure.
complete	Function	No	Callback on completion, regardless of success or failure.

Return value on success

Name	Type	Description
apFilePaths	StringArray	Array of compressed image paths.

compressLevel values

compressLevel	Description
0	Low quality
1	Medium quality
2	High quality
3	No compression
4	Adaptive (adjusts to network conditions)

Code examples

<!-- API-DEMO page/API/compress-image/compress-image.axml-->
<view class="page">
  <view class="page-description">Compress Image API</view>
  <view class="page-section">
    <view class="page-section-title">my.compressImage</view>
    <view class="page-section-demo">
      <button type="primary" onTap="selectImage" hover-class="defaultTap">Select Image</button>
      <image
        src="{{compressedSrc}}" 
        mode="{{mode}}" />
    </view>
  </view>
</view>

// API-DEMO page/API/compress-image/compress-image.js
Page({
  data: {
    compressedSrc: '',
    mode: 'aspectFit',
  },
  selectImage() {
    my.chooseImage({
      count: 1,
      success: (res) => {
        my.compressImage({
          apFilePaths: res.apFilePaths,
          compressLevel: 1,
          success: data => {
            console.log(data);
            this.setData({
              compressedSrc: data.apFilePaths[0],
            })
          }
        })
      }
    })
  },
});

my.getImageInfo

Retrieves image information.

Input parameters

Name	Type	Required	Description
src	String	No	Image path. Supported path types: Web URL apFilePath path Relative path
success	Function	No	Callback on success.
fail	Function	No	Callback on failure.
complete	Function	No	Callback on completion, regardless of success or failure.

Return value on success

Name	Type	Description
width	Number	Image width in px.
height	Number	Image height in px.
path	String	Local path of the image.
orientation	String	Image orientation. See the orientation values table below.
type	String	Image format.

orientation values

Value	Description
up	Default value
down	Rotated 180 degrees
left	Rotated 90 degrees counterclockwise
right	Rotated 90 degrees clockwise
up-mirrored	Same as up, but horizontally flipped
down-mirrored	Same as down, but horizontally flipped
left-mirrored	Same as left, but vertically flipped
right-mirrored	Same as right, but vertically flipped

Code examples

// Web image path
my.getImageInfo({
      src:'https://img.alicdn.com/tps/TB1sXGYIFXXXXc5XpXXXXXXXXXX.jpg',
      success:(res)=>{
        console.log(JSON.stringify(res))
      }
    })

// apFilePath
my.chooseImage({
      success: (res) => {
        my.getImageInfo({
          src:res.apFilePaths[0],
          success:(res)=>{
            console.log(JSON.stringify(res))
          }
        })
      },
    })

// Relative path
my.getImageInfo({
      src:'image/api.png',
      success:(res)=>{
        console.log(JSON.stringify(res))
      }
    })