How to use Dart HTML's DirectoryEntry and DirectoryReader classes?

Issue

I need an example for using the DirectoryEntry and DirectoryReader classes in Dart:HTML. The following code read an image file from img directory and load it as an image element in the browser.

import 'dart:html';

void main() {
  ImageElement image = new ImageElement(src: 'img/car.jpg');
  querySelector('body').append(image);
}

Here is the structure of my webapp directory:

webapp directory's structure

I need to dynamically list and use the content of img directory.

Solution

‘img/car.jpg’ is a file on the server which the browser requests from your server when you assign the path to an <img> element.
DirectoryEntry and DirectoryReader work on the client only.

What you need is that the server provides an API (e.g. JSON) that lets you request a list of files/directories from your server (e.g. of your img directory).
If your server has directory listing enabled you could alternatively send a simple HTTP request with /img as URL and parse the response.

Answered By – Günter Zöchbauer

Answer Checked By – Timothy Miller (FlutterFixes Admin)

Leave a Reply

Your email address will not be published. Required fields are marked *