5

I'm currently working on a web portal that needs to be run within an Android Webview as part of a native application. This whole portal is heavily AJAX-based. So whenever a form is submitted, this is done asynchronously. Depending on the response, I need to present a message box saying "Success" or "Error". I'm doing this with jQuery at the moment. The problem is, that the Android Webview won't repaint and thus the message box won't be visible. What helps, is to tap anywhere on the screen. This seems to force the repainting. No what I need to do is:

1) Do the DOM changes in another way so the Android Webview handles it properly.

OR

2) Force a repainting by triggering some (pseudo) events or by using some dirty hack :)

Anyone ever experienced this problem? Any hints are heavily appreciated.

NATOR
  • 505
  • 2
  • 5
  • 14

4 Answers4

4

Watch this video and read this answer. The trick is to use 

    -webkit-transform: translate3d(0,0,0);

css style on the div which needs to be updated. This creates a new layer and animations/updates become smoother.

Community
  • 1
  • 1
Kiran Kumar
  • 1,192
  • 8
  • 10
1

I've never had an issue with it displaying DOM updates from non-Async calls, so perhaps a solution would be to have your asynchronous methods call back to an injected object (WebView.addJavascriptInterface()) - then have that run a call on the UI thread to the Webview to update the UI?

Juan Cortés
  • 20,634
  • 8
  • 68
  • 91
kassim
  • 3,880
  • 3
  • 26
  • 27
1

Just a different thought to have the result you want:

As far as this works via jQuery, have you tried to enable the JavaScript on your WebView? In this way, you should be able to have executed JavaScript code in your WebView (and probably, the changes from jQuery will be visible).

myWebView.getSettings().setJavaScriptEnabled(true);
Nick Louloudakis
  • 5,856
  • 4
  • 41
  • 54
1

Here is how I forced webview to update each time, please see the code at: // WEBVIEW

package com.example.scroll;
// philip r brenan at gmail.com, www.appaapps.com 
import android.app.Activity;
import android.content.Context;
import android.os.Bundle;
import android.util.Log;
import android.webkit.WebView;

public class MainActivity extends Activity
 {protected void onCreate(Bundle savedInstanceState)
   {super.onCreate(savedInstanceState);
    setContentView(new MyWebView(this)); 
   }
  class MyWebView extends WebView 
   {MyWebView(Context Context)
     {super(Context);
      getSettings().setJavaScriptEnabled(true);
      addJavascriptInterface(this, "Android");   
      new Thread()
       {public void run()
         {for(int j = 0; j < 100; ++j)
           {post(new Runnable()
             {public void run()
               {loadData(content(), "text/html", "utf-8"); // Display in browser
               }
             });    
            try {Thread.sleep(5000);} catch(Exception e) {}
           }  
         }
       }.start();
     } 
    int c = 0, C = 1;
    String content() 
     {final StringBuilder s = new StringBuilder();
      //s.append("<html id="+(C++)+"><body>"); // WEBVIEW REFRESHES CORRECTLY *************** 
      s.append("<html><body>");              // WEBVIEW DOES NOT REFRESH ******************

      s.append("<h1 id=11>1111</h1>");
      s.append("<script>location.href = '#22';</script>");
      for(int i = 0; i < 10; ++i) s.append("<p>"+c+c+c); ++c;

      s.append("<h1 id=22>2222</h1>");
      for(int i = 0; i < 10; ++i) s.append("<p>"+c+c+c); ++c;
      Log.e("AAAAAA", "content="+s.toString());
      s.append("</body></html>");
      return s.toString();
     }
   } 
 }