WebView实现有道词典

有道词典的实现

开发目的：

用webview实现有道词典的查询功能；

效果图：

布局文件：

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="com.bzu.r2.youdao.MainActivity" >

    <WebView
        android:id="@+id/wvSearchResult"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_below="@+id/btnSearch"
        android:background="#00FFFF"

        android:textAppearance="?android:attr/textAppearanceMedium"
        android:textSize="25sp" />

    <Button
        android:id="@+id/btndelete"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_above="@+id/wvSearchResult"
        android:layout_alignRight="@+id/wvSearchResult"
        android:text="清    除" />

    <Button
        android:id="@+id/btnSearch"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@+id/etWord"
        android:layout_centerHorizontal="true"
        android:onClick="search"
        android:text="查    询" />

    <EditText
        android:id="@+id/etWord"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:layout_alignRight="@+id/btndelete"
        android:layout_marginTop="15dp"
        android:background="@android:drawable/edit_text"
        android:ems="10"
        android:singleLine="true"
        android:textColor="#552006"
        android:textColorHint="#782f10" >

        <requestFocus />
    </EditText>

    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignLeft="@+id/wvSearchResult"
        android:layout_alignTop="@+id/etWord"
        android:background="@drawable/yd" />

</RelativeLayout>

activity事件处理：

public class MainActivity extends Activity {

    // 查询按钮申明
    private Button btnselete;
    // 清空按钮申明
    private Button btndelete;
    // 输入框申明
    private EditText mEditText1;
    // 加载数据的WebView申明
    private WebView mWebView1;

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

        // 获得布局的几个控件
        btnselete = (Button) findViewById(R.id.btnSearch);
        btndelete = (Button) findViewById(R.id.btndelete);
        mEditText1 = (EditText) findViewById(R.id.etWord);
        mWebView1 = (WebView) findViewById(R.id.wvSearchResult);
        // 查询按钮添加事件
        btnselete.setOnClickListener(new Button.OnClickListener() {
            public void onClick(View arg0) {
                String strURI = (mEditText1.getText().toString());
                strURI = strURI.trim();
                // 如果查询内容为空提示
                if (strURI.length() == 0) {
                    Toast.makeText(MainActivity.this, "查询内容不能为空!",
                            Toast.LENGTH_LONG).show();
                }
                // 否则则以参数的形式从http://dict.youdao.com/m取得数据，加载到WebView里.
                else {
                    final String strURL = "http://dict.youdao.com/m/search?keyfrom=dict.mindex&q="
                            + strURI;
                    mWebView1.loadUrl(strURL);
//让网页在webview中显示，不用自带的浏览器打开
                    mWebView1.setWebViewClient(new WebViewClient() {

                        @Override
                        public boolean shouldOverrideUrlLoading(WebView view,
                                String url) {
                            view.loadUrl(url);
                            return true;
                        }

                    });
                }
            }
        });
        // http://dict.youdao.com/m/search?keyfrom=dict.mindex&q=happy
        // 清空按钮添加事件，将EditText置空
        btndelete.setOnClickListener(new Button.OnClickListener() {
            public void onClick(View v) {
                mEditText1.setText("");
            }
        });

    }

}

注意：添加权限：AndroidManifest.xml中必须使用许可”android.permission.INTERNET”,否则会出Web page not available错误。

感受：

WebView可以使得网页轻松的内嵌到app里，还可以直接跟js相互调用。

webview有两个方法：setWebChromeClient 和 setWebClient setWebClient：主要处理解析，渲染网页等浏览器做的事情 setWebChromeClient：辅助WebView处理Javascript的对话框，网站图标，网站title，加载进度等 WebViewClient就是帮助WebView处理各种通知、请求事件的。

加载本地/Web资源：

  example.html 存放在assets文件夹内
  调用WebView的loadUrl()方法，
  添加本地资源：
  webView = (WebView) findViewById(R.id.webView);
webView.loadUrl("file:///android_asset/example.html");
添加web资源：
webView = (WebView) findViewById(R.id.webView);
webView.loadUrl("http://baidu.com");

在程序内打开网页：

创建一个自己的WebViewClient，通过setWebViewClient关联；

webView = (WebView) findViewById(R.id.webView);
        //WebView加载web资源
       webView.loadUrl("http://baidu.com");
        //覆盖WebView默认使用第三方或系统默认浏览器打开网页的行为，使网页用WebView打开
       webView.setWebViewClient(new WebViewClient(){
           @Override
        public boolean shouldOverrideUrlLoading(WebView view, String url) {
            // TODO Auto-generated method stub
               //返回值是true的时候控制去WebView打开，为false调用系统浏览器或第三方浏览器
             view.loadUrl(url);
            return true;
        }
       });

如果访问的页面中有Javascript，则webview必须设置支持Javascript

 //启用支持javascript
WebSettings settings = webView.getSettings();
settings.setJavaScriptEnabled(true);

如果希望浏览的网页后退而不是退出浏览器，需要WebView覆盖URL加载，让它自动生成历史访问记录，那样就可以通过前进或后退访问已访问过的站点。

//改写物理按键——返回的逻辑
    @Override
    public boolean onKeyDown(int keyCode, KeyEvent event) {
        // TODO Auto-generated method stub
        if(keyCode==KeyEvent.KEYCODE_BACK)
        {
            if(webView.canGoBack())
            {
                webView.goBack();//返回上一页面
                return true;
            }
            else
            {
                System.exit(0);//退出程序
            }
        }
        return super.onKeyDown(keyCode, event);
    }

判断页面加载过程

webView.setWebChromeClient(new WebChromeClient() {
            @Override
            public void onProgressChanged(WebView view, int newProgress) {
                // TODO Auto-generated method stub
                if (newProgress == 100) {
                    // 网页加载完成

                } else {
                    // 加载中

                }

            }
        });

缓存的使用 ：

优先使用缓存
  webView.getSettings().setCacheMode      (WebSettings.LOAD_CACHE_ELSE_NETWORK);

不使用缓存：
webView.getSettings().setCacheMode(WebSettings.LOAD_NO_CACHE);