Help loading a local html file on a WebViewer with WebView.loadUrl()

[rodrigomellogarcia]

I'm trying to load a custom local html file into a WebViewer using WebView.LoadUrl(), but I can't seem to find the correct path to it.

Path to the class calling the WebView.LoadUrl() function:
appinventor-extensions\appinventor\components\src\tmice\src\br\ufsc\gqs\teachablemachineimageclassifier\TeachableMachineImageClassifier.java

Path to the html file:
appinventor-extensions\appinventor\components\src\tmice\src\br\ufsc\gqs\teachablemachineimageclassifier\assets\teachable_machine_image_classifier.html

(In other words, the html file is at /assets, relatively to the class calling it.)

To pass this path as a parameter to WebView.LoadUrl(), I've tried:

1. Using an absolute path according to Anke's post (/storage/emulated/0/Android/data/edu.mit.appinventor.aicompanion3/files/assets/teachable_machine_image_classifier.html)
2. Using getAssetPathForExtension() passing "teachable_machine_image_classifier.html" as the asset parameter.

What is the correct way to access this html file, both in a AI2 Companion-emulated and compiled Apps?
Is getAssetPathForExtension() the correct way to get the html's path? If so, how do I reference it as an asset?

[TIMAI2]

You need to do something different if your html file is in the assets folder of your extension.

This is some code I used to "get" an html file from the extension's assets into a string:

//load html file from extension assets
    final StringBuilder gethtml = new StringBuilder();
    try {
      final InputStream is = form.openAssetForExtension(this, "myfile.html");
      int character = is.read();
      while (character != -1) {
        getcss.append((char) character);
        character = is.read();
      }
    } catch (IOException e) {
      e.printStackTrace();
    }
    myhtml = gethtml.toString();

Now you have your html file as a string, you can set this to a new temporary file and display it in a webviewer. Here is another example:

//create html file
    try {
      java.io.File file = File.createTempFile("display", ".html");
      filePath = file.getAbsolutePath();
      FileWriter filewriter = new FileWriter(file);
      filewriter.write(html);
      filewriter.close();
      file.deleteOnExit();
    } catch (IOException e) {
      Log.e(LOG_TAG, "IOException", e);
    }
    //show html
    webViewer.GoToUrl("file://" + filePath);

[Kevinkun]

this.webView.loadUrl(form.getAssetPathForExtension(this, "baidumap-gl.html"));

I always use this to load html in extension asset.
Did you use @UseAssets to pick up your assets into your extension?

[rodrigomellogarcia]

I did

@UsesAssets(fileNames = "teachable_machine_image_classifier.html, teachable_machine_image_classifier.js, tfjs-0.13.2.js, jquery-3.5.1.min.js, teachablemachine-image.min.js, tf.min.js")

But opening the projects .aia file, I failed to find them

I'm posting the .aia file if you wish to check it out yourself

TMICE.aia (203.2 KB)

[Kevinkun]

you need unzip your aix file to see if the assets are there.
if no, then it's problem when you complile your extension.

[Patryk_F]

You are probably compiling in extension template. Here even the icon is not added correctly. Try compiling in ai2 sources.

[rodrigomellogarcia]

Found the problem. The extension's src directory wasn't in the correct place.