android:打造自定义searchView
2016-07-15 14:36
519 查看
1、前言
在我们的安卓项目中,少不了搜索框的使用,虽然google为我们提供了searchView,但是无论是其使用还是样式的修改都非常困难。本文提供一种自定义searchView的实现思路,在它的基础上再参照美工的设计图略加修改即可实现一个美观漂亮的searchView,省去使用官方原配带来的一系列烦恼。
与官方自带的相比,它有如下优点:
使用简单,完全的自定义view
样式定制化简单
提供搜索按钮的监听操作
容易修改扩充
效果图:
2、SimplerSeacherView的编写
SimplerSeacherView继承自
EditTextView,先将键盘的回车键改成搜索按钮,俩行代码搞定。
setSingleLine(true); setImeOptions(EditorInfo.IME_ACTION_SEARCH);
注意,以上俩行代码缺一不可,必须设置单行显示。
设置左侧的搜索图标:
// 设置搜索图标 Drawable drawableLeft = getResources().getDrawable(R.drawable.search); drawableLeft.setBounds(0, 0, drawableLeft.getMinimumWidth(), drawableLeft.getMinimumHeight()); setCompoundDrawables(drawableLeft, null, null, null); // 设置图标边距 mDrawblePadding = (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, mDrawblePadding, getContext().getResources().getDisplayMetrics()); setCompoundDrawablePadding(mDrawblePadding);
这里取个巧,直接通过设置drawableLeft实现左侧显示搜索图标的效果,接下来是设置图标与内容的距离,为了适配,将像素值
mDrawblePadding转化为屏幕平度相关的dp值。
这样整个外观就实现了,接下来是搜索按钮的监听以及回调:
// 设置键盘按钮事件 setOnEditorActionListener(new OnEditorActionListener() { @Override public boolean onEditorAction(TextView v, int actionId, KeyEvent event) { // 搜索键 if (actionId == EditorInfo.IME_ACTION_SEARCH) { // 隐藏软件盘 hideKeyBody(); if (mOnSearcherClickListener != null) { mOnSearcherClickListener.onSeacherClick(getText().toString().trim()); } } return false; } });
当用户点击键盘的搜索按钮时,进行监听处理,根据
actionId判断用户点击的按钮,
EditorInfo.IME_ACTION_SEARCH即是搜索按钮,然后通过监听事件
mOnSearcherClickListener回调到外部执行业务代码。
贴上完整代码:
public class SimplerSeacherView extends EditText { private int mDrawblePadding = 6; private OnSeacherClickListener mOnSearcherClickListener; public SimplerSeacherView(Context context, AttributeSet attrs, int defStyle) { super(context, attrs, defStyle); init(); } public SimplerSeacherView(Context context, AttributeSet attrs) { super(context, attrs); init(); // 设置键盘按钮事件 setOnEditorActionListener(new OnEditorActionListener() { @Override public boolean onEditorAction(TextView v, int actionId, KeyEvent event) { // 搜索键 if (actionId == EditorInfo.IME_ACTION_SEARCH) { // 隐藏软件盘 hideKeyBody(); if (mOnSearcherClickListener != null) { mOnSearcherClickListener.onSeacherClick(getText().toString().trim()); } } return false; } }); } protected void hideKeyBody() { InputMethodManager imm = (InputMethodManager) getContext().getSystemService( Context.INPUT_METHOD_SERVICE); imm.showSoftInput(this, 0); } public SimplerSeacherView(Context context) { this(context, null); } private void init() { setSingleLine(true); setImeOptions(EditorInfo.IME_ACTION_SEARCH); //设置边框 setBackgroundResource(R.drawable.shap_search_bg); // 设置搜索图标 Drawable drawableLeft = getResources().getDrawable(R.drawable.search); drawableLeft.setBounds(0, 0, drawableLeft.getMinimumWidth(), drawableLeft.getMinimumHeight()); setCompoundDrawables(drawableLeft, null, null, null); // 设置图标边距 mDrawblePadding = (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, mDrawblePadding, getContext().getResources().getDisplayMetrics()); setCompoundDrawablePadding(mDrawblePadding); } public void setOnSeacherClickListener(OnSeacherClickListener onSearcherClickListener) { this.mOnSearcherClickListener = onSearcherClickListener; } public interface OnSeacherClickListener { /** * 搜素点击监听 * @author 漆可 * @date 2016-7-19 下午8:49:28 * @param content 搜素类容 */ void onSeacherClick(String content); } }
3、使用
布局文件添加:<com.example.seacherview.SimplerSeacherView android:id="@+id/searcher" android:layout_width="match_parent" android:layout_height="30dp" android:layout_marginTop="10dp" android:layout_marginRight="16dp" android:gravity="center_vertical" android:layout_marginLeft="16dp" android:textSize="14sp" android:textCursorDrawable="@null" android:paddingLeft="6dp" android:paddingRight="6dp" android:hint="请输入搜素类容" />
activity获取与监听设置:
@Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); SimplerSeacherView seacherView = (SimplerSeacherView) findViewById(R.id.searcher); seacherView.setOnSeacherClickListener(this); } @Override public void onSeacherClick(String content) { Toast.makeText(this, content, 1).show(); }
4、完整代码
最后复制完整demo下载地址:http://download.csdn.net/detail/q649381130/9580595相关文章推荐
- 使用C++实现JNI接口需要注意的事项
- Android IPC进程间通讯机制
- Android Manifest 用法
- [转载]Activity中ConfigChanges属性的用法
- Android之获取手机上的图片和视频缩略图thumbnails
- Android之使用Http协议实现文件上传功能
- Android学习笔记(二九):嵌入浏览器
- android string.xml文件中的整型和string型代替
- i-jetty环境搭配与编译
- android之定时器AlarmManager
- android wifi 无线调试
- Android Native 绘图方法
- Android java 与 javascript互访(相互调用)的方法例子
- android 代码实现控件之间的间距
- android FragmentPagerAdapter的“标准”配置
- Android"解决"onTouch和onClick的冲突问题
- android:installLocation简析
- android searchView的关闭事件