Android客户端之“微服私访”App的系统学习（七）XRecyclerView快速实现列表界面+自定义Search输入框，软键盘搜索按钮监听+TextView部分样式改变

最近一直忙于公司工作，都没抽时间来更新博客了，难得今天是周末，所以花点时间整理一下最近项目中用到的新姿势，顺便和大家分享一下~
今天我们要实现的内容是使用XRecyclerView巡店历史模块，实现下拉刷新，上拉加载的酷炫体验。
先来看一下巡店模块的实现逻辑

下面就来介绍一下XRecyclerView:

官方介绍：一个实现了下拉刷新，滚动到底部加载更多以及添加header功能的的RecyclerView。使用方式和RecyclerView完全一致，不需要额外的layout，不需要写特殊的adater。 加载效果内置了AVLoadingIndicatorView上的所有效果，可以根据需要指定。看一下效果~

1.使用：

首先在gradle进行配置compile 'com.jcodecraeer:xrecyclerview:1.3.2'

接着看一下布局代码

<com.jcodecraeer.xrecyclerview.XRecyclerView
        android:id="@+id/activity_visitshop_list"
        android:layout_height="match_parent"
        android:layout_width="match_parent"
        android:layout_below="@id/activity_visitshop_none"
        android:paddingLeft="@dimen/bottom_img_left"
        android:paddingRight="@dimen/title_bar_add_right"
        android:scrollbars="none"
        android:background="@color/white"
        />

基本使用和RecyclerView类似

        recyclerView = (XRecyclerView) view.findViewById(R.id.activity_visitshop_list);
        //设置线性列表展示
        recyclerView.setLayoutManager(
                new LinearLayoutManager(mContext, LinearLayoutManager.VERTICAL, false));
        recyclerView.setAdapter(adapter);
        //设置空布局
        View emptyView = view.findViewById(R.id.activity_visitshop_none);
        emptyView.setOnClickListener(this);
        recyclerView.setEmptyView(emptyView);

上、下拉刷新，加载更多需要实现 XRecyclerView.LoadingListener接口，并重写onRefresh() onLoadMore()方法

    recyclerView.setLoadingListener(this);
    //设置加载风格
    recyclerView.setLoadingMoreProgressStyle(ProgressStyle.SquareSpin);
    recyclerView.setRefreshProgressStyle(ProgressStyle.BallSpinFadeLoader);
    @Override
    public void onRefresh() {
        //下拉刷新
        pagenum = 1;
        initData();
    }
    @Override
    public void onLoadMore() {
        //加载更多
        initData();
    }

在请求数据结束后，做上下拉刷新和加载更多的已完成提示操作

    /**
     * 结束上下拉刷新
     */
    private void onLoad() {
        recyclerView.refreshComplete();//刷新完成
        recyclerView.loadMoreComplete();//加载更多完成
    }

2.扩展

查看XRecyclerView源码我们可以对其架构有一个深刻的了解，其主要实现的类有XRecyclerView,LoadingMoreFooter,ArrowRefreshHeader,其中AVLoadingIncatorView和SimpleViewSwitcher是用来实现刷新、加载时候的动画效果。
我们可以通过给刷新和加载设置不同的风格来展示动画效果

//设置加载风格
        recyclerView.setLoadingMoreProgressStyle(ProgressStyle.SquareSpin);
        recyclerView.setRefreshProgressStyle(ProgressStyle.BallSpinFadeLoader);

XRecyclerView的刷新加载动画除了系统风格外还包含了所有AVLoadingIncatorView提供的动画效果，我们可以通过ProgressStyle自行设置。
看一下AVLoadingIncatorView提供的动画效果，很酷炫有没有~

自定义Search输入框，软键盘搜索按钮监听

在开发中我们经常遇到在很多界面需要自定义自己的Search搜索框,例如：搜索联系人，PIO搜索等
现在我们也来定义一个自己的搜索框，通过给EditText设置背景图片实现~

 <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@drawable/search_bg"
            >
            <EditText
                android:id="@+id/et_search_shop"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_centerInParent="true"
                android:layout_marginLeft="@dimen/shop_activity_search_left"
                android:hint="@string/activity_visitshop_search"
                android:singleLine="true"
                android:maxLength="30"
                android:focusableInTouchMode="true"
                android:background="@drawable/shape_edittext_input"
                android:textColor="#c2c2c2"
                android:padding="@dimen/shop_activity_search_padding"
                android:imeOptions="actionSearch"
                android:textSize="@dimen/home_fragment_info_item_size" />
        </RelativeLayout>

在点击输入后，点击监听软键盘上的搜索按钮，实现TextView.OnEditorActionListener接口

  @Override
    public boolean onEditorAction(TextView v, int actionId, KeyEvent event) {
        /**
         * 当点击搜索按钮时
         */
        if (actionId == EditorInfo.IME_ACTION_SEARCH) {
            hideKeyboard();//隐藏软键盘
            }
  }

public void hideKeyboard() {//隐藏软键盘
        InputMethodManager inputMethodManager = (InputMethodManager) mActivity.getSystemService(mActivity.INPUT_METHOD_SERVICE);
        if (inputMethodManager.isActive()) {         inputMethodManager.hideSoftInputFromWindow(mActivity.getCurrentFocus().getWindowToken(), 0);
        }
    }

TextView部分样式改变

在项目中我们经常发现在搜索时会根据输入内容检索关键字，将条目中包含关键字的不分用特殊颜色标记出来。在这里我们使用的是SpannableStringBuilder
在这里我们将SpannableString和SpannableStringBuilder做对比，二者都实现了CharSequence接口，区别在于前者不可以拼接，后者可以使用append()进行内容拼接。
主要通过，下面的代码来设置样式

public void setSpan(Object what, int start, int end, int flags)

具体参数介绍：

• start： 指定Span的开始位置
• end： 指定Span的结束位置，并不包括这个位置。

• flags：取值有如下四个
  Spannable.SPAN_EXCLUSIVE_INCLUSIVE：在 Span前面输入的字符不应用 Span的效果，在后面输入的字符应用Span效果。
  Spannable.SPAN_INCLUSIVE_EXCLUSIVE：在 Span前面输入的字符应用 Span 的效果，在后面输入的字符不应用Span效果。
  Spannable.SPAN_INCUJSIVE_INCLUSIVE：在 Span前后输入的字符都应用 Span 的效果。
  Spannable.SPAN_EXCLUSIVE_EXCLUSIVE：前后都不包括。

• what： 对应的各种Span，不同的Span对应不同的样式。已知的可用类有：
  BackgroundColorSpan : 文本背景色
  ForegroundColorSpan : 文本颜色
  MaskFilterSpan : 修饰效果，如模糊(BlurMaskFilter)浮雕
  RasterizerSpan : 光栅效果
  StrikethroughSpan : 删除线
  SuggestionSpan : 相当于占位符
  UnderlineSpan : 下划线
  AbsoluteSizeSpan : 文本字体（绝对大小）
  DynamicDrawableSpan : 设置图片，基于文本基线或底部对齐。
  ImageSpan : 图片
  RelativeSizeSpan : 相对大小（文本字体）
  ScaleXSpan : 基于x轴缩放
  StyleSpan : 字体样式：粗体、斜体等
  SubscriptSpan : 下标（数学公式会用到）
  SuperscriptSpan : 上标（数学公式会用到）
  TextAppearanceSpan : 文本外貌（包括字体、大小、样式和颜色）
  TypefaceSpan : 文本字体
  URLSpan : 文本超链接
  ClickableSpan : 点击事件

代码中我们使用ForegroundColorSpan样式来改变关键字的文本样式

  //设置搜索关键字变红色
        int chageTextColor;
        ForegroundColorSpan redSpan = new ForegroundColorSpan(mContxt.getResources().getColor(R.color.red));
        SpannableStringBuilder builder = new SpannableStringBuilder(sl.getName());
        chageTextColor = sl.getName().indexOf(mSearchText);
        if (chageTextColor != -1) {
            builder.setSpan(redSpan, chageTextColor, chageTextColor
                            + mSearchText.length(),
                    Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
            holder.name.setText(builder);
        } else {
            holder.name.setText(sl.getName());
        }
        holder.root.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                SelectShop.ShopLists sl = list.get(position);
                ((CreateVisitShopActivity) mContxt).selectShop(sl);
            }
        });

下面来看一下项目中实现的效果~

今天的分享就到这里了，下面依旧给大家介绍几个干货~

1:Recyclerview开源库
recyclerview-animators
UltimateRecyclerView
RecyclerView-FlexibleDivider
RecyclerViewSwipeDismiss
SmartRefreshLayout

2：短网址
http://dwz.wailian.work/

3：在线office
https://products.office.com/zh-cn/office-online/documents-spreadsheets-presentations-office-online

4：在线生成Button
http://angrytools.com/android/button/

5：在线图标
https://material.io/icons/#ic_mood

6：浏览器查看代码插件
OctoTree

参考资料：
XRecyclerView: http://www.jcodecraeer.com/a/opensource/2015/1126/3723.html
AVLoadingIndicatorView:https://github.com/81813780/AVLoadingIndicatorView
SpannableStringBuilder:http://blog.csdn.net/a214024475/article/details/53261122

代码资料获取，请点击此处~