1# Selecting Media Assets Using Picker
2
3When a user needs to share files such as images and videos, use Picker to start **Gallery** for the user to select the files to share. No permission is required when Picker is used. Currently, a UIAbility is used to start **Gallery** with the window component. The procedure is as follows:
4
51. Import modules.
6
7   ```ts
8   import { photoAccessHelper } from '@kit.MediaLibraryKit';
9   import { fileIo } from '@kit.CoreFileKit';
10   import { BusinessError } from '@kit.BasicServicesKit';
11   ```
12
132. Create a **PhotoSelectOptions** instance.
14
15   ```ts
16   const photoSelectOptions = new photoAccessHelper.PhotoSelectOptions();
17   ```
18
193. Set the type and maximum number of the files to select.
20   The following uses images as an example. For details about the media file types, see [PhotoViewMIMETypes](../../reference/apis-media-library-kit/js-apis-photoAccessHelper.md#photoviewmimetypes).
21
22   ```ts
23   photoSelectOptions.MIMEType = photoAccessHelper.PhotoViewMIMETypes.IMAGE_TYPE; // Select images.
24   photoSelectOptions.maxSelectNumber = 5; // Set the maximum number of images that can be selected.
25   ```
26
274. Create a **photoViewPicker** instance and call [PhotoViewPicker.select](../../reference/apis-media-library-kit/js-apis-photoAccessHelper.md#select) to open the **Gallery** page for the user to select images. After the images are selected, [PhotoSelectResult](../../reference/apis-media-library-kit/js-apis-photoAccessHelper.md#photoselectresult) is returned.
28
29   ```ts
30   let uris: Array<string> = [];
31   const photoViewPicker = new photoAccessHelper.PhotoViewPicker();
32   photoViewPicker.select(photoSelectOptions).then((photoSelectResult: photoAccessHelper.PhotoSelectResult) => {
33     uris = photoSelectResult.photoUris;
34     console.info('photoViewPicker.select to file succeed and uris are:' + uris);
35   }).catch((err: BusinessError) => {
36     console.error(`Invoke photoViewPicker.select failed, code is ${err.code}, message is ${err.message}`);
37   })
38   ```
39
40   The permission on the URIs returned by **select()** is read-only. File data can be read based on the URI. Note that the URI cannot be directly used in the Picker callback to open a file. You need to define a global variable to save the URI and use a button to open the file. For details, see [Reading File Data by URI](#reading-file-data-by-uri).
41
42   You can also [obtain an image or video based on the URI](#obtaining-an-image-or-video-by-uri).
43
44   If metadata needs to be obtained, you can use the [@ohos.file.fs](../../reference/apis-core-file-kit/js-apis-file-fs.md) and [@ohos.file.fileuri](../../reference/apis-core-file-kit/js-apis-file-fileuri.md) APIs to obtain file attribute information, such as the file name, size, access time, modification time, and path, based on the URI.
45
46## Reading File Data by URI
47
481. After the application UI is returned from **Gallery**, use a button to trigger the application's API. Use [fileIo.openSync](../../reference/apis-core-file-kit/js-apis-file-fs.md#fsopensync) to open an image based on the URI. After the image is opened, the FD is returned. Note that the **mode** parameter of **fileIo.openSync()** must be **fileIo.OpenMode.READ_ONLY**.
49
50   ```ts
51   let uri: string = '';
52   let file = fileIo.openSync(uri, fileIo.OpenMode.READ_ONLY);
53   console.info('file fd: ' + file.fd);
54   ```
55
562. Use [fileIo.readSync](../../reference/apis-core-file-kit/js-apis-file-fs.md#readsync) to read the file based on the FD, and close the FD after the data is read.
57
58   ```ts
59   let buffer = new ArrayBuffer(4096);
60   let readLen = fileIo.readSync(file.fd, buffer);
61   console.info('readSync data to file succeed and buffer size is:' + readLen);
62   fileIo.closeSync(file);
63   ```
64
65## Obtaining an Image or Video by URI
66
67After an image or video is selected by Picker, the URI of the image or video is returned. You can obtain the image or video based on the URI. The following example demonstrates how to obtain the image based on the URI **file://media/Photo/1/IMG_datetime_0001/displayName.jpg**.
68
69```ts
70import { dataSharePredicates } from '@kit.ArkData';
71
72const context = getContext(this);
73let phAccessHelper = photoAccessHelper.getPhotoAccessHelper(context);
74
75class MediaDataHandler implements photoAccessHelper.MediaAssetDataHandler<ArrayBuffer> {
76  onDataPrepared(data: ArrayBuffer) {
77    if (data === undefined) {
78      console.error('Error occurred when preparing data');
79      return;
80    }
81    console.info('on image data prepared');
82    // Customize the logic for processing data.
83  }
84}
85
86async function example() {
87  let predicates: dataSharePredicates.DataSharePredicates = new dataSharePredicates.DataSharePredicates();
88  let uri = 'file://media/Photo/1/IMG_datetime_0001/displayName.jpg' // The URI must exist.
89  predicates.equalTo(photoAccessHelper.PhotoKeys.URI, uri.toString());
90  let fetchOptions: photoAccessHelper.FetchOptions = {
91    fetchColumns: [photoAccessHelper.PhotoKeys.TITLE],
92    predicates: predicates
93  };
94
95  try {
96    let fetchResult: photoAccessHelper.FetchResult<photoAccessHelper.PhotoAsset> = await phAccessHelper.getAssets(fetchOptions);
97    let photoAsset: photoAccessHelper.PhotoAsset = await fetchResult.getFirstObject();
98    console.info('getAssets photoAsset.uri : ' + photoAsset.uri);
99    // Obtain the file attribute information, such as the title. If the attribute to obtain is not a default one, add the column name to fetchColumns.
100    console.info('title : ' + photoAsset.get(photoAccessHelper.PhotoKeys.TITLE));
101    // Request image data.
102    let requestOptions: photoAccessHelper.RequestOptions = {
103      deliveryMode: photoAccessHelper.DeliveryMode.HIGH_QUALITY_MODE,
104    }
105    await photoAccessHelper.MediaAssetManager.requestImageData(context, photoAsset, requestOptions, new MediaDataHandler());
106    console.info('requestImageData successfully');
107    fetchResult.close();
108  } catch (err) {
109    console.error('getAssets failed with err: ' + err);
110  }
111}
112```
113