How do you input image to webviewer?

I am trying to load an image from phone to Webviewer component via HTML file.

I first tried the HTML input element and then retrieving it using JQuery. However, the file select dialog does not pop up, like it does on desktop.

What are my options? Can I make the html input element work by setting some permissions in the manifest?

Can I use image picker and pass the selected image to the Webviewer?

1 Like

Hi Sarker

First option would be to view the image via an image component instead of a web view. Otherwise, you need to make an HTML page template that you can load into your App, modify the full path to the image, save, display in a web view.

1 Like
1 Like

Also

1 Like

@TIMAI2 In the following JS, can I use image picker and then pass the reference to the html file using webviewstring?

<script>

	// set webviewstring in AppInventor to "<imagefilename>,altText"
	// no commas in the altText !
	
	var img = window.AppInventor.getWebViewString();
	document.getElementById("myImage").src = img.split(",")[0];
	document.getElementById("myImage").alt = img.split(",")[1]; 
</script>

You will have to check and amend the file url. on my companion emulator:

1 Like

Ah got it! Thanks! So image picker returns a reference, and not a binary file.

returns a relative link to the file, you need to make an absolute uri for the html to work

1 Like

And why is the html < input... not working in the app?
Does that require any added persmissions to run?

It would really help if you provided a screenshot of your relevant blocks as well as the complete html, so we can see what you are trying to do, and where the problem may be.

Taifun


Trying to push the limits! Snippets, Tutorials and Extensions from Pura Vida Apps by Taifun.

1 Like

The webviewer has no access to the android filesystem.

1 Like

I have problem too
I code it to show image into wedview.
But can't show.
I try with image component, it works.
Please, can you teach me : i wrong?

the file omponent can read only text files, but not images...
so why are you using the file component to read an image?

actually @TIMAI2 already answered your question...

generally use Do it to debug your blocks, see also tip 4 here App Inventor: How to Learn | Pura Vida Apps
see also Live Development, Testing, and Debugging Tools
Taifun


Trying to push the limits! Snippets, Tutorials and Extensions from Pura Vida Apps by icon24 Taifun.

@ Taifun, i try building zoom chat like this.

i have list history chat , and all imgae saved at google drive.
Now, i show all by html in wedview.
it words.
but after i send a new messenger, or have new mesenger from my friends in groups.
it need reload all ( Text, and image) from google drive..
Now i want save all data to phone, after i sent new mesenger or have new mesenger. i only load it.
Can you teach me : another way to solve it ?
Many thanks :grinning:

Does by using "text-join" component to "file//imagepicker1selection" give absolute path for html in webviewer?

Second question, what about absolute paths for document files and downloads on the device?

Thank you very much for taking the time to answer my question.

Use Do it to find it out yourself. .

use Do it to debug your blocks, see also tip 4 here App Inventor: How to Learn | Pura Vida Apps
see also Live Development, Testing, and Debugging Tools
Taifun


Trying to push the limits! Snippets, Tutorials and Extensions from Pura Vida Apps by icon24 Taifun.

Thanks Taifun, please enlighten me for my second question (what about absolute paths for document files and downloads on the device?)

Thank you very much for taking the time to answer my question.

Please provide a screenshot of some relevant blocks to understand, what exactly you are talking about..

Taifun

I imagined that I could find and access files in the downloads or document folder, but in reality it only entered a list of files that I didn't recognize from the device (no document or download files)