Home > Developer > Android

Android uses Webwiew to load page usage examples (Hybrid app development) _android

Source: Internet
Author: User
Developer on Alibaba Coud: Build your first app with APIs, SDKs, and tutorials on the Alibaba Cloud. Read more ＞

Hybrid APP is the acronym for mixed-mode applications, with the advantages of Native app and web App two models, low development cost, and a cross-platform feature of web technology. At present, the middleware-based mobile development framework is known as the Hybrid development model, such as foreign PhoneGap, titanium, Sencha, as well as domestic appcan, Rexsee and so on. The Hybrid APP development model is being recognized by more and more companies and developers, and is believed to be the mainstream mobile application development model in the future.

The principle of Hybrid app Fusion Web app is to embed a webview component that can load pages in this component, equivalent to an embedded browser, with the following code:

Copy Code code as follows:

Import android.app.Activity;
Import Android.os.Bundle;
Import android.webkit.WebSettings;
Import Android.webkit.WebView;

public class Aactivity extends activity{

@Override
public void OnCreate (Bundle savedinstancestate) {
Super.oncreate (savedinstancestate);
Create WebView
WebView webview= New WebView (this);
Switch to content view
Setcontentview (WebView);
Get WebView Configuration
WebSettings ws = Webview.getsettings ();
Enable JavaScript
Ws.setjavascriptenabled (TRUE);
Load a page under the assets directory
Webview.loadurl ("file:///android_asset/www/BoBox/index.html");
}
}

Another way to introduce this is to add the WebView component to the layout file as follows:

Copy Code code as follows:

<?xml version= "1.0" encoding= "Utf-8"?>
<linearlayout xmlns:android= "Http://schemas.android.com/apk/res/android"
android:orientation= "Vertical"
Android:layout_width= "Fill_parent"
android:layout_height= "Fill_parent" >
<webview
Android:layout_width= "Fill_parent"
android:layout_height= "Wrap_content"
Android:id= "@+id/webview"
/>
</LinearLayout>

Copy Code code as follows:

Import android.app.Activity;
Import Android.os.Bundle;
Import android.webkit.WebSettings;
Import Android.webkit.WebView;

public class Bactivity extends activity{

@Override
public void OnCreate (Bundle savedinstancestate) {
Super.oncreate (savedinstancestate);
Setcontentview (R.layout.webview);
Find WebView
WebView WebView = (webview) Findviewbyid (R.id.webview);
Get WebView Configuration
WebSettings ws = Webview.getsettings ();
Enable JavaScript
Ws.setjavascriptenabled (TRUE);
A page that is loaded into the assets directory
Webview.loadurl ("file:///android_asset/www/index.html");
}
}

WebView also has a very important method--addjavascriptinterface that can be used to implement the invocation of Java programs and JavaScript programs, the code is as follows:

Copy Code code as follows:

Webview.addjavascriptinterface (New Object () {
public void Clickonandroid () {
Mhandler.post (New Runnable () {
public void Run () {
Webview.loadurl ("Javascript:wave ()");
}
});
}
}, "demo");

The page code is as follows:

Copy Code code as follows:

<script>
Function Wave () {
document.getElementById ("id"). InnerHTML = "Hello world!";
}
</script>
<body>
<div>
<a href= "#" id= "demo" onclick= "Window.demo.clickOnAndroid ()" >click me</a>
</div>
</body>

This way, when you click on the page click the Me button, you will invoke the Clickonandroid function in the Java code, and the Clickonandroid function calls the Wave method in the page. Note that this interface is running in the Android 2.3 version of the emulator, causing the webview to crash and has not yet been repaired. This is a very simple demo Java and JavaScript to invoke each other example, in the actual application of the page call in the Clickonandroid function can call the camera, address book, notification reminders and other device functions.

This article is an English version of an article which is originally in the Chinese language on aliyun.com and is provided for information purposes only. This website makes no representation or warranty of any kind, either expressed or implied, as to the accuracy, completeness ownership or reliability of the article or any translations thereof. If you have any concerns or complaints relating to the article, please send an email, providing a detailed description of the concern or complaint, to info-contact@alibabacloud.com. A staff member will contact you within 5 working days. Once verified, infringing content will be removed immediately.

Related Keywords:
app to track data usage android app to track data usage android android app memory usage android app memory usage android app development ide android app development books android studio app development
Related Article
Android's approach to using Bytebuffer in JNI
Android Clipchildren Attribute Example detailed _android
Android 9.0 new Features
Deep Learning Application Series (iii) | Build your own image...
Android and JS call each other

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.

What's Trending
Top 10 Tags
datastax versions naming convention zookeeper client class definition md5 microsoft sql server 2005 data structures exception handling error handling
Top 10 Keywords
microsoft download center down wordpress address url site address url wordpress address url windows installer 4 0 download 302 not found web address url definition site address url wordpress db2 integer mac os installation step by step pdf abbreviation for return

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

Get Started for Free

  • Sales Support

    1 on 1 presale consultation

    Chat Contact Sales

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

    Open a Ticket

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.

    Learn More