I have a WebView in my Android application that is used to display some data, which I mold into HTML format manually (it is not showing a real webpage, rather I am giving it some HTML to display).
The data is coming from a webservice and therefore needs some time to load. Right now, when users navigate away from this activity and back again, the data will be reloaded from the webservice and shown again, therefore the user has to wait for it to load. However, 9 times out of 10 (even more) the data will be identical to last time so this is just wasted time. Therefore I'm now trying to implement some basic caching:
- whenever the data is received it is cached in memory;
- whenever the same data is requested it is first loaded from memory (if available);
- After loading the cached data, the new data is being loaded from the webservice in the background
- When this background loading completes, the cached data should be 'seamlessly' updated with the new data.
I am having trouble with the last step. Right now I am simply giving the WebView some HTML to deal with:
builder.append("<html><head><link rel=\"stylesheet\" href=\"file:///android_asset/style.css\" type=\"text/css\">");
builder.append("</link>");
builder.append("</head><body>");
builder.append(getBody(data));
builder.append("</body></html>");
webContents.loadDataWithBaseURL("file:///android_asset/", builder.toString(), "text/html", "utf-8", null);
I am simply calling this piece of code first with the cached data, and later (after new data is received) with the updated data.
The result is that the WebView is completely reloaded; it jumps back to the top of the page (most pages are long so users will have scrolled down a bit), and even worse it goes blank for a fraction of a second and then starts to reload everything (especially noticeable when there are images it has to display).
I want to avoid this noticeable update of data. I am fine with small changes suddenly popping up (like a piece of text in the middle becoming slightly longer resulting in the page scrolling a little), but scrolling completely to the top is very annoying, and going completely blank and having to reload everything is really unacceptable.
Is there anything clever I can do here to avoid these issues? Can I 'update' the HTML of the WebView without having it completely reload everything? Thanks!
You are going to have to make your WebView behave as if it was a webapp. Every time you are calling loadDataWithURL you are reloading the page as if it was fresh.
One way to avoid this is to have JavaScript interface with the Java side of the code through a JavaScript bridge. By passing the data from the Java side to a JavaScript function you can updated your WebView ui without doing a full reload.
Once you have the data in the WebView, updating the HTML is dependent on what your view looks like.
There are a number of demos available if you search on 'JavaScript DOM updating' and 'Android JavaScript bridge'.