没有合适的资源?快使用搜索试试~ 我知道了~
之前项目总会遇到很多搜索框类的功能,虽然不是很复杂,不过每次都要去自己处理数据,并且去处理搜索框的变化,写起来也比较麻烦,今天来做一个比较简单的通用搜索栏。 先看下效果图: 没什么特别的,只是今天要做的就是简单的把搜索框的内容封装一下. 一、分析功能 先考虑一下,搜索框一般都是由一个搜索图标(一般都是一个放大镜),一个输入框和一个清除按钮组成.然后会通过监听输入框的变化去处理清除按钮的显示和隐藏并且去过滤相关的数据.最后去刷新适配器,显示过滤后的数据.基本上搜索框的功能都大同小异. 有了上边的分析,我们可以去提取出一个通用的搜索框布局,然后写一个自定义ViewGroup去处理相关的页面显
资源推荐
资源详情
资源评论
Android搜索框通用版搜索框通用版
之前项目总会遇到很多搜索框类的功能,虽然不是很复杂,不过每次都要去自己处理数据,并且去处理搜索框的变化,写起来
也比较麻烦,今天来做一个比较简单的通用搜索栏。
先看下效果图:
没什么特别的,只是今天要做的就是简单的把搜索框的内容封装一下.
一、分析功能一、分析功能
先考虑一下,搜索框一般都是由一个搜索图标(一般都是一个放大镜),一个输入框和一个清除按钮组成.然后会通过监听输入框的
变化去处理清除按钮的显示和隐藏并且去过滤相关的数据.最后去刷新适配器,显示过滤后的数据.基本上搜索框的功能都大同小
异.
有了上边的分析,我们可以去提取出一个通用的搜索框布局,然后写一个自定义ViewGroup去处理相关的页面显示等问题.
二、具体实现二、具体实现
先来写一些自定的属性,方便之后使用,新建一个attr文件并定义自定义属性如下:
<?xml version="1.0" encoding="utf-8"?>
<resources>
<!--搜索图标左边margin-->
<attr name="SearchBarIconMarginLeft" format="dimension"/>
<!--搜索图标右边margin-->
<attr name="SearchBarIconMarginRight" format="dimension"/>
<!--搜索图标-->
<attr name="SearchBarIconSrc" format="reference"/>
<!--清除图标左边margin-->
<attr name="ClearIconMarginLeft" format="dimension"/>
<!--清除图标右边margin-->
<attr name="ClearIconMarginRight" format="dimension"/>
<!--清除图标-->
<attr name="ClearIconSrc" format="reference"/>
<!--搜索文字大小-->
<attr name="SearchTextSize" format="dimension"/>
<!--搜索文字颜色-->
<attr name="SearchTextColor" format="color"/>
<declare-styleable name="CommolySearchView">
<attr name="SearchBarIconMarginLeft"/>
<attr name="SearchBarIconMarginRight"/>
<attr name="SearchBarIconSrc"/>
<attr name="ClearIconMarginLeft"/>
<attr name="ClearIconMarginRight"/>
<attr name="ClearIconSrc"/>
<attr name="SearchTextSize"/>
<attr name="SearchTextColor"/>
</declare-styleable>
</resources>
然后写一下搜索栏的布局searchview_layout.xml:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center_vertical"
android:orientation="horizontal"
>
<ImageView
android:id="@+id/iv_search_icon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:src="@mipmap/search_bar_icon"
android:layout_marginRight="8dp"
/>
<EditText
android:id="@+id/et_search"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="@null"
android:singleLine="true"
/>
<ImageView
android:id="@+id/iv_search_clear"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:src="@mipmap/search_clear_icon"
android:visibility="gone"
/>
</LinearLayout>
</LinearLayout>
布局很简单,就是一个搜索图标加上一个输入框和一个清除图标,下边来写一下具体的实现,建立一个CommolySearchView继承
自LinearLayout即可,先来定义一些属性,获取自定义属性并且绑定布局文件.代码如下:
/**
* Created by junweiliu on 16/5/31.
*/
public class CommolySearchView<T> extends LinearLayout {
/**
* 上下文
*/
private Context mContext;
/**
* 编辑框
*/
private EditText mEditText;
/**
* 清除按钮
*/
private ImageView mClearImg;
/**
* 搜索图标
*/
private ImageView mSearchBarImg;
/**
* 适配器
*/
private BaseAdapter mAdapter;
/**
* 数据源
*/
private List<T> mDatas = new ArrayList<T>();
/**
* 数据源副本
*/
private List<T> mDupDatas = new ArrayList<T>();
/**
* 筛选后的数据源
*/
private List<T> mFilterDatas = new ArrayList<T>();
/**
* 筛选后的数据源副本
*/
private List<T> mDupFilterDatas = new ArrayList<T>();
/**
* 搜索图标
*/
private Bitmap mSearchIcon;
/**
* 搜索框距离左边边距
*/
private int mSearchIconMarginLeft;
/**
* 搜索框距离右边边距
*/
private int mSearchIconMarginRight;
/**
* 清除图标
*/
private Bitmap mClearIcon;
/**
* 清除图标距离左边边距
*/
private int mClearIconMarginLeft;
/**
* 清除图标距离右边边距
*/
private int mClearIconMarginRight;
/**
* 搜索文字大小
*/
private int mSearchTextSize;
/**
* 搜索文字颜色
*/
private int mSearchTextColor;
public CommolySearchView(Context context) {
this(context, null);
}
public CommolySearchView(Context context, AttributeSet attrs) {
this(context, attrs, 0);
}
public CommolySearchView(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
mContext = context;
剩余16页未读,继续阅读
资源评论
weixin_38537541
- 粉丝: 6
- 资源: 892
上传资源 快速赚钱
- 我的内容管理 展开
- 我的资源 快来上传第一个资源
- 我的收益 登录查看自己的收益
- 我的积分 登录查看自己的积分
- 我的C币 登录后查看C币余额
- 我的收藏
- 我的下载
- 下载帮助
安全验证
文档复制为VIP权益,开通VIP直接复制
信息提交成功