WebView控件应用——模仿URL有道词典

一、项目开发

1、开发介绍

本项目是用WebView控件模仿网上有道词典，WebSettings中有很多关于WebView的设置，这里列出几个常用的方法：

1）、//得到WebSettings对象，设置支持JavaScript的参数
webView.getSettings().setJavaScriptEnabled(true);
2）、//设置可以支持缩放
webView.getSettings().setSupportZoom(true);

3）、//设置默认缩放方式尺寸是far
webView.getSettings().setDefaultZoom(WebSettings.ZoomDensity.FAR);

4）、//设置出现缩放工具
webView.getSettings().setBuiltInZoomControls(true);

WebViewClient, WebViewClient，作用是帮助WebView处理各种通知、请求事件的，其中常用的方法：

onLoadResource：加载对应网址的资源。

onPageStart：开始加载网页。

onPageFinish：加载网页完毕。

onReceiveError：报告错误信息。

shouldOverrideUrlLoading：在WebView显示网页。

2、项目运行效果图

二、编写项目讲解

1、项目文件

2、项目布局文件activity.xml修改代码如下：

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/LinearLayout1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context=".MainActivity" >
<LinearLayout
android:layout_weight="5"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#5C4033"
android:gravity="center"
android:orientation="horizontal">

<EditText
android:id="@+id/etWord"
android:layout_width="wrap_content"
android:layout_height="51dp"
android:background="@drawable/shape_et"
android:ems="9"
android:hint="请输入查询词语" >

<requestFocus />
</EditText>

<Button
android:id="@+id/btnSelect"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/shape_yes"
android:text="查询" />

<Button
android:id="@+id/btnDelete"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/shape_no"
android:text="取消" />

</LinearLayout>

<LinearLayout
android:layout_weight="1"
android:layout_width="match_parent"
android:layout_height="match_parent" >

<WebView
android:id="@+id/wvShow"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:textAppearance="?android:attr/textAppearanceMedium"
android:textSize="25sp"
/>

</LinearLayout>
</LinearLayout>

其中的布局中 shape_et.xml,shape_yes.xml,shape_no.xml文件修改如下：

shape_et.xml:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" >
<solid   android:color="#00ff00ff"/>
<corners android:radius="8px"/>
<stroke  android:color="#E47833"
android:width="2px"
/>

</shape>

</pre><p><span style="font-size:18px;">shape_yes.xml:</span></p><span style="font-size:18px;"></span><pre class="java" name="code"><?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" >
<solid   android:color="#00ff00ff"/>
<corners android:radius="8px"/>
<stroke  android:color="#32CD32"
android:width="2px"
/>

</shape>

shape_no.xml:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" >
<solid   android:color="#00ff00ff"/>
<corners android:radius="8px"/>
<stroke  android:color="#FF0000"
android:width="2px"
/>

</shape>

3、修改MianActivity.xml文件如下：

package cn.edu.bzu.example.webview;

import android.os.Bundle;
import android.app.Activity;
import android.view.Menu;
import android.view.View;
import android.view.Window;
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 EditText etWord;
private Button btnYes,btnNo;
private WebView wvWord;

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
//去除标题
requestWindowFeature(Window.FEATURE_NO_TITLE);
setContentView(R.layout.activity_main);
findBy();
//查询按钮添加事件
btnYes.setOnClickListener(new Button.OnClickListener()
{
public void onClick(View arg0)
{
String strURI = (etWord.getText().toString());
strURI = strURI.trim();
//如果查询内容为空提示
if (strURI.length() == 0)
{
Toast.makeText(MainActivity.this, "查询内容不能为空!", Toast.LENGTH_LONG)
.show();
}
//否则则以参数的形式从http://dict.youdao.com/m取得数据，加载到WebView里.
else
{
String strURL = "http://dict.youdao.com/m/search?keyfrom=dict.mindex&q="
+ strURI;
//设置WebView属性，能够执行JavaScript脚本
wvWord.getSettings().setJavaScriptEnabled(true);
//设置web视图客户端
wvWord.setWebViewClient(new MyWebViewClient());
wvWord.loadUrl(strURL);
}
}
});
//http://dict.youdao.com/m/search?keyfrom=dict.mindex&q=happy
//清空按钮添加事件，将EditText置空
btnNo.setOnClickListener(new Button.OnClickListener()
{
public void onClick(View v)
{
etWord.setText("");
}
});

}

private void findBy() {
// TODO Auto-generated method stub
etWord=(EditText) findViewById(R.id.etWord);
btnYes=(Button) findViewById(R.id.btnSelect);
btnNo=(Button) findViewById(R.id.btnDelete);
wvWord = (WebView) findViewById(R.id.wvShow);
}
//web视图
class MyWebViewClient extends WebViewClient
{
public boolean shouldOverviewUrlLoading(WebView view,String url)
{
view.loadUrl(url);
return true;
}
}

@Override
public boolean onCreateOptionsMenu(Menu menu) {
// Inflate the menu; this adds items to the action bar if it is present.
getMenuInflater().inflate(R.menu.main, menu);
return true;
}
//2、Button的OnClick方法
/*private void btnYesClick(View view) {
String strURI = etWord.getText().toString();
strURI = strURI.trim();
//如果查询内容为空提示
if (strURI.length() == 0)
{
Toast.makeText(MainActivity.this, "查询内容不能为空!", Toast.LENGTH_LONG)
.show();
}
//否则则以参数的形式从http://dict.youdao.com/m取得数据，加载到WebView里.
else
{
//String strURL = "http://www.baidu.com";
String strURL = "http://dict.youdao.com/m/search?keyfrom=dict.mindex&q="
+ strURI;
wvWord.loadUrl(strURL);
}

}
@SuppressWarnings("unused")
private void btnNoClick(View View) {
etWord.setText("");
}*/
}

注意：在文件AndroidManifest.xml文件中加入获取联网权限，代码如下：

<!--  获取联网权限-->
<uses-permission android:name="android.permission.INTERNET"/>