Home > Industries > Software
First of all, I need to say a few words. I am tired of writing VC over the past few days. Suddenly I don't want to write VC any more. I have an Android mobile phone in my hand, playing in the middle of the night every day, it's really sad that I have never written such a program. So I want to write this program and use the habit of taking care of the VC program. The first program is of course Hello world. There were no major problems at the beginning. When I wanted to write a Q * member program later, I found that the android interface layout was really difficult, it's hard to figure it out. Something like. I was so angry that I thought that I had not encountered such an interface problem when I wrote the VC for such a long time ..
When I was watching a video from someone else's Daniel on verycd, I heard people say that HTML can be used as the android UI, which not only brightened my eyes. I have studied HTML development. Although I am not familiar with it, it is much better than this XML. It is really big for the xml header... as a result, the HTML interface of andriod is basically irrelevant to the content I have read. Because I am a cainiao, I want to find a group. I will look for a great guy and ask, who knows, after I get in, I am XXX, and I am actually charged, I am XX, its Oo, android is open-source. If you have any questions, you still have to pay for them. What is the morality. At that time, I vowed to learn, write articles online, and charge you for XX oo.
It's much more comfortable to vent. OK, I won't say much about it. Next, let's start the tutorial on webview HTML of Android. Here I will give you a video tutorial on the html ui of daniu in China, but I didn't understand what he told me.
21.android's UI design skill .rar or watch the 3G mobile phone Android app development daily course 1. Use the HTML design software interface. Avi's old man's video also needs to use the androiddevelopment video tutorial 0202_12_jsondata .mp4 as the basis. If you are a good guy, you must understand it. Next we will go to the development tutorial of our food class.
21.android's UI design skill .rar ed2k: // | file | medium | 31469120 | medium | H = dxrchv3adrzynucrnnf4desotxnbzeal |/3G mobile phone Android app development daily course 1. use HTML to design the software interface. avied2k: // | file | 3G % E6 % 89% 8B % E6 % 9C % baandroid % E5 % Ba % 94% E7 % 94% A8 % E5 % BC % 80% E5 % 8f % 91% E7 % AC % E5 % 85% AB % E5 % A4 % A9 % E8 % af % be % E7 % A8 % 8b1.% E9 % 87% 87% E7 % 94% a8html % E8 % AE % be % E8 % AE % a1 % E8 % BD % af % E4 % BB % B6 % E7 % 95% 8C % E9 % 9d % a2.avi | 45930496 | fff4499772c89db13d1ea8107ba52086 |/Android development video tutorial] 02_12_json data solution ed2k: // | file | records | 61184962 | e183bbb0e241dd21ed534afdab84b5e4 | H = c7n7qzrmvutyt34z2xlt73irudlkqrhg |/
As this is the first-stage webview, I will write the simplest article, so that you can cyclically learn how to use addjavascriptinterface.
Here we reference a Google example. Below is a dome address provided by Google: Click to open the link.
Let's first look at its HTML file. The HTML file path is: Click to open the link
His code is:
<HTML> <script language = "JavaScript">/* this function is invoked by the activity * // * the picture of the activity called by the activity can be connected to it. download android_waving.png */function wave () {/* here is a javascript custom function, which is called in the android program and not in HTML */document. getelementbyid ("droid "). src = "android_waving.png" ;}</SCRIPT> <body> <! -- Callinto the Javascript interface for the activity --> <! -- Call the function in activity from the HTML file --> <! -- From HTML to Android, pay attention to window. demo. clickonandroid () --> <a onclick = "window. demo. clickonandroid () "> <Div style =" width: 80px; margin: 0px auto; padding: 10px; text-align: center; Border: 2px solid #202020; "> <! -- The default image format is android_normal.png --> <br> click me! </Div> </a> </body>
I made a comment here, and you may not understand it. It doesn't matter. Let's look at the activity code. Click Open Link
Because of his long source code, I have not added many of them. I just need to paste the important part... it seems that all of them are important.
Package COM. google. android. webviewdemo; import android. app. activity; import android. OS. bundle; import android. OS. handler; import android. util. log; import android. webKit. jsresult; import android. webKit. webchromeclient; import android. webKit. websettings; import android. webKit. webviewpublic class webviewdemo extends activity {Private Static final string log_tag = "webviewdemo"; private webview mwebview; priv Ate handler mhandler = new handler (); @ override public void oncreate (bundle icicle) {super. oncreate (icicle); setcontentview (R. layout. main); mwebview = (webview) findviewbyid (R. id. webview); websettings = mwebview. getsettings (); websettings. setsavepassword (false); websettings. setsaveformdata (false); // The following sentence is required, and JavaScript must be enabled. Otherwise, everything is in vain websettings. setjavascriptenabled (true); websett Ings. setsuppzoom zoom (false); mwebview. setwebchromeclient (New mywebchromeclient (); // here we use addjavascriptinterface, which is the key of our focus. // Let's look at its demojavascriptinterface class. This class must also be mwebview in the main thread. addjavascriptinterface (New demojavascriptinterface (), "Demo"); mwebview. loadurl ("file: // android_asset/demo.html");} // It defines an object final class demojavascriptinterface provided by addjavascriptinterface {demojavascriptinterface () {}/*** this is not called on the UI thread. post a runnable to invoke * this is not an appeal interface thread. Publish a running call * loadurl on the UI thread. * loadurl In the UI thread. */Public void clickonandroid () {// note the name here. It is clickonandroid (). Note: Pay attention to mhandler. post (New runnable () {public void run () {// call the JavaScript function mwebview in HTML here. loadurl ("javascript: Wave ()") ;}}}// offline code can be skipped, for debugging ///////////////////////////////////// //////////////////////////////////////// //// // /// *** provides a hook for calling "alert" from JavaScript. useful for * provides a "prompt box" from JavaScript ". This is useful for * debugging your Javascript. * debugging your JavaScript. */Final class mywebchromeclient extends webchromeclient {@ override public Boolean onjsalert (webview view, string URL, string message, jsresult result) {log. D (log_tag, message); result. confirm (); Return true ;}}}
Here I also made a comment. Here he defines a clickonandroid () function in his class. I can't remember the window we saw in HTML. demo. clickonandroid. If you forget it, go over and check it again, especially when I want to pay attention to it. Yes, here clickonandroid () is a function in our android program. You may ask why windows. Demo. here we can see
mWebView.addJavascriptInterface(new DemoJavaScriptInterface(), "demo");
This sentence is followed by a demo character. I can understand it as addjavascriptinterface.
The first parameter of is a method in HTML. Of course, I prefer to call it a function. Demo is an object... I am not very familiar with it. As for this window, I don't know why I only know that writing a program in this way can run correctly. If you know what this is, could you please tell me in the message board below?
Now I know how to call an android method in HTML. This is actually so simple, but I didn't try to tell whether the demo character is case sensitive. If you are interested, you can try whether it is case sensitive. Now that I know how to call the android method from HTML, I will try again later. How does it go from Android to HTML. In fact, this is very simple, as long as you use
mWebView.loadUrl("javascript:wave()");
This sentence is enough.
In this way, I have explained a demo provided by Google. Next, let me give it a try. Let's try his demo. Because the source code is provided, I will not post it. You can simply paste the source code to achieve this.
In the next set, I will show you how to use addjavascriptinterface to obtain a return value from a JavaScript function. Not many articles, please forgive me
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
