how to display folders and sub folders from dir in my app

Question

i was create a simple windows-8 stroe javascript apps ( photo application ), in my application want to show my assets folder for users to pick images how to show my folder

Answer 1

Hi,

You can get the folder uri with follow code:

var uri = new Windows.Foundation.Uri("ms-appx:///app_data/myfile.data")

And you can get images in folder with follow code:

function getImage() {
        // get all the files in the picturesLibrary
        Windows.Storage.KnownFolders.picturesLibrary.getFilesAsync().then(function (files) {
            // get only one of the files, just to show it can be done
            var file = files.getAt(1);
            // set the src attribute to the URL you create from the file object.
            theImage.src = URL.createObjectURL(file);

        });
        

    }

#Using HTML5/Javascript in Windows Store apps: Data access and storage mechanism

http://blogs.msdn.com/b/win8devsupport/archive/2012/12/19/using-html5-javascript-in-windows-store-apps-data-access-and-storage-mechanism-ii.aspx

---

Roy
MSDN Community Support | Feedback to us
Develop and promote your apps in Windows Store
Please remember to mark the replies as answers if they help and unmark them if they provide no help.

Answer 2

Hi srini2,

In most cases, if you want to let user pick up some files from the device, the "file pickerr" component is recommended. By using File picker, you do not need to explicitly declare the certain folder access capabilities for those well-known folders (like picture library, video library...).

#Quickstart: Accessing files with file pickers(Windows Store apps using JavaScript and HTML) (Windows)
http://msdn.microsoft.com/en-us/library/windows/apps/hh465199.aspx

And if you want to build your own "file explorer" like UI to let user view all the files exists in a certain local or temp folder (of our windows store app), you can try using the "GetItemsAsync" method of StorageFolder class to enumerate files and folder info of a given folder (either well-know folders or local/temp folder of a windows store app).

#StorageFolder.GetItemsAsync() | getItemsAsync() method (Windows)
http://msdn.microsoft.com/en-us/library/windows/apps/br227286.aspx

e.g.

function loopLocalFolder() {
        Windows.Storage.ApplicationData.current.localFolder.getFolderAsync("test").then(
            function (folder) {
                return folder.getItemsAsync();
            }
        ).done(
            function (itemsInFolder) {
                console.log("items in folder: " + itemsInFolder.size + "");
                itemsInFolder.forEach(function (item) {
                    if (item.isOfType(Windows.Storage.StorageItemTypes.folder)) {
                        console.log("\r\n" + item.name + "\\");
                    } else {
                        console.log("\r\n" + item.name);
                    }
                });
            },
            function (err) {
                console.log("error: " + err);
            }
        );
        
    }

you can also take a look at the following sdk samples for more ideas about file/folder enumeration:

#File and folder thumbnail sample
http://code.msdn.microsoft.com/windowsapps/File-thumbnails-sample-17575959

#Folder enumeration sample
http://code.msdn.microsoft.com/windowsapps/Folder-enumeration-sample-33ebd000

 

 

---

Please remember to mark the replies as answers if they help and unmark them if they provide no help.

Answer 3

thanks for your guide i want get file from my application folder something like this  example

when the user presses the background button, a Flyout appears above the button that flyout show my background folder  images

Answer 4

Thanks for your guide.

I am trying your code , i got this error: WinRTError: The system cannot find the file specified

my folder structure

 PhotoAppSample ---folder name

  -->css   ---subfolder

  -->js       ---subfolder

  -->images    ---subfolder

my code

Windows.Storage.ApplicationData.current.localFolder.getFolderAsync("images")