手把手教你用android studio建立第一個安卓程序加載html5頁面（一）

前言

軟件版本：android studio v1.0正式版，因爲v0.x以來軟件變化一直比較大，不少問題搜索的解決方案也都是v0.x版本時代的，故首先聲明一下版本。

動機：因爲工做中須要對移動端軟件開發的幾種方式進行一下對比研究，故有了此文章的產生，估計後續還會有其餘技術方案的文章發佈。

目標：爲了適應跨平臺的要求，因此用html5編寫頁面，利用webview裝載html5頁面就成爲了一個備選的技術路線。本篇文章就是利用android studio建立一個apk程序，裝載編寫好的html5頁面，以此達到快速生成跨平臺的程序。

正文

• 1.建立一個android工程

指定工程名稱和路徑

指定最小支持的sdk版本和建立的app運行設備類型

選擇一個activity

finish

如今看到的工程結構

預覽看一下效果

到此，helloword已經編寫好了，只要把android須要的sdk和相關的驅動配置好，仍是很好上手的。

• 2.載入一個遠程的頁面

此處以打開一個百度頁面爲例進行演示

打開MainActivity.java頁面，修改oncreate函數

private WebView webview;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        //setContentView(R.layout.activity_main);

        //實例化WebView對象
        webview = new WebView(this);
        //設置WebView屬性，可以執行Javascript腳本
        webview.getSettings().setJavaScriptEnabled(true);

        try {
            //設置打開的頁面地址
            webview.loadUrl("http://www.baidu.com");
        }
        catch(Exception ex)
        {
            ex.printStackTrace();
        }
        setContentView(webview);
    }

 

預覽看一下效果

提示wabpage not available錯誤，那麼咱們在AndroidManifest.xml文件中添加權限

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

如今預覽看一下效果，百度頁面能夠正常打開了

• 3.打開本地頁面

這一步演示如何打開本地的html頁面，該示例一樣已百度爲例，只不過改成先另存一份百度的html頁面，而後加載本地的html頁面，此處百度頁面另存爲index.htm

新建assets目錄，用來存放html頁面。右鍵app->new->folder->assetsfolder

html頁面放入assets目錄

打開頁面的地址改成本地頁面地址

webview.loadUrl(file:///android_asset/index.html);

看一下預覽的效果

• 4.發佈apk
• 按照圖示的步驟一步步進行操做就能夠了
•  
•  

 

app-release.apk就是生成的安裝包了。

下班了，今天就寫到這裏了，到目前爲止，基本的功能已經完成了，可是不少細節部分的內容還有待調整，明天待續下一篇。

最後附源碼下載