WebView、JavaScriptの連携

WebView、JavaScriptの連携




先ず、この資料を参考します。http://www.allenj.net/?p=2704

Androidのプログラムは以下です。

public class WebViewEx extends Activity {
    private WebView webView;
    private Handler handler;

    @Override
    public void onCreate(Bundle icicle) {
        super.onCreate(icicle);
        requestWindowFeature(Window.FEATURE_NO_TITLE);

     
        handler=new Handler();  
     
     
        webView=new WebView(this);    
        WebSettings settings=webView.getSettings();
        settings.setJavaScriptEnabled(true);
        settings.setSavePassword(false);
        settings.setSaveFormData(false);
        settings.setSupportZoom(false);

     
        webView.addJavascriptInterface(new JSInterface(),"demo");
     
     
        webView.setWebChromeClient(new ChromeClient());
     
     
        webView.loadUrl("file:///android_asset/sample.html");
        setContentView(webView);
    }

 
    public final class JSInterface {
     
        public JSInterface() {
        }

   
        public void onClick() {
            handler.post(new Runnable() {
                public void run() {
                    android.util.Log.e("Test","changeImage");
                    webView.loadUrl("javascript:changeImage()");
                }
            });
        }
    }

 
    public final class ChromeClient extends WebChromeClient {
        @Override
        public boolean onJsAlert(WebView view,String url,String message,JsResult result) {
            android.util.Log.e("",message);
            result.confirm();
            return true;
        }
    }
}

>JavaScriptのプログラムは以下です。

<html>
<head>
<script language="javascript">
var id=0;
function changeImage() {
alert("A");
id=(id==0)?1:0;
document.getElementById("image").src=id+".jpg";
alert("B");
}
</script>
</head>
<body>
<a onClick="window.demo.onClick()">
<img id="image" src="0.jpg"/></a>
</body>
</html>

留言