Create the first Android app to load the HTML5 page with Android Studio

Preface

software version:Android Studio v1.0 version, due to v0.x since the software changes have been relatively large, many problem search solution is also v0.x version of the era, so first declare the version.

motivation: due to the need for mobile software development in several ways of comparative research, it has the production of this article, it is estimated that there will be other technical solutions to the post.

goal: in order to adapt to cross-platform requirements, so write a page with HTML5, the use of WebView loading HTML5 page becomes an alternative technical route. This article is to use Android Studio to create an APK program, loading the written HTML5 page, so as to achieve the rapid generation of cross-platform programs.

Body

• 1. Create an Android project

Specify Project name and path

Specify the minimum supported SDK version and the created app run device type

Select an activity

Finish

Now see the engineering structure

Preview to see the effect

By this, Helloword has been written, as long as the Android needs to configure the SDK and related drivers, it is very good to get started.

• 2. Load a remote page

Here to open a Baidu page for example to demonstrate

Open the Mainactivity.java page and modify the OnCreate function

Private WebView WebView;

@Override
protected void OnCreate (Bundle savedinstancestate) {
Super.oncreate (savedinstancestate);
Setcontentview (R.layout.activity_main);

Instantiating a WebView object
WebView = new WebView (this);
Set the WebView property to be able to execute JavaScript scripts
Webview.getsettings (). Setjavascriptenabled (True);

try {
Set the address of an open page
Webview.loadurl ("http://www.baidu.com");
}
catch (Exception ex)
{
Ex.printstacktrace ();
}
Setcontentview (WebView);
}

Preview to see the effect

Tip Wabpage Not available error, then we add permissions in the Androidmanifest.xml file

<uses-permission android:name= "Android.permission.INTERNET"/>

Now preview to see the effect, Baidu page can open normally

• 3. Open Local page

This step shows how to open the local HTML page, the example also has Baidu as an example, but instead of saving a copy of Baidu's HTML page, and then load the local HTML page, here Baidu page Save as Index.htm

Create a new assets directory to hold HTML pages. Right-click App->new->folder->assetsfolder

HTML page into the assets directory

Change the address of the open page to the local page address

Webview.loadurl (file:///android_asset/index.html);

Look at the effect of the preview

• 4. Release APK
• Follow the steps in the diagram to do it step by step.

The app-release.apk is the generated installation package.

Create the first Android app to load the HTML5 page with Android Studio