备案控制台
探索云世界
开发者社区 开发与运维 文章 正文

【Android开发】网路编程及Internet应用-使用WebView显示网页

2015-06-14 1641
版权
版权声明：
本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《 阿里云开发者社区用户服务协议》和 《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写 侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。
简介：
Android提供了内置的浏览器，该浏览器使用了开源的WebKit引擎。WebKit不仅能够搜索网址、查看电子邮件，而且能够播放视频节目。在Android中，要使用内置的浏览器，需要通过WebView组件来实现。通过WebView组件可以轻松实现显示网页功能。

如何在Android中使用WebView组件：

WebView组件使用方法同其它组件一样，既可以使用XML布局文件配置，也可以在java文件中通过new关键字创建。推荐使用XML布局文件配置，配置方法： 
<WebView
    android:id="@+id/webView1"
    android:layout_width="match_parent"
    android:layout_height="match_parent"/>

Web组件的常用方法：
loadURL(String url) 用于加载指定URL对应的网页

loadData(String data,String mimeType,String encoding) 用于将指定的字符串数据加载到浏览器中

loadDataWithBaseURL(String baseUrl,String data,String mimeType,String encoding,String HistoryUrl) 用于基于URL加载指定的数据

capturePicture() 用于创建当前屏幕的快照

goBack()执行后退操作，相当于浏览器上后退按钮的功能

goForward()执行前进操作，相当于浏览器上前进按钮的功能

stopLoading()用于停止加载当前页面

reload()用于刷新当前页面

下面利用几个实例说明WebView的应用

(1)例子1：使用WebView组件浏览指定网页
res/layout/main.xml: 
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/ll1"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >


    <WebView
	    android:id="@+id/webView1"
	    android:layout_width="match_parent"
	    android:layout_height="match_parent"/>	
	
</LinearLayout>

MainActivity： 
package com.example.test;  
  
import android.app.Activity;
import android.os.Bundle;
import android.webkit.WebView;
  
public class MainActivity extends Activity{  


    @Override  
    public void onCreate(Bundle savedInstanceState) {  
        super.onCreate(savedInstanceState);  
        setContentView(R.layout.main);
        
        WebView web=(WebView)findViewById(R.id.webView1);
        web.loadUrl("http://www.baidu.com");
 	//处理各种通知请求和事件，如果不使用该句代码，将使用内置浏览器访问网页
        web.setWebViewClient(new WebViewClient());
    }
}

别忘记在AndroidManifest.xml中加入访问网络的权限： 
<!-- 添加链接网络的权限 -->
<uses-permission android:name="android.permission.INTERNET"/>

运行结果如图



(2)例子2：使用WebView加载HTML代码
在进行Android开发时，对于一些游戏的帮助信息，使用HTML代码进行显示比较实用，不仅可以让界面更加美观，而且可以让开发更加简单、快捷。

需要使用loadDataWithBaseURL()方法加载HTML代码，基本语法格式如下:
loadDataWithBaseURL(String baseUrl,String data,String mimeType,String encoding,String HistoryUrl) 

其中各项参数说明如下：
baseUrl：用于指定当前页面使用的基本URL。如果为null，则使用默认的about:blank，即空白页
data：用于指定要显示的字符串数据
mimeType：用于指定要显示的MIME类型。如果为null，则默认使用text/html
encoding：用于指定数据的编码方式
history：用于指定当前的历史URL，也就是进入该页前显示页的URL。如果为null，则使用默认的about:blank。

下面用一个实例来说明如何使用WebView组件加载HTML代码：
res/layout/main.xml: 
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/ll1"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >


    <WebView
	    android:id="@+id/webView1"
	    android:layout_width="match_parent"
	    android:layout_height="match_parent"/>	
	
</LinearLayout>

MainActivity: 
package com.example.test;  
  
import android.app.Activity;
import android.os.Bundle;
import android.webkit.WebView;
import android.webkit.WebViewClient;
  
public class MainActivity extends Activity{  


    @Override  
    public void onCreate(Bundle savedInstanceState) {  
        super.onCreate(savedInstanceState);  
        setContentView(R.layout.main);
        
        WebView web=(WebView)findViewById(R.id.webView1);
        //处理各种通知请求和事件，如果不使用该句代码，将使用内置浏览器访问网页
        web.setWebViewClient(new WebViewClient());
        
        StringBuilder sb=new StringBuilder();
        sb.append("<div style=\"color:#CCCCCC\">工具栏菜单说明</div>");
        sb.append("<ul>");
        sb.append("<li>这是说明的第一行</li>");
        sb.append("<li>这是说明的第二行</li>");
        sb.append("<li>这是说明的第二行</li>");
        sb.append("</ul>");
        web.loadDataWithBaseURL(null, sb.toString(), "text/html", "utf-8", null);//加载数据
    }
}

别忘记在AndroidManifest.xml中加入访问网络的权限： 
<!-- 添加链接网络的权限 -->
<uses-permission android:name="android.permission.INTERNET"/>

运行结果如图



(3)例子3：让WebView支持JavaScript
在默认的情况下，WebView是不支持JavaScript的，但是有些网页有需要实现JavaScript功能。这个时候要为WebView加入兼容JavaScript的功能。利用以下两个步骤：

a.使用WebView组件的WebSettings对象提供的setJavaScriptEnabled()方法让JavaScript可用。
webview.getSettings().setJavaScriptEnabled(true);//设置WebView组件兼容JavaScript

b.通过上面的设置，大部分JavaScript可用，但是对于通过window.alert()方法弹出的对话框不可用。要想显示弹出的对话框，需要使用WebView组件的setWebChromeClient()方法来处理JavaScript的对话框，具体代码如下：
webview.setWebChromeClient(new WebChromeClient());

下面通过一个具体的实例来说明如何让WebView组件支持JavaScript
res/layout/main.xml: 
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/ll1"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >
    
	<CheckBox 
	    android:id="@+id/checkBox1"
	    android:layout_width="wrap_content"
	    android:layout_height="wrap_content"
	    android:text="允许执行JavaScript代码"/>
	
    <WebView
	    android:id="@+id/webView1"
	    android:layout_width="match_parent"
	    android:layout_height="match_parent"/>	
	
</LinearLayout>

MainActivity: 
package com.example.test;  
  
import android.app.Activity;
import android.os.Bundle;
import android.webkit.WebChromeClient;
import android.webkit.WebView;
import android.webkit.WebViewClient;
import android.widget.CheckBox;
import android.widget.CompoundButton;
import android.widget.CompoundButton.OnCheckedChangeListener;
  
public class MainActivity extends Activity{  
	private WebView webview;
    @Override  
    public void onCreate(Bundle savedInstanceState) {  
        super.onCreate(savedInstanceState);  
        setContentView(R.layout.main);
        
        webview=(WebView)findViewById(R.id.webView1);
        //处理各种通知请求和事件，如果不使用该句代码，将使用内置浏览器访问网页
        webview.setWebViewClient(new WebViewClient());
        
        CheckBox checkBox=(CheckBox)findViewById(R.id.checkBox1);
        checkBox.setOnCheckedChangeListener(new OnCheckedChangeListener() {
			
			@Override
			public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) {
				if(isChecked){
					webview.getSettings().setJavaScriptEnabled(true);//设置JavaScript可用
					webview.setWebChromeClient(new WebChromeClient());
					//指定要加载的网页(含有JavaScript的网页，读者可自行寻找此类网址)
					webview.loadUrl("http://acm.hpu.edu.cn/PowerWeb/login.jsp");
				}else{
					//指定要加载的网页(含有JavaScript的网页，读者可自行寻找此类网址)
					webview.loadUrl("http://acm.hpu.edu.cn/PowerWeb/login.jsp");
				}
				
			}
		});
      //指定要加载的网页(含有JavaScript的网页，读者可自行寻找此类网址)
        webview.loadUrl("http://acm.hpu.edu.cn/PowerWeb/login.jsp");
    }
}

别忘记在AndroidManifest.xml中加入访问网络的权限： 
<!-- 添加链接网络的权限 -->
<uses-permission android:name="android.permission.INTERNET"/>

运行结果为图


(4)整合项目：利用WebView打造功能实用的浏览器
实现一个包含前进、后退功能并支持JavaScript的网页浏览器

布局XML文件中包含前进和后退按钮，一个URL地址输入框，一个"GO"按钮，还有下方的WebView组件
res/layout/main.xml: 
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/ll1"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >
    
    <LinearLayout 
	    android:layout_width="fill_parent"
	    android:layout_height="fill_parent"
	    android:layout_weight="4"
	    android:orientation="horizontal" >
	    <Button 
	        android:id="@+id/back"
	        android:layout_width="wrap_content"
	        android:layout_height="wrap_content"
	        android:text="后退"/>
	    <Button 
	        android:id="@+id/front"
	        android:layout_width="wrap_content"
	        android:layout_height="wrap_content"
	        android:text="前进"/>
	    <EditText  android:id="@+id/urlText"
	        android:layout_width="150pt"
	        android:layout_height="wrap_content"/>
	    <Button 
	        android:id="@+id/go"
	        android:layout_width="wrap_content"
	        android:layout_height="wrap_content"
	        android:text="GO"/>
    </LinearLayout>	
    
    <LinearLayout 
	    android:layout_width="fill_parent"
	    android:layout_height="fill_parent"
	    android:layout_weight="1"
	    android:orientation="horizontal" >
	    
	<WebView android:id="@+id/webview1"
	    android:layout_width="match_parent"
	    android:layout_height="match_parent"/>
	
	</LinearLayout>
</LinearLayout>

界面效果如图


要在AndroidManifest.xml中设置强制横屏(android:screenOrientation="landscape")： 
<activity
    android:name=".MainActivity"
    android:screenOrientation="landscape"
    android:label="@string/app_name" >
         <intent-filter>
             <action android:name="android.intent.action.MAIN" />
             <category android:name="android.intent.category.LAUNCHER" />
         </intent-filter>
</activity>

MainActivity: 
package com.example.test;  
  
import android.app.Activity;
import android.app.AlertDialog;
import android.content.DialogInterface;
import android.os.Bundle;
import android.util.Log;
import android.view.View;
import android.view.View.OnClickListener;
import android.webkit.WebChromeClient;
import android.webkit.WebView;
import android.webkit.WebViewClient;
import android.widget.Button;
import android.widget.EditText;
import android.widget.Toast;
  
public class MainActivity extends Activity{  
	private WebView webview;
	private EditText urlText;
	private Button goButton;
	private Button forward;//前进按钮
	private Button back;//后退按钮
    @Override  
    public void onCreate(Bundle savedInstanceState) {  
        super.onCreate(savedInstanceState);  
        setContentView(R.layout.main);
        
        webview=(WebView)findViewById(R.id.webview1);
        //处理各种通知请求和事件，如果不使用该句代码，将使用内置浏览器访问网页
        webview.setWebViewClient(new WebViewClient());
        webview.getSettings().setJavaScriptEnabled(true);//设置兼容JavaScript
        webview.setWebChromeClient(new WebChromeClient());//处理JavaScript对话框
       
        urlText=(EditText)findViewById(R.id.urlText);
        forward=(Button)findViewById(R.id.front);
        forward.setOnClickListener(new OnClickListener() {
			
			@Override
			public void onClick(View arg0) {
				webview.goForward();
				
			}
		});
        
        back=(Button)findViewById(R.id.back);
        back.setOnClickListener(new OnClickListener() {
			
			@Override
			public void onClick(View arg0) {
				webview.goBack();
				
			}
		});
        
        goButton=(Button)findViewById(R.id.go);
        goButton.setOnClickListener(new OnClickListener() {
			
			@Override
			public void onClick(View arg0) {
				if(!"".equals(urlText.getText().toString())){
					openBrowser();//浏览网页
				}else{
					showDialog();//弹出提示对话框
				}
				
			}
		});
    }
    
	protected void showDialog() {
		new AlertDialog.Builder(MainActivity.this)
		.setTitle("网页浏览器")
		.setMessage("请输入要访问的网址")
		.setPositiveButton("确定",new DialogInterface.OnClickListener() {
			
			@Override
			public void onClick(DialogInterface arg0, int which) {
				Log.d("WebView","单击确认按钮");
				
			}
		}).show();
	}


	protected void openBrowser() {
		webview.loadUrl(urlText.getText().toString());//浏览网页
		Toast.makeText(MainActivity.this, "正在加载:"+urlText.getText().toString(), Toast.LENGTH_SHORT).show();
		
	}
}

别忘记在AndroidManifest.xml中加入访问网络的权限： 
<!-- 添加链接网络的权限 -->
<uses-permission android:name="android.permission.INTERNET"/>

运行效果如图



怎么样？你掌握WebView的使用技术了吗？赶快动手来做吧！


转载请注明出处：http://blog.csdn.net/acmman/article/details/46489353

文章标签：
Android开发
JavaScript
前端开发
数据格式
XML
Java
Go
关键词：
Android开发
Android应用
WebView开发
Android编程
WebView android
光仔december
目录
相关文章
aqi00
|
4天前
|
Linux 编译器 Android开发
FFmpeg开发笔记（九）Linux交叉编译Android的x265库
在Linux环境下，本文指导如何交叉编译x265的so库以适应Android。首先，需安装cmake和下载android-ndk-r21e。接着，下载x265源码，修改crosscompile.cmake的编译器设置。配置x265源码，使用指定的NDK路径，并在配置界面修改相关选项。随后，修改编译规则，编译并安装x265，调整pc描述文件并更新PKG_CONFIG_PATH。最后，修改FFmpeg配置脚本启用x265支持，编译安装FFmpeg，将生成的so文件导入Android工程，调整gradle配置以确保顺利运行。
aqi00
24 1
FFmpeg开发笔记（九）Linux交叉编译Android的x265库
请看我回答~
|
1天前
|
数据库 Android开发 开发者
安卓应用开发：构建高效用户界面的策略
【4月更文挑战第24天】 在竞争激烈的移动应用市场中，一个流畅且响应迅速的用户界面(UI)是吸引和保留用户的关键。针对安卓平台，开发者面临着多样化的设备和系统版本，这增加了构建高效UI的复杂性。本文将深入分析安卓平台上构建高效用户界面的最佳实践，包括布局优化、资源管理和绘制性能的考量，旨在为开发者提供实用的技术指南，帮助他们创建更流畅的用户体验。
请看我回答~
5 0
历年考试不作弊
|
2天前
|
移动开发 Java Android开发
构建高效Android应用：采用Kotlin协程优化网络请求
【4月更文挑战第24天】 在移动开发领域，尤其是对于Android平台而言，网络请求是一个不可或缺的功能。然而，随着用户对应用响应速度和稳定性要求的不断提高，传统的异步处理方式如回调地狱和RxJava已逐渐显示出局限性。本文将探讨如何利用Kotlin协程来简化异步代码，提升网络请求的效率和可读性。我们将深入分析协程的原理，并通过一个实际案例展示如何在Android应用中集成和优化网络请求。
历年考试不作弊
5 0
我不是游客20240119
|
2天前
|
调度 Android开发 开发者
构建高效Android应用：探究Kotlin协程的优势与实践
【4月更文挑战第24天】随着移动开发技术的不断演进，提升应用性能和用户体验已成为开发者的核心任务。在Android平台上，Kotlin语言凭借其简洁性和功能性成为主流选择之一。特别是Kotlin的协程功能，它为异步编程提供了一种轻量级的解决方案，使得处理并发任务更加高效和简洁。本文将深入探讨Kotlin协程在Android开发中的应用，通过实际案例分析协程如何优化应用性能，以及如何在项目中实现协程。
我不是游客20240119
8 0
一歲抬頭
|
3天前
|
存储 缓存 安全
Android系统 应用存储路径与权限
Android系统 应用存储路径与权限
一歲抬頭
6 0
Android系统 应用存储路径与权限
一歲抬頭
|
3天前
|
存储 安全 Android开发
Android系统 自定义系统和应用权限
Android系统 自定义系统和应用权限
一歲抬頭
18 0
游客799
|
8天前
|
缓存 移动开发 Android开发
构建高效Android应用：从优化用户体验到提升性能表现
【4月更文挑战第18天】 在移动开发的世界中，打造一个既快速又流畅的Android应用并非易事。本文深入探讨了如何通过一系列创新的技术策略来提升应用性能和用户体验。我们将从用户界面(UI)设计的简约性原则出发，探索响应式布局和Material Design的实践，再深入剖析后台任务处理、内存管理和电池寿命优化的技巧。此外，文中还将讨论最新的Android Jetpack组件如何帮助开发者更高效地构建高质量的应用。此内容不仅适合经验丰富的开发者深化理解，也适合初学者构建起对Android高效开发的基础认识。
游客799
7 0
游客799
|
8天前
|
移动开发 Android开发 开发者
构建高效Android应用：采用Kotlin进行内存优化的策略
【4月更文挑战第18天】 在移动开发领域，性能优化一直是开发者关注的焦点。特别是对于Android应用而言，由于设备和版本的多样性，确保应用流畅运行且占用资源少是一大挑战。本文将探讨使用Kotlin语言开发Android应用时，如何通过内存优化来提升应用性能。我们将从减少不必要的对象创建、合理使用数据结构、避免内存泄漏等方面入手，提供实用的代码示例和最佳实践，帮助开发者构建更加高效的Android应用。
游客799
12 0
我不是游客20240119
|
9天前
|
缓存 移动开发 Java
构建高效的Android应用：内存优化策略
【4月更文挑战第16天】 在移动开发领域，尤其是针对资源有限的Android设备，内存优化是提升应用性能和用户体验的关键因素。本文将深入探讨Android应用的内存管理机制，分析常见的内存泄漏问题，并提出一系列实用的内存优化技巧。通过这些策略的实施，开发者可以显著减少应用的内存占用，避免不必要的后台服务，以及提高垃圾回收效率，从而延长设备的电池寿命并确保应用的流畅运行。
我不是游客20240119
15 1
桃李春风一杯酒
|
11天前
|
搜索推荐 开发工具 Android开发
安卓即时应用(Instant Apps)开发指南
【4月更文挑战第14天】Android Instant Apps让用户体验部分应用功能而无需完整下载。开发者需将应用拆分成模块，基于已上线的基础应用构建。使用Android Studio的Instant Apps Feature Library定义模块特性，优化代码与资源以减小模块大小，同步管理即时应用和基础应用的版本。经过测试，可发布至Google Play Console，提升用户便利性，创造新获客机会。
桃李春风一杯酒
19 1

热门文章

最新文章

  • 1
    移动端 Hybrid 开发：RN、Flutter与Webview的抉择与融合
  • 2
    我的Android之路(持续更新总结~)
  • 3
    Android实现自定义进度条(源码+解析)
  • 4
    安卓适配性策略：确保应用在不同设备上的兼容性
  • 5
    构建高效Android应用：探究Kotlin与Java的性能差异
  • 6
    安卓安全性指南：保护用户数据免受恶意攻击
  • 7
    安卓多线程和并发处理：提高应用效率
  • 8
    安卓UI/UX设计原则：打造引人入胜的用户体验
  • 9
    Android为什么不能在子线程更新UI
  • 10
    构建高效Android应用：从优化用户体验到提升性能
  • 1
    构建高效Android应用：Kotlin协程的实践指南
    17
  • 2
    构建高效Android应用：Kotlin与协程的完美融合
    27
  • 3
    【Android平板编程】远程Ubuntu服务器code-server编程写代码
    53
  • 4
    android 使用GSON 序列化对象出现字段被优化问题解决方案
    17
  • 5
    构建高效安卓应用：探究Kotlin与Java的性能对比
    67
  • 6
    构建高效安卓应用：探究Kotlin与Java的性能差异
    19
  • 7
    ADB 下载、安装及使用教程：让你更好地管理 Android 设备
    510
  • 8
    前端分析工具之 Charles 录制 Android/IOS 手机的 https 应用
    58
  • 9
    构建高效的安卓应用：探究Kotlin与Java的性能差异
    20
  • 10
    构建高效Android应用：探究Kotlin与Java的性能差异
    53

    • 相关课程

    更多
  • 开源Android容器化框架Atlas开发者指南

    • 相关电子书

    更多
  • 58同城Android客户端Walle框架演进与实践之路
  • Android组件化实现
  • 蚂蚁聚宝Android秒级编译——Freeline
    • 下一篇
    部署LAMP环境（Alibaba Cloud Linux 3）