Android and JS call each other

Source: Internet
Author: User
Have something to say:

This article mainly summarizes the simple method of invoking Android and JS to each other.

In the development process encountered the need to call the JS method in wirelessly needs, so the specific implementation process is always formed this blog.

Effect:

Where the "call the Android Method" button is the HTML button; the "Invoke JS Method" button is the button in the app.

Local HTML:

First, create a new assets folder in the app root directory and create a new local HTML file within the folder, such as

Then write a simple HTML file:

1 <HTMLLang= "ZH-CN">2 <PID= ' P '>Hello World</P>3 4 <Script>5         functionTest () {6 document.getElementById ("P"). InnerHTML+= "Hi there! "7         }8 </Script>9 Ten <Buttononclick= "Justtest.hello (' JS call Android Method! ')">Call the Android method</Button> One  A </HTML>

Android Layout file:
1 <?XML version= "1.0" encoding= "Utf-8"?>2 <LinearLayoutxmlns:android= "Http://schemas.android.com/apk/res/android"3 Xmlns:tools= "Http://schemas.android.com/tools"4 Android:layout_width= "Match_parent"5 Android:layout_height= "Match_parent"6 android:orientation= "vertical"7 Tools:context=". Mainactivity ">8 9     <WebViewTen         Android:id= "@+id/webview" One Android:layout_width= "Wrap_content" A Android:layout_height= "Wrap_content" /> -  -     <Button the         Android:id= "@+id/btn" - Android:layout_width= "Wrap_content" - Android:layout_height= "Wrap_content" - Android:text= "Invoke JS method" /> +  - </LinearLayout>
Android Call JS Method:

As you can see, there is already a test function in the local HTML, and the test function is called in wirelessly.

To load the local HTML file:
1 webView = Findviewbyid (r.id.webview); 2 webview.getsettings (). setjavascriptenabled (true); 3 webview.loadurl ("file:///android_asset/show.html");

To define a click event for a button:
1 Button btn = Findviewbyid (r.id.btn); 2 3 btn.setonclicklistener (new  View.onclicklistener () {4    @Override 5      Public void OnClick (View v) {6        Testjs (); 7     }8 });

Where the Testjs code is:

1 @SuppressLint ("setjavascriptenabled")2publicvoid  Testjs () {  3     webview.loadurl ("Javascript:test ()"); 4 }

On this basis, the implementation of the Android call JS method.

JS calls the Android method: first, you need to define the called method in the activity:
1 @JavascriptInterface 2  Public void Hello (String msg) {3     Toast.maketext (This, MSG, Toast.length_short). Show (); 4 }
And you need to bind the Java object to WebView:
1 webview.addjavascriptinterface (This, "justtest");
Finally, this method is called in JS:
1 <  onclick= "Justtest.hello (' JS call Android Method! ') '> Call the Android method </button>

This makes it possible to invoke the Android method in JS.

Summarize:

Because the work is busy, long time did not write the blog.

I will take time to summarize what I have learned at work.

This blog wrote a very simple demo, but Android and JS call each other in the actual development is very useful, specifically to do a summary.

If you have any questions or suggestions can be comments or e-mail to contact me, welcome comments ~

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

Tags Index: