Android搜索结果显示高亮实例(有数据滑动底部自动刷新)

首先的效果图

搜索到结果(这里我只是模拟数据,真正和服务器走得时候,返回来的数据都应该包含关键字的)

模拟的没有搜索结果的界面

具体实现

在这插一句哈,就是做一件事情,拆分成多个小结,不至于在开发的时候摸不着头脑而且还能把控开发的进度.

思路其实很简单,我们监听输入框的变化,然后在文字变化之后去请求服务器,然后取到我们需要的结果,进行数据展示即可.

第一步:搜索框的监听

et_search.addTextChangedListener(new TextWatcher() {
   @Override
   public void beforeTextChanged(CharSequence s, int start, int count, int after) {
   }

   /**
   * 当搜索框中的文字发生变化的时候回调此方法
   * @param charSequence 输入框的文字
   * @param start 开始
   * @param before
   * @param count 字数
   */
   @Override
   public void onTextChanged(CharSequence charSequence, int start, int before, int count) {
   //在这里进行逻辑请求
   }
   @Override
   public void afterTextChanged(Editable s) {

   }
  });

第二步:进行相关逻辑请求

```
if (!TextUtils.isEmpty(charSequence) && charSequence.length() > 3) { //这里的3只是为了模拟请求
    mKey = charSequence.toString();
    initData(charSequence.toString());
    changeStates(STATE);
   } else {
    STATE = NO_TTHING;
    changeStates(STATE);
   }
/**

 * 首次获取数据
 *
 * @param key 高亮值
 */
private void initData(String key) {

 //这里是模拟网络请求的 实际就是走网络获取数据
 String result = JsonUtils.getJson(this, "search.json");
 Gson gson = new Gson();
 SearchBean searchBean = gson.fromJson(result, SearchBean.class);
 if (searchBean != null) {
  mDataBeen = searchBean.getData();
  if (mDataBeen != null && mDataBeen.size() > 0) {
   STATE = SHOW_DATA;
   mSearchAdapter.loadData(mDataBeen, key);
  } else {
   STATE = NO_TTHING;
  }
 } else {
  STATE = NO_TTHING;
 }
}
/**

 * 改变搜索状态
 *
 * @param state 搜索key值
 */
private void changeStates(int state) {
 switch (state) {
  case NO_TTHING:
   mNoLayout.setVisibility(View.VISIBLE);
   recycler_view.setVisibility(View.INVISIBLE);
   break;

  case SHOW_DATA:
   mNoLayout.setVisibility(View.GONE);
   recycler_view.setVisibility(View.VISIBLE);
   break;
 }
}

第三步:进行变色

/**

 * @param context  上下文
 * @param wholeStr  全部文字
 * @param highlightStr 改变颜色的文字
 * @param color  颜色
 */
public StringFormatUtil(Context context, String wholeStr, String highlightStr, int color) {
 this.mContext = context;
 this.wholeStr = wholeStr;
 this.highlightStr = highlightStr;
 this.color = color;
}

/**
 * 填充颜色
 *
 * @return StringFormatUtil
 */
public StringFormatUtil fillColor() {

 if (!TextUtils.isEmpty(wholeStr) && !TextUtils.isEmpty(highlightStr)) {
  spBuilder = new SpannableStringBuilder(wholeStr);
  //匹配规则
  Pattern p = Pattern.compile(highlightStr);
  //匹配字段
  Matcher m = p.matcher(spBuilder);
  //上色
  color = mContext.getResources().getColor(color);
  //开始循环查找里面是否包含关键字 使得一句话中出现多个关键词都会被高亮
  while (m.find()) {
   int start = m.start();
   int end = m.end();
   spBuilder.setSpan(new ForegroundColorSpan(color), start, end, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);
  }
  return this;
 }
 return null;
}

/**
 * 获取到已经更改好的结果(这个时候已经实现了高亮,在获取这个result的时候不要toString()要不然会把色调去除的)
 *
 * @return result
 */
public SpannableStringBuilder getResult() {
 if (spBuilder != null) {
  return spBuilder;
 }
 return null;
}
// 进行工具类使用,也就是在给title赋值的时候使用

//这个是adapter里面的使用规则
 mFormatUtil = new StringFormatUtil(holder.itemView.getContext(), dataBean.getTitle(), mLightStr, R.color.colorAccent).fillColor();

 holder.tv_title.setText(mFormatUtil.getResult());
```

Demo说明

这里的本地的json是我自己人为定义的,而且在搜索的时候加入了自己的逻辑,如果是实际工程中需要自己根据自己的需求来进行变更的.相关显示不需要在意,这里只是给大家一个实现搜索的并且关键词高亮的一个思路。

Demo代码传送门:https://github.com/wuyinlei/SearchViewDemo

下载地址:SearchViewDemo_jb51.rar

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持我们。

(0)

相关推荐

  • Android基于RecyclerView实现高亮搜索列表

    话不多说先看今天的实现的效果: 相信这种效果很多项目都会用到,今天就讲讲利用RecycleView来实现他,博主把此篇文章定位初级篇,可能因为这确实很简单,所以我要更要讲的详细一点让新手也可以能看的懂. 饭要开始做了,我们要准备哪些食材呢. 1.一个RecyclerView或是listview或是其他可以显示多item的控件(主要的干货) 2.搞清楚EditText的实时监听 3.让一个textview出现不同的颜色 4.如何穿过Adpter找出textview中key值(也就是高亮字符串) 当

  • Android搜索结果显示高亮实例(有数据滑动底部自动刷新)

    首先的效果图 搜索到结果(这里我只是模拟数据,真正和服务器走得时候,返回来的数据都应该包含关键字的) 模拟的没有搜索结果的界面 具体实现 在这插一句哈,就是做一件事情,拆分成多个小结,不至于在开发的时候摸不着头脑而且还能把控开发的进度. 思路其实很简单,我们监听输入框的变化,然后在文字变化之后去请求服务器,然后取到我们需要的结果,进行数据展示即可. 第一步:搜索框的监听 et_search.addTextChangedListener(new TextWatcher() { @Override

  • js/jquery控制页面动态加载数据 滑动滚动条自动加载事件的方法

    页面滚动动态加载数据,页面下拉自动加载内容 相信很多人都见过瀑布流图片布局,那些图片是动态加载出来的,效果很好,对服务器的压力相对来说也小了很多 有手机的相信都见过这样的效果:进入qq空间,向下拉动空间,到底部时,会动态加载剩余的说说或者是日志 今天我们就来看看他们的实现思路和js控制动态加载的代码 下面的代码主要是控制滚动条下拉时的加载事件的 在下面代码说明出,写上你的操作即可,无论是加载图片还是加载记录数据  都可以 别忘了引用jquery类库 $(window).scroll(functi

  • Android TextView高级显示技巧实例小结

    本文实例总结了Android TextView高级显示技巧.分享给大家供大家参考,具体如下: 1. 自定义字体 可以使用setTypeface(Typeface)方法来设置文本框内文本的字体,而Android的 Typeface又使用TTF字体文件来设置字体 所以,我们可以在程序中放入TTF字体文件,在程序中使用Typeface来设置字体:第一步,在assets目录下新建fonts目录,把TTF字体文件放到这里.第二步,程序中调用: TextViewtv = (TextView)findView

  • JSP 自动刷新的实例详解

    JSP 自动刷新的实例详解 考虑一个网页被显示实时游戏得分或股市状况或货币兑换利率.对于所有这些类型的网页,你需要使用的刷新或重新加载按钮,您的浏览器定期刷新网页. JSP使这个工作变得简单,它提供一种机制,可以使网页在这样一种方式,它会在给定的时间间隔后自动刷新. 刷新网页的最简单的方法是使用方法setIntHeader()响应对象.下面是该方法的签名: public void setIntHeader(String header, int headerValue) 此方法发送回标题"刷新&q

  • swiper 解决动态加载数据滑动失效的问题

    两种解决方法 1.数据加载后进行swiper初始化 success:function(result){ var resultdata =eval("("+result+")"); if(resultdata.status == 1){ var dataList = resultdata.data; currentPage = resultdata.currentPage; pageCount = resultdata.pageCount; var html = &q

  • vue数据变化但页面刷新问题

    目录 vue数据变化但页面刷新 watch监听到数据的变化但页面没有刷新 没有监听到数据的变化 改变了数据却没有自动刷新 说下结论 vue数据变化但页面刷新 watch监听到数据的变化但页面没有刷新 在数据改动的代码后加 this.$forceUpdate(); 添加this.$forceUpdate();进行强制渲染,效果实现.因为数据层次太多,render函数没有自动更新,需手动强制刷新. 没有监听到数据的变化 例如: 改变了数组中的某一项或者改变了对象中的某个元素时,监听则未生效. 数组若

  • Android 搜索结果匹配关键字且高亮显示功能

    1. 单关键字 匹配 如果只是单关键字的话,那么我们先计算出他的下标,它的长度,然后就可以标记下标到下标+长度的这一段为特殊颜色即可,代码如下: if (name != null && name.contains(keyWord)) { int index = name.indexOf(keyWord); int len = keyWord.length(); Spanned temp = Html.fromHtml(name.substring(0, index) + "<

  • Android中Service实时向Activity传递数据实例分析

    本文实例讲述了Android中Service实时向Activity传递数据的方法.分享给大家供大家参考.具体如下: 这里演示一个案例,需求如下: 在Service组件中创建一个线程,该线程用来生产数值,每隔1秒数值自动加1,然后把更新后的数值在界面上实时显示. 步骤如下: 1.新建一个android项目工程,取名为demo. 2.新建一个Service类,用来实时生产数值,供界面实时显示. package com.ljq.activity; import android.app.Service;

  • Android分页中显示出下面翻页的导航栏的布局实例代码

    当页面条目过多的时候需要分页,要在布局中显示出分页的相关布局,使用android:layout_weight="11" activity_call_safe.xml <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:lay

  • Android顶部(toolbar)搜索框实现的实例详解

    Android顶部(toolbar)搜索框实现的实例详解 本文介绍两种SearchView的使用情况,一种是输入框和搜索结果不在一个activity中,另一种是在一个activity中. 首先编写toolbar的布局文件 toolbar中图标在menu文件下定义一个布局文件实现 示例代码: <menu xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.

随机推荐