Android之學(xué)習(xí)Webview應(yīng)用程序的拓展性

2020-02-21 17:34:13

字體：大中小

供稿：網(wǎng)友

目前，許多Android應(yīng)用程序都有內(nèi)置的界面，可以顯示網(wǎng)頁(yè)，我們會(huì)發(fā)現(xiàn)這個(gè)接口通常由一個(gè)名為WebView的組件呈現(xiàn)，對(duì)于初學(xué)者來說Android之學(xué)習(xí)Webview應(yīng)用程序的拓展性是費(fèi)用有必要的，下面就讓武林技術(shù)頻道小編帶你來學(xué)習(xí)吧！

先說為什么需要討論這個(gè)問題。
現(xiàn)在很多的手機(jī)應(yīng)用，都可能會(huì)直接嵌入一個(gè)web頁(yè)面。這樣做的好處：一個(gè)是功能更新方便，維護(hù)起來容易，只需要維護(hù)服務(wù)器的頁(yè)面即可，不需要更新客戶端；另一個(gè)是功能通用，不僅android可以用，ios也可以用，symbian也可以直接用。

那為什么現(xiàn)在很多手機(jī)應(yīng)用并不做成web方式的呢？原因很多。一個(gè)是現(xiàn)階段web方式展現(xiàn)能力相對(duì)較弱，如果對(duì)于應(yīng)用的美觀程度要求比較高，就無法使用web方式；一個(gè)是web方式速度相對(duì)較慢，用戶體驗(yàn)會(huì)受一些影響；一個(gè)是現(xiàn)階段流量還是相對(duì)寶貴，web方式流量相對(duì)較大；還有一個(gè)就是有一些功能無法使用web方式實(shí)現(xiàn)（關(guān)于這一點(diǎn)，現(xiàn)在又很多開源的項(xiàng)目可以實(shí)現(xiàn)手機(jī)的一些硬件功能，比如拍照啊，獲取通訊錄啊，都是可以的，感興趣的可以搜索一下phoneGap。但是從現(xiàn)有的反饋來看，速度較慢，體驗(yàn)較差）。

基于以上的原因，現(xiàn)在很多項(xiàng)目會(huì)把一部分功能做成web方式的，一部分功能用其它控件來寫。這就需要web頁(yè)面與其它控件做一些交互。如何交互呢，就是利用自定義的javascript。

下面虛擬一個(gè)場(chǎng)景。

現(xiàn)在有一個(gè)功能，展現(xiàn)當(dāng)前用戶的好友列表，好友列表頁(yè)是web方式的，點(diǎn)擊某好友的頭像以后，進(jìn)入該好友的詳情頁(yè)面，而這個(gè)頁(yè)面呢，由于某些原因，沒做成web方式的。

假設(shè)好友列表頁(yè)是UserListActivity，包含一個(gè)webview。好友詳情頁(yè)面是UserDetailActivity，包含很多控件和業(yè)務(wù)邏輯。

我們以id來唯一標(biāo)示用戶。好友列表頁(yè)中，點(diǎn)擊每一個(gè)好友頭像，都會(huì)調(diào)用：

onclick="javascript:android.user('1')"

類似這樣的js語(yǔ)句。因本文主要介紹android，而不是web開發(fā)內(nèi)容，所以具體不再詳述，熟悉web開發(fā)的同學(xué)很容易理解。

我們現(xiàn)在需要做的，就是顯示用戶列表頁(yè)面，然后在用戶點(diǎn)擊頭像以后，響應(yīng)具體的js請(qǐng)求，跳到該好友詳細(xì)頁(yè)面。

下面看看大概的實(shí)現(xiàn)方法。

默認(rèn)情況下，在WebView中是不能使用javascript的。可以通過下面的代碼：

復(fù)制代碼代碼如下:

WebView myWebView = (WebView) findViewById(R.id.webview); 

WebSettings webSettings = myWebView.getSettings(); 

webSettings.setJavaScriptEnabled(true); 

使javascript功能可用。這部分代碼都放在UserListActivity中的onCreate()方法里。

然后是注冊(cè)JS接口。先看看webview的一個(gè)方法。

public void addJavascriptInterface (Object obj, String interfaceName)

Since: API Level 1

Use this function to bind an object to JavaScript so that the methods can be accessed from JavaScript.

IMPORTANT:

· Using addJavascriptInterface() allows JavaScript to control your application. This can be a very useful feature or a dangerous security issue. When the HTML in the WebView is untrustworthy (for example, part or all of the HTML is provided by some person or process), then an attacker could inject HTML that will execute your code and possibly any code of the attacker's choosing.
Do not use addJavascriptInterface() unless all of the HTML in this WebView was written by you.

· The Java object that is bound runs in another thread and not in the thread that it was constructed in.

Parameters

obj	The class instance to bind to JavaScript, null instances are ignored.
interfaceName	The name to used to expose the instance in JavaScript.

我們?cè)赨serListActivity類的onCreate()方法中增加如下語(yǔ)句：

mWebView.addJavascriptInterface(this, "android");

在UserListActivity類中增加如下方法：

public void user(String id) {

// 獲取id，跳轉(zhuǎn)activity。

}

這樣當(dāng)頁(yè)面調(diào)用onclick="javascript:android.user('1')"語(yǔ)句的時(shí)候，就可以映射到UserListActivity對(duì)象的user()方法了。

這里user方法有一個(gè)參數(shù)，是要對(duì)應(yīng)js語(yǔ)句的user(‘1')。

下面附上所有代碼。

Android部分的代碼：

復(fù)制代碼代碼如下:

package com.arui.framework.android.js; 

import android.app.Activity; 

import android.content.Intent; 

import android.os.Bundle; 

import android.view.View; 

import android.webkit.WebSettings; 

import android.webkit.WebView; 

import com.arui.framework.R; 

import com.arui.framework.android.js.UserDetailActivity; 

public class UserListActivity extends Activity { 

    private WebView mWebView; 

    @Override 

    public void onCreate(Bundle savedInstanceState) { 

        super.onCreate(savedInstanceState); 

       setContentView(R.id.userlist); 

       mWebView = (WebView) findViewById(R.id.mywebview); 

       WebSettings webSetting = mWebView.getSettings(); 

       //設(shè)置js可用  

       webSetting.setJavaScriptEnabled(true); 

       // 添加js調(diào)用接口  

       mWebView.addJavascriptInterface(this, "android");  

       //載入具體的web地址  

       mWebView.loadUrl("http://jb51.net"); 

       mWebView.setVisibility(View.VISIBLE); 

       mWebView.requestFocus(); 

    } 

    public void user(String id) {  

       //跳轉(zhuǎn)activity  

       Intent intent = new Intent(this, UserDetailActivity.class); 

       intent.putExtra("id", id); 

       startActivity(intent); 

    }  

}

資源文件：

復(fù)制代碼代碼如下:

    xmlns:android="http://schemas.android.com/apk/res/android" 

    android:orientation="vertical" 

    android:layout_width="fill_parent" 

    android:layout_height="fill_parent" > 

       android:id="@+id/mywebview" 

       android:layout_width="fill_parent" 

       android:layout_height="fill_parent"  

       android:visibility="gone"/>

Web頁(yè)面的局部代碼：