Selecting User Files

If your application needs to support share and saving of user files (such as images and videos), you can use OpenHarmony FilePicker to implement selection and saving of user files.

The FilePicker provides the following interfaces by file type:

Selecting Images or Video Files

  1. Import the picker module and fs module.

    import picker from '@ohos.file.picker';
    import fs from '@ohos.file.fs';
    
  2. Create a photoSelectOptions instance.

    const photoSelectOptions = new picker.PhotoSelectOptions();
    
  3. Set the file type and the maximum number of media files to select. For example, select a maximum of five images. For details about the media file type, see PhotoViewMIMETypes.

    photoSelectOptions.MIMEType = picker.PhotoViewMIMETypes.IMAGE_TYPE; // Select images.
    photoSelectOptions.maxSelectNumber = 5; // Set the maximum number of images to select.
    
  4. Create a photoPicker instance and call select() to open the FilePicker page for the user to select files. After the files are selected, PhotoSelectResult is returned.


    The permission on the URIs returned by select() is read-only. Further file operations can be performed based on the URIs in the PhotoSelectResult. 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 trigger file opening.

    let URI = null;
    const photoViewPicker = new picker.PhotoViewPicker();
    photoViewPicker.select(photoSelectOptions).then((photoSelectResult) => {
      URI = photoSelectResult.photoUris[0];
      console.info('photoViewPicker.select to file succeed and URI is:' + URI);
    }).catch((err) => {
      console.error(`Invoke photoViewPicker.select failed, code is ${err.code}, message is ${err.message}`);
    })
    
  5. Use a button to trigger invocation of other functions. Use fs.openSync() to open the file based on the URI and obtain the FD. Note that the mode parameter of fs.openSync() must be fs.OpenMode.READ_ONLY.

    let file = fs.openSync(URI, fs.OpenMode.READ_ONLY);
    console.info('file fd: ' + file.fd);
    
  6. Use fs.readSync() to read the file data based on the FD. After the data is read, close the FD.

    let buffer = new ArrayBuffer(4096);
    let readLen = fs.readSync(file.fd, buffer);
    console.info('readSync data to file succeed and buffer size is:' + readLen);
    fs.closeSync(file);
    

Selecting Documents

  1. Import the picker module and fs module.

    import picker from '@ohos.file.picker';
    import fs from '@ohos.file.fs';
    
  2. Create a documentSelectOptions instance.

    const documentSelectOptions = new picker.DocumentSelectOptions(); 
    
  3. Create a documentViewPicker instance, and call select() to open the FilePicker page for the user to select documents. After the documents are selected, a result set containing the file URIs is returned.


    The permission on the URIs returned by select() is read-only. Further file operations can be performed based on the URIs in the result set. 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 trigger file opening.


    For example, you can use file management APIs to obtain file attribute information, such as the file size, access time, and last modification time, based on the URI. If you need to obtain the file name, use startAbilityForResult.

    NOTE

    Currently, DocumentSelectOptions is not configurable. By default, all types of user files are selected.

    let URI = null;
    const documentViewPicker = new picker.DocumentViewPicker(); // Create a documentViewPicker instance.
    documentViewPicker.select(documentSelectOptions).then((documentSelectResult) => {
      URI = documentSelectResult[0];
      console.info('documentViewPicker.select to file succeed and URI is:' + URI);
    }).catch((err) => {
      console.error(`Invoke documentViewPicker.select failed, code is ${err.code}, message is ${err.message}`);
    })
    

    NOTE

    Currently, DocumentSelectOptions does not provide the method for obtaining the file name. To obtain the file name, use startAbilityForResult().

    let config = {
      action: 'ohos.want.action.OPEN_FILE',
      parameters: {
        startMode: 'choose',
      }
    }
    try {
      let result = await context.startAbilityForResult(config, {windowMode: 1});
      if (result.resultCode !== 0) {
        console.error(`documentViewPicker.select failed, code is ${result.resultCode}, message is ${result.want.parameters.message}`);
        return;
      }
      // Obtain the URI of the document.
      let select_item_list = result.want.parameters.select_item_list;
      // Obtain the name of the document.
      let file_name_list = result.want.parameters.file_name_list;
    } catch (err) {
      console.error(`Invoke documentViewPicker.select failed, code is ${err.code}, message is ${err.message}`);
    }
    
  4. Use a button to trigger invocation of other functions. Use fs.openSync() to open the file based on the URI and obtain the FD. Note that the mode parameter of fs.openSync() must be fs.OpenMode.READ_ONLY.

    let file = fs.openSync(URI, fs.OpenMode.READ_ONLY);
    console.info('file fd: ' + file.fd);
    
  5. Use fs.readSync() to read the file data based on the FD. After the data is read, close the FD.

    let buffer = new ArrayBuffer(4096);
    let readLen = fs.readSync(file.fd, buffer);
    console.info('readSync data to file succeed and buffer size is:' + readLen);
    fs.closeSync(file);
    

Selecting an Audio File

  1. Import the picker module and fs module.

    import picker from '@ohos.file.picker';
    import fs from '@ohos.file.fs';
    
  2. Create an audioSelectOptions instance.

    const audioSelectOptions = new picker.AudioSelectOptions();
    
  3. Create an audioViewPicker instance, and call select() to open the FilePicker page for the user to select audio files. After the files are selected, a result set containing the URIs of the audio files selected is returned.


    The permission on the URIs returned by select() is read-only. Further file operations can be performed based on the URIs in the result set. 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 trigger file opening.


    For example, use the file management interface to obtain the file handle (FD) of the audio clip based on the URI, and then develop the audio playback function based on the media service. For details, see Audio Playback Development.

    NOTE

    Currently, AudioSelectOptions is not configurable. By default, all types of user files are selected.

    let URI = null;
    const audioViewPicker = new picker.AudioViewPicker();
    audioViewPicker.select(audioSelectOptions).then(audioSelectResult => {
      URI = audioSelectOptions[0];
      console.info('audioViewPicker.select to file succeed and URI is:' + URI);
    }).catch((err) => {
      console.error(`Invoke audioViewPicker.select failed, code is ${err.code}, message is ${err.message}`);
    })
    
  4. Use a button to trigger invocation of other functions. Use fs.openSync() to open the file based on the URI and obtain the FD. Note that the mode parameter of fs.openSync() must be fs.OpenMode.READ_ONLY.

    let file = fs.openSync(URI, fs.OpenMode.READ_ONLY);
    console.info('file fd: ' + file.fd);
    
  5. Use fs.readSync() to read the file data based on the FD. After the data is read, close the FD.

    let buffer = new ArrayBuffer(4096);
    let readLen = fs.readSync(file.fd, buffer);
    console.info('readSync data to file succeed and buffer size is:' + readLen);
    fs.closeSync(file);