1. 显示Web信息

1.1 问题

在应用程序中，需要将从Web上获取的HTML或图像数据不加任何修改和处理地显示出来。

1.2 解决方案

（API Level 3）
在WebView中显示信息。WebView是一个视图小部件，在应用程序中，它可以嵌入到任何布局中来显示本地或远程的网页内容。WebView基于开源的WedKit引擎，而Android Browser应用程序也是基于此引擎，所以两者赋予Web应用程序的性能和功能。

1.3 实现机制

除了最重要的二维滚动（横向和纵向同时滚动）和变焦控制，WebView对于显示从网上下载的资源还要很多值得称道的地方。WebView非常适合处理大图片，如体育场的地图，用户在浏览此类图片时可能需要进行左右平移和缩放。在这里，我们将讨论如何实现本地和远程资源的显示。

1. 显示一个URL

最简单的情况就是提供资源的URL,然后在WebView中将与该URL对应的HTML页面或图像显示出来。以下是这项技术在应用程序中一些小的实际应用：

在应用程序中访问企业网站。
通过一台Web服务器显示实时更新内容的页面，如FAQ部分，这个页面的内容不必升级应用程序就可以动态更新。
显示一个很大的图像资源，用户可能需要通过平移/缩放来与它交互。

让我们来看一个加载常见页面的简单示例，不过不是用浏览器，而是在Activity内部加载（参见以下两段代码清单）。
包含一个WebView的Activity

public class MyActivity extends Activity {
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        WebView webview = new WebView(this);
        //启用JavaScript支持 
        webview.getSettings().setJavaScriptEnabled(true);
        webview.loadUrl("http://www.baidu.com/");

        setContentView(webview);
    }
}

注意：
默认情况下，WebView是禁用JavaScript支持的。如果显示的内容需要它的话，可以使用WebView.WebSettings对象来启用它。

在AndroidManifest.xml中设置需要的权限

<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.examples.webview"
    android:versionCode="1"
    android:versionName="1.0" >

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

    <application
        android:icon="@drawable/ic_launcher"
        android:label="@string/app_name"
        android:theme="@style/AppTheme" >
         <activity
             android:name=".MyActivity"
             android:label="@string/label_web" >
             <intent-filter>
                 <action android:name="android.intent.action.MAIN" />
                 <category android:name="android.intent.category.LAUNCHER" />
             </intent-filter>
         </activity>
    </application>

</manifest>

要点：
如果WebView加载的是远程内容，AndroidManifest.xml必须声明使用androd.permission.INTERNET权限。

加载结果是在Activity中显示一个HTML显示（如下图所示）。
WebView中的HTML页面

注意，如果点击此视图中的任意链接，设备的浏览器应用程序就会启动。这是因为加载的所有网页URL都默认被系统处理为Intent。如果要在内部处理链接，就必须截断这些事件。

2. 显示本地资源

WebView在显示本地内容时也非常有用，它可以利用HTML/CSS来格式化内容或者为它的内容提供平移/缩放功能。你也许会使用Android项目的assets目录来存储你想在WebView中显示的资源，如大型图片或HTML文件。为了更好地组织资源，也可以在assets目录下创建子目录来存储文件。
通过file://android_asset/这样的URL格式，WebView.loadUrl()可以显示存储在assets目录中的文件。例如，如果在assets目录中存放了文件android.jpg，使用file://android_asset/images/android.jpg目录中存放了一个同样的文件，WebView可以使用file://android_asset/images/android.jpg这样的URL来加载它。
另外，WebView.loadData()可以将存储在字符串资源或变量中的原始HTML代码加载到视图中。通过这些技术，预先格式化的HTML文本可以保存在res/values/strings.xml中或使用远程API下载下来，并显示在应用程序中。
以下两段代码清单显示了一个示例Activity，它有两个WebView小部件，其中一个垂直堆叠在另一个之上。上面的视图显示了一张存储在assets目录中的大型图片，下面的视图则显示了存储在应用程序的字符串资源中的一个HTML字符串。

扫描二维码关注公众号，回复： 3984090 查看本文章

res/layout/mian.xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <WebView
        android:id="@+id/upperview"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"/>

    <WebView
        android:id="@+id/lowerview"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"/>
</LinearLayout>

显示本地Web内容的Activity

public class MyActivity extends Activity {

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);

        WebView upperView = (WebView) findViewById(R.id.upperview);
        // 必须启用缩放功能
        upperView.getSettings().setBuiltInZoomControls(true);
        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.HONEYCOMB) {
            //Android 3.0+ 以上版本具有捏动缩放功能，无需此按钮
            upperView.getSettings().setDisplayZoomControls(false);
        }
        upperView.loadUrl("file:///android_asset/android.jpg");

        WebView lowerView = (WebView) findViewById(R.id.lowerview);
        String htmlString = "<h1>Header</h1><p>This is HTML text<br /><i>Formatted in italics</i></p>";
        lowerView.loadData(htmlString, "text/html", "utf-8");
    }

}

在Activity显示时，两个WebView将屏幕分为上下两部分。HTML字符串按预期的格式显示，而大型图片则可以水平和垂直滚动，用户甚至可以进行放大和缩小，如下图所示。
显示本地资源的两个WebView

我们通过setBuiltInZoomControls(true)允许用户缩小和放大内容。默认情况下，这还会显示与可点击的缩放控件重叠的按钮。在Android3.0和以后的版本中，你可能额外考虑包括WebView.getSettings().setDisplayZoom(false)。这些版本的平台通过收缩手势原生支持缩放，因此没有必要显示重叠按钮。这种方式不会取代setBuiltInZoomControls()，必须同时支持该方法才可以使收缩手势生效。

1.1 问题

1.2 解决方案

1.3 实现机制

1. 显示一个URL

2. 显示本地资源

猜你喜欢