File picker for iOS

4 posts, 0 answers
  1. Dimitar
    Dimitar avatar
    45 posts
    Member since:
    May 2014

    Posted 15 Aug Link to this post

    Hello, 

    I need to select a pdf file from iOS and upload to firebase cloud and to a local device. For Android I see there is a file picker plugin, but what are the options for 

    iOS. 

     

     

  2. Nikolay Iliev
    Admin
    Nikolay Iliev avatar
    294 posts

    Posted 16 Aug Link to this post

    Hello Dimitar,

    There is no NativeScript plugin for iOS for file picking. 
    However, you can implement this functionality with the file-system module.
    What we would need is that the file is in an accessible folder (documents, currentApp or temp)
    e.g.
    import * as fs from "file-system";
     
    let documents = fs.knownFolders.documents(); // documents folder on iOS device
    let currentApp = fs.knownFolders.currentApp(); // the current applicaiton "app" folder
    let temp = fs.knownFolders.temp(); // the device temp folder
     
    console.log("currentApp: " + currentApp.path);
     
    let file = currentApp.getFile("sample-pdf.pdf");
    console.log("file.path: " + file.path);

    The example above shows how to pick a file located in <my-project>/app/sample-pdf.pdf

    Regarding the second part of your question (uploading to firebase or local device).
    You can use nativescript-plugin-firebase and create a Firebase bucket to use the storage functionality of Firebase. Once your firebase plugin and account is set you can easily upload the file we had picked earlier
    // determine the path to a file in the app/res folder
    var filePath = file.path;
     
    // now upload the file with either of the options below:
    firebase.uploadFile({
      // optional, can also be passed during init() as 'storageBucket' param so we can cache it (find it in the Firebase console)
      // the full path of the file in your Firebase storage (folders will be created)
      remoteFullPath: 'uploads/PDF/sample-pdf.pdf',
      // option 1: a file-system module File object
      localFile: fs.File.fromPath(filePath),
      // option 2: a full file path (ignored if 'localFile' is set)
      localFullPath: filePath,
      // get notified of file upload progress
      onProgress: function(status) {
        console.log("Uploaded fraction: " + status.fractionCompleted);
        console.log("Percentage complete: " + status.percentageCompleted);
      }
    }).then(
        function (uploadedFile) {
          console.log("File uploaded: " + JSON.stringify(uploadedFile));
        },
        function (error) {
          console.log("File upload error: " + error);
        }
    );


    Regards,
    Nikolay Iliev
    Progress Telerik
    Did you know that you can open private support tickets which are reviewed and answered within 24h by the same team who built the components? This is available in our UI for NativeScript Pro + Support offering.
  3. Dimitar
    Dimitar avatar
    45 posts
    Member since:
    May 2014

    Posted 16 Aug in reply to Nikolay Iliev Link to this post

    Ok, thank you. The only think which I didn't understand is for iOS how I could show to the user some kind of file explorer to chose from its device , or this is not possible. 
  4. Nikolay Iliev
    Admin
    Nikolay Iliev avatar
    294 posts

    Posted 16 Aug Link to this post

    Hello Dimitar,

    Indeed the wanted functionality is not available out-of-the-box.
    A possible solution that comes to mind would be to use ListPicker and provide the list of available files as items for the picker. When the users select the wanted file you can proceed with its choice with the flow described in our previous threads.

    Regards,
    Nikolay Iliev
    Progress Telerik
    Did you know that you can open private support tickets which are reviewed and answered within 24h by the same team who built the components? This is available in our UI for NativeScript Pro + Support offering.
Back to Top