android webview.查找,Android Webview 搜索文本 findAllAsync findNext setFindListener

需求：用户使用Webview浏览文章时，可搜索文章中的“关键字”。

1.用户输入“关键字”字符时，自动搜索；

2.显示搜索“关键字”的 当前位置+总数；

3.支持【上一个】和【下一个】搜索，并定位位置；

分析：该功能主要的技术点是：Webview如何支持搜索？如何获得关键字的总数量和当前位置？

通过分析官方Api，找到了相关的方法：

1. public void findAllAsync(String find)；

2. public void findNext(boolean forward)；

3. public void setFindListener(WebView.FindListener listener)；

方法1：findAllAsync

异步查找网页中所有的关键字内容，传参为find(关键字)，也就是我们通过webview查询的入口；

方法2：findNext

字面意思是：查询下一个，传参为forword(即是否向前)，可以推断出，如果forward为true，是查下一个，那么forward为false，也就是查前一个数据。

这刚好与我们的【上一个】和【下一个】按钮对应了。

方法3：setFindListener

@Override

public void onFindResultReceived(int position, int all, boolean b) {

是为webview设置查询监听，监听器的方法中返回了我们关注的数据： 当前位置 + 总数。

分析了Webview的相关源码，我们找到了所需要使用的方法，下面我们开始实现吧！！！

首先，先看下Demo的效果图：

image

如上图所示，页面分为两部分，上面蓝色区域是我们的搜索面板，下面是Webview控件。

在搜索区域中，可以看到需求中的所有控件都包括了，功能也对应实现了，我们输入了关键字“1”，自动进行了搜索，Webview中所有是“1”的文本，均黄色高亮显示，而当前选中位置的“1”为橙色突出显示。

当我们点击【下一个】或【上一个】按钮时，Webview跟随文本位置自动定位，搜索区域中的“位置”文本也会相应切换。

Demo实现：

1. 配置权限

因为webview需要使用网络，需要在AndroidMinifest文件中配置网络权限：

2.布局

android:id="@+id/activity_main"

android:layout_width="match_parent"

android:layout_height="match_parent"

android:fitsSystemWindows="true">

android:id="@+id/ll_top"

android:layout_width="match_parent"

android:layout_height="50dp"

android:orientation="horizontal"

android:background="#2fc0d6">

android:layout_width="120dp"

android:layout_height="wrap_content"

android:text=""

android:hint="请输入关键字"

android:id="@+id/et_key" />

android:id="@+id/tv_position"

android:layout_width="100dp"

android:layout_height="wrap_content"

android:text="(位置：0/0)"

android:textSize="15sp"

android:layout_marginLeft="5dp"

android:layout_marginRight="5dp"

android:textColor="#000000"/>

android:text="上一个"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:id="@+id/btn_pre"

android:layout_weight="1" />

android:text="下一个"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:id="@+id/btn_next"

android:layout_weight="1" />

android:id="@+id/webview"

android:layout_width="match_parent"

android:layout_height="match_parent"

android:layout_below="@+id/ll_top"

android:layout_alignParentLeft="true"

android:layout_alignParentStart="true" />

3.代码

package com.qxc.webviewsearch;

import android.app.Activity;

import android.os.Build;

import android.os.Bundle;

import android.support.annotation.RequiresApi;

import android.text.Editable;

import android.text.TextWatcher;

import android.view.View;

import android.webkit.WebView;

import android.webkit.WebViewClient;

import android.widget.Button;

import android.widget.EditText;

import android.widget.TextView;

public class MainActivity extends Activity {

EditText et_key;

TextView tv_position;

Button btn_pre;

Button btn_next;

WebView webview;

String url = "https://www.jianshu.com/p/ada94d3a3e86";

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_main);

initView();

initEvent();

loadWebview();

}

/**

* 初始化控件

*/

private void initView(){

et_key = (EditText) findViewById(R.id.et_key);

tv_position = (TextView) findViewById(R.id.tv_position);

btn_pre = (Button) findViewById(R.id.btn_pre);

btn_next = (Button) findViewById(R.id.btn_next);

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

}

/**

* 初始化事件

*/

private void initEvent(){

//上一个

btn_pre.setOnClickListener(new View.OnClickListener() {

@Override

public void onClick(View view) {

webview.findNext(false);

}

});

//下一个

btn_next.setOnClickListener(new View.OnClickListener() {

@Override

public void onClick(View view) {

webview.findNext(true);

}

});

//输入文本自动查询

et_key.addTextChangedListener(new TextWatcher() {

@Override

public void beforeTextChanged(CharSequence s, int start, int count, int after) {

}

@Override

public void onTextChanged(CharSequence s, int start, int before, int count) {

}

@RequiresApi(api = Build.VERSION_CODES.JELLY_BEAN)

@Override

public void afterTextChanged(Editable key) {

//搜索点击

webview.findAllAsync(key.toString());

webview.setFindListener(new WebView.FindListener() {

@Override

public void onFindResultReceived(int position, int all, boolean b) {

tv_position.setText("(位置："+(position+1)+"/"+all+")");

}

});

}

});

}

/**

* 加载webview

*/

private void loadWebview(){

webview.setWebViewClient(new WebViewClient(){

@Override

public boolean shouldOverrideUrlLoading(WebView view, String url) {

view.loadUrl(url);

return true;

}

});

webview.loadUrl(url);

}

}

代码结构很简单，仅1个Activity。

代码具体的实现细节，是参照上面分析的信息做出来的，如果还有疑问，欢迎留言。