Communicating information between html file and android

Question

I have an HTML file being utilized by webview in an activity. The HTML file makes up a large table that is scrollable in the webview. I want to add some javascript to the HTML file to float an image over the table. I also want this image to change positions on a time interval (every five seconds). I was hoping to accomplish such by using a random number generator to change the coordinates of the floated image every five seconds.

Firstly, is this implementation possible? I am new to javascript, but this doesn't seem like too far-fetched of an idea.

Secondly, I want the floated image to be clickable. And, upon clicking I want information to be placed in a string. My other question is, is there a way to call the string built by the HTML file into another activity in android?

I know my intentions may be unclear to some. If clarification is necessary, please ask. Thanks for any and all help :D

Java does not work in HTML files. You should look into learning JavaScript. — Bryan Herbst, Oct 16 '13 at 13:31
Is it not possible to use javascript in the same webview that the HTML file is loaded into? — Joseph.M, Oct 16 '13 at 13:34
My apologies for the confusion. Can you help shed some insight on whether this idea is possible using javascript, then? — Joseph.M, Oct 16 '13 at 13:42
Yep, it's definitely possible! I'd recommend checking out [this similar SO question](http://stackoverflow.com/q/8341159/1253844) for some tips on how to accomplish it. — Bryan Herbst, Oct 16 '13 at 13:45

Hussain Akhtar Wahid 'Ghouri' · Accepted Answer · 2013-10-16T13:50:19.397

prob 1 : need an image to float

prob 2 : need the image to change direction at fixed time interval

first of all I would suggest you create a gif image which changes direction at every 5 seconds thus your prob 2 is solved

now coming to first prob , use this

String HtmlFileString = "<html style=\"height:90%;width:95%\"><body>" +
                          "<img src=\""+**gif_char**+".gif"+"\" " +
                          "style=\"height:100%;width:100%\"></body></html>";

            webview.loadDataWithBaseURL("file:///android_asset/",HtmlFileString,"text/html", "UTF-8","");

don't forget to keep the gif in asset folder

and also this gif variale you pass by yourself ,

it simply changes the name of your gif so you can show any image anytime you want

just call this line again with diff param for variable gif_char

if you dont want to use the GIF image , you can use a simple image and change the image by loading webview again and again with diff image passed every time

let me try to explain further step 1 : read the html file using buffered reader ,

step 2 : store the file content in a string

step 3 : hange the image resource in html file string

step 4 : pass this html file string to method webview.loadDataWithBaseURL()

And also , Webview doesn't support onclick event but support ontouch event

I'm not sure a gif is what i need. The image is 5000 x 5000 or so pixels. I want the image to translate to various locations across the entire table, not just the screen. Is this possible? Perhaps I didn't understand your answer fully. — Joseph.M, Oct 16 '13 at 13:48

score 0 · Answer 2 · answered Oct 16 '13 at 13:56

To do this you will need a combination of Java and Javascript.

Inserting the image and moving it around will easiest in javascript similar to what is shown above.

To get the return string back out the android application you should look at using

addJavascriptInterface (Object object, String name)

This will allow the javascript to call public functions in the java object that you passed to this function.

This object could then transfer the string to a new activity using the extras bundle in the intent that is used to start the activity

Communicating information between html file and android

2 Answers2