微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦！

可支持快速搜索筛选的Android自定义选择控件

分类：Android作者：编程之家AI导航网

Android 自定义支持快速搜索筛选的选择控件使用方法，具体如下

项目中遇到选择控件选项过多，需要快速查找匹配的情况。
做了简单的Demo，效果图如下：

源码地址：https://github.com/whieenz/SearchSelect

image

这个控件是由Dialog+SearchView+ListView实现的。Dialog用来承载选择控件，SearchView实现输入，ListView展示结果。设计概要图如下：

image

一、自定义Dialog

Dialog布局文件

<?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="wrap_content"
    android:layout_weight="1"
    android:background="@drawable/dialog_bg"
    android:layout_height="match_parent"
    android:orientation="vertical" >
    <RelativeLayout
      android:layout_width="match_parent"
      android:layout_height="50dp">
      <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="20dp"
        android:layout_centerVertical="true"
        android:textSize="18sp"
        android:textColor="#000000"
        android:id="@+id/tv_dialog_select_title"/>
      <ImageButton
        android:layout_width="50dp"
        android:layout_height="match_parent"
        android:padding="8dp"
        android:layout_marginRight="10dp"
        android:layout_centerVertical="true"
        android:layout_alignParentRight="true"
        android:scaleType="centerInside"
        android:background="@color/transparent"
        android:src="@drawable/im_search_back"
        android:id="@+id/btn_dialog_select_search"/>
    </RelativeLayout>
    <com.whieenz.searchselect.DialogSearchView
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:id="@+id/searchView"
      android:visibility="gone"/>
    <ListView
      android:layout_width="match_parent"
      android:layout_height="0dp"
      android:layout_weight="1"
      android:orientation="vertical"
      android:id="@+id/listview"
      android:layout_gravity="center_horizontal" />
  </LinearLayout>

  <LinearLayout
    android:layout_width="match_parent"
    android:layout_height="80dp"
    android:gravity="center"
    android:background="@color/transparent">
    <ImageButton
      android:layout_width="40dp"
      android:layout_height="40dp"
      android:id="@+id/imb_dialog_select_close"
      android:scaleType="centerInside"
      android:src="@drawable/dialog_close"
      android:background="@color/transparent"/>
  </LinearLayout>

</LinearLayout>

Dialog Java文件

package com.whieenz.searchselect;

import android.app.Activity;
import android.app.Dialog;
import android.content.Context;
import android.content.DialogInterface;
import android.util.displayMetrics;
import android.view.Gravity;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.view.Window;
import android.view.WindowManager;
import android.widget.AdapterView;
import android.widget.ImageButton;
import android.widget.ListView;
import android.widget.TextView;

import java.util.ArrayList;
import java.util.List;


/**
 * Created by whieenz on 2017/7/18.
 */

public class SerachSelectDialog extends Dialog {

  public SerachSelectDialog(Context context,int themeResId) {
    super(context,themeResId);
  }

  /**
   * 设置 Dialog的大小
   * @param x 宽比例
   * @param y 高比例
   */
  public void setDialogWindowAttr(double x,double y,Activity activity){
    if (x<0||x>1||y<0||y>1){
      return;
    }
    Window window = this.getwindow();
    WindowManager.LayoutParams lp = window.getAttributes();
    WindowManager manager = activity.getwindowManager();
    displayMetrics outMetrics = new displayMetrics();
    manager.getDefaultdisplay().getMetrics(outMetrics);
    int width = outMetrics.widthPixels;
    int height = outMetrics.heightPixels;
    lp.gravity = Gravity.CENTER;
    lp.width = (int) (width * x);
    lp.height = (int) (height * y);
    this.getwindow().setAttributes(lp);
  }


  public static class Builder {
    private String title;
    private View contentView;
    private String positiveButtonText;
    private String negativeButtonText;
    private String singleButtonText;
    private List<String> listData;
    private View.OnClickListener positiveButtonClickListener;
    private View.OnClickListener negativeButtonClickListener;
    private View.OnClickListener singleButtonClickListener;

    private View layout;
    private Context context;
    private SerachSelectDialog dialog;
    private OnSelectedListiner selectedListiner;

    ListView listView;
    //SearchView searchView ;
    DialogSearchView searchView;
    ImageButton searchBtn;
    ImageButton closeBtn;
    TextView titleView;
    private boolean state = false;

    public Builder(Context context) {
      //这里传入自定义的style，直接影响此Dialog的显示效果。style具体实现见style.xml
      this.context = context;
      dialog = new SerachSelectDialog(context,R.style.selectDialog);
      LayoutInflater inflater = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
      layout = inflater.inflate(R.layout.dialog_select_search,null);
      listView = (ListView)layout.findViewById(R.id.listview);
      //searchView = (SearchView) layout.findViewById(R.id.searchView);
      searchView = (DialogSearchView) layout.findViewById(R.id.searchView);
      searchBtn = (ImageButton) layout.findViewById(R.id.btn_dialog_select_search);
      closeBtn = (ImageButton) layout.findViewById(R.id.imb_dialog_select_close);
      titleView = (TextView) layout.findViewById(R.id.tv_dialog_select_title);
      dialog.addContentView(layout,new ViewGroup.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT,ViewGroup.LayoutParams.WRAP_CONTENT));
    }

    public Builder setTitle(String title) {
      this.title = title;
      return this;
    }

    public Builder setContentView(View v) {
      this.contentView = v;
      return this;
    }

    public void setListData(List<String> listData) {
      this.listData = listData;
    }

    public Builder setPositiveButton(String positiveButtonText,View.OnClickListener listener) {
      this.positiveButtonText = positiveButtonText;
      this.positiveButtonClickListener = listener;
      return this;
    }

    public Builder setNegativeButton(String negativeButtonText,View.OnClickListener listener) {
      this.negativeButtonText = negativeButtonText;
      this.negativeButtonClickListener = listener;
      return this;
    }

    /**
     * 单按钮对话框和双按钮对话框的公共部分在这里设置
     */
    private SerachSelectDialog create() {
      titleView.setText(title);
      final SearchSelectAdapter sa = new SearchSelectAdapter(context,listData);
      listView.setAdapter(sa);
      listView.invalidate();
      searchBtn.setonClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View view) {
          if (!state){
            searchView.setVisibility(View.VISIBLE);
            state = true;
          }else {
            searchView.setVisibility(View.GONE);
            state = false;
          }
        }
      });
      searchView.setDialogSearchViewListener(new DialogSearchView.DialogSearchViewListener() {

        @Override
        public boolean onQueryTextChange(String text) {
          updateLayout(searchItem(text));
          return false;
        }
      });
      closeBtn.setonClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {
          dialog.dismiss();
        }
      });
      dialog.setondismissListener(new DialogInterface.OndismissListener() {
        @Override
        public void ondismiss(DialogInterface dialog) {

        }
      });

      listView.setonItemClickListener(new AdapterView.OnItemClickListener() {
        @Override
        public void onItemClick(AdapterView<?> parent,View view,int position,long id) {
          selectedListiner.onSelected(sa.getItem(position));
          dialog.dismiss();
        }
      });
      dialog.setContentView(layout);
      //用户可以点击手机Back键取消对话框显示
      dialog.setCancelable(true);
      //用户不能通过点击对话框之外的地方取消对话框显示
      dialog.setCanceledOnTouchOutside(false);
      return dialog;

    }
    public List<String> searchItem(String name) {
      ArrayList<String> mSearchList = new ArrayList<String>();
      for (int i = 0; i < listData.size(); i++) {
        int index = listData.get(i).indexOf(name);
        // 存在匹配的数据
        if (index != -1) {
          mSearchList.add(listData.get(i));
        }
      }
      return mSearchList;
    }

    public void updateLayout(List<String> newList) {
      final SearchSelectAdapter sa = new SearchSelectAdapter(context,newList);
      listView.setAdapter(sa);
      listView.setonItemClickListener(new AdapterView.OnItemClickListener() {
        @Override
        public void onItemClick(AdapterView<?> parent,long id) {
          selectedListiner.onSelected(sa.getItem(position));
          dialog.dismiss();
        }
      });
    }

    public void setSelectedListiner(SerachSelectDialog.Builder.OnSelectedListiner selectedListiner) {
      this.selectedListiner = selectedListiner;
    }

    public static abstract class OnSelectedListiner{
      public abstract void onSelected(String String);
    }

    public SerachSelectDialog show() {
      create();
      dialog.show();
      return dialog;
    }
  }
}

二、自定义SearchView

SearchView 布局文件

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
  android:orientation="vertical"
  android:layout_width="match_parent"
  android:gravity="center"
  android:background="#ffffff"
  android:layout_height="50dp">
    <LinearLayout
      android:layout_width="match_parent"
      android:layout_height="35dp"
      android:orientation="horizontal"
      android:gravity="center_vertical"
      android:layout_marginLeft="15dp"
      android:layout_marginRight="15dp"
      android:background="@drawable/search_layout_bg">
      <ImageButton
        android:layout_width="20dp"
        android:layout_height="20dp"
        android:id="@+id/imb_search_search"
        android:layout_marginLeft="15dp"
        android:scaleType="centerInside"
        android:src="@drawable/im_search_gray"
        android:background="#F0F0F0" />
      <EditText
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="10dp"
        android:layout_marginRight="15dp"
        android:id="@+id/et_search_text"
        android:layout_weight="1"
        android:lines="1"
        android:textSize="14sp"
        android:background="@null"
        android:hint="请输入搜索内容"/>

      <ImageButton
        android:layout_width="35dp"
        android:layout_height="35dp"
        android:padding="12.5dp"
        android:id="@+id/imb_search_clear"
        android:layout_marginRight="20dp"
        android:src="@drawable/im_x"
        android:visibility="gone"
        android:scaleType="centerInside"
        android:background="#F0F0F0" />
    </LinearLayout>

</LinearLayout>

SearchView Java代码

package com.whieenz.searchselect;

import android.content.Context;
import android.text.Editable;
import android.text.TextWatcher;
import android.util.AttributeSet;
import android.view.LayoutInflater;
import android.view.View;
import android.widget.EditText;
import android.widget.ImageView;
import android.widget.LinearLayout;


/**
 * Created by whieenz on 2017/7/19.
 */

public class DialogSearchView extends LinearLayout implements View.OnClickListener {

  /**
   * 输入框 
   */
  private EditText etInput;

  /**
   * 删除键 
   */
  private ImageView ivDelete;

  /**
   * 上下文对象 
   */
  private Context mContext;

  /**
   * 搜索回调接口 
   */
  private DialogSearchViewListener mListener;

  /**
   * 设置搜索回调接口 
   *
   * @param listener 监听者 
   */
  public void setDialogSearchViewListener(DialogSearchViewListener listener) {
    mListener = listener;
  }

  public DialogSearchView(Context context,AttributeSet attrs) {
    super(context,attrs);
    mContext = context;
    LayoutInflater.from(context).inflate(R.layout.view_search_layout,this);
    initViews();
  }

  private void initViews() {
    etInput = (EditText) findViewById(R.id.et_search_text);
    ivDelete = (ImageView) findViewById(R.id.imb_search_clear);
    ivDelete.setonClickListener(this);
    etInput.addTextChangedListener(new EditChangedListener());
    etInput.setonClickListener(this);

  }

  private class EditChangedListener implements TextWatcher {
    @Override
    public void beforeTextChanged(CharSequence charSequence,int i,int i2,int i3) {

    }
    @Override
    public void onTextChanged(CharSequence charSequence,int i3) {
      if (!"".equals(charSequence.toString())) {
        ivDelete.setVisibility(VISIBLE);
        //更新autoComplete数据
        if (mListener != null) {
          mListener.onQueryTextChange(charSequence + "");
        }
      } else {
        ivDelete.setVisibility(GONE);
      }

    }
    @Override
    public void afterTextChanged(Editable editable) {
    }
  }

  @Override
  public void onClick(View view) {
    switch (view.getId()) {
      case R.id.imb_search_clear:
        etInput.setText("");
        if (mListener != null) {
          mListener.onQueryTextChange("");
        }
        ivDelete.setVisibility(GONE);
        break;
    }
  }
  /**
   * search view回调方法 
   */
  public interface DialogSearchViewListener {
    boolean onQueryTextChange(String text);
  }
}

自定义ListView Adapter

listItem 布局文件

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
  android:layout_width="match_parent"
  android:layout_height="50dp"
  android:paddingLeft="10dp"
  android:paddingTop="15dp"
  android:paddingBottom="15dp"
  android:orientation="horizontal">
  <TextView
    android:id="@+id/tv_select_info"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:textSize="20sp"
    android:layout_centerInParent="true"
    android:gravity="center"
    android:lines="1"/>

</RelativeLayout>

Adapter 文件

package com.whieenz.searchselect;

import android.content.Context;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.TextView;


import java.util.List;


public class SearchSelectAdapter extends BaseAdapter {
  private List<String> Datas;
  private Context context;
  private LayoutInflater inflater;

  public SearchSelectAdapter(Context ctx,List<String> datas){
    this.context = ctx;
    this.Datas = datas;
    this.inflater = LayoutInflater.from(ctx);
  }
  @Override
  public int getCount() {
    return Datas.size();
  }

  @Override
  public String getItem(int i) {
    return Datas.get(i);
  }

  @Override
  public long getItemId(int i) {
    return i;
  }

  @Override
  public View getView(int i,ViewGroup viewGroup) {
    ViewHolder holder = null;
    if (view == null ) {
      view = inflater.inflate(R.layout.list_cell_select_single,null);
      holder = new ViewHolder(view);
      view.setTag(holder);
    } else {
      holder = (ViewHolder) view.getTag();
    }

    holder.info.setText(Datas.get(i));
    return view;
  }


  static class ViewHolder {
    TextView info;
    public ViewHolder(View view) {
      info = view.findViewById(R.id.tv_select_info);
    }
  }

}

MainActivity 实现

布局文件

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
  xmlns:tools="http://schemas.android.com/tools"
  android:id="@+id/activity_main"
  android:layout_width="match_parent"
  android:layout_height="match_parent"
  android:orientation="vertical"
  android:padding="10dp"
  tools:context="com.whieenz.searchselect.MainActivity">

  <LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginTop="150dp"
    android:orientation="horizontal">
    <TextView
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:textSize="20sp"
      android:gravity="left"
      android:text="选择结果："
      />
    <TextView
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:textSize="20sp"
      android:textColor="#ff5c5c"
      android:id="@+id/tv_result" />
  </LinearLayout>

  <Button
    android:layout_width="match_parent"
    android:layout_height="40dp"
    android:layout_marginTop="20dp"
    android:gravity="center"
    android:textSize="20sp"
    android:textColor="#ffffff"
    android:background="@drawable/btn_bg"
    android:text="打开选择器"
    android:onClick="doSelect"/>
</LinearLayout>

Java文件

package com.whieenz.searchselect;

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.TextView;

import java.util.ArrayList;
import java.util.List;

public class MainActivity extends AppCompatActivity {
 private List<String> mDatas;
 private TextView textView;

 @Override
 protected void onCreate(Bundle savedInstanceState) {
  super.onCreate(savedInstanceState);
  setContentView(R.layout.activity_main);
  textView = (TextView) findViewById(R.id.tv_result);
  initData();
 }

 public void doSelect(View view){
  SerachSelectDialog.Builder alert = new SerachSelectDialog.Builder(this);
  alert.setListData(mDatas);
  alert.setTitle("请选择城市");
  alert.setSelectedListiner(new SerachSelectDialog.Builder.OnSelectedListiner() {
   @Override
   public void onSelected(String info) {
    textView.setText(info);
   }
  });
  SerachSelectDialog mDialog = alert.show();
  //设置Dialog 尺寸
  mDialog.setDialogWindowAttr(0.9,0.9,this);
 }
 /**
  * 初始化数据
  */
 private void initData(){
  mDatas = new ArrayList<>();
  String [] citys = {"武汉","北京","上海","深圳","兰州","成都","天津"};
  for (int i = 0; i < 10; i++) {
   for (int j = 0; j < citys.length; j++) {
    mDatas.add(citys[j]+i);
   }
  }
 }
}

其他配置

Dialog style（样式）

  <style name="selectDialog" parent="@android:style/Theme.Dialog">
    <item name="android:windowNoTitle">true</item>//无标题
    <item name="android:windowBackground">@color/transparent</item>
  </style>

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持编程小技巧。

版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 dio@foxmail.com 举报，一经查实，本站将立刻删除。

相关推荐

Android 性能优化——之控件的优化
Android性能优化——之控件的优化 前面讲了图像的优化，接下来分享一下控件的性能优化，这里主要是面向自定义View的优化。 1、首先先说一下我们在自定义View中可能会犯的3个错误： 1）UselesscallstoonDraw()：我们知道调用View.invalidate()会触发Vi...
android TextView描边
前言 上一篇已经讲了如何实现textView中粗字体效果，里面主要重写了onDraw方法。 这一边讲一个进阶功能，实现textView的描边效果。 上效果图。 上代码： 原理讲解： 效果实现思路是：因为系统api只给paint设置strokewidth方法，却没有提供设置描边的色值的方法，而且我们通
GreenDao教程1
最近项目重构，涉及到了数据库和文件下载，发现GreenDao这个框架还是不错的。直接面向对象的，可以通过对对象的操作，实现数据的存储。 但是官网上的API是在不敢恭维，文档写的很糙，看了半天，才搞懂一系列的流程。在此进行一下纪念。免得那天需要修改的时候，一脸懵逼。直接上干货 官网地址：http://
WebView加载页面的两种方式——网络页面和本地页面
WebView加载页面的两种方式 一、加载网络页面 加载网络页面，是最简单的一种方式，只需要传入http的URL就可以，实现WebView加载网络页面 代码如下图： 二、加载本地页面 1、加载assets目录下的HTML页面： 加载assets目录的页面，大多数可以用来做页面数据的存储打包，这样可以
Android 全局使用第三方字体
给APP全局设置字体主要分为两个方面来介绍 一、给原生界面设置第三方字体 1、准备工作-下载第三方字体：传送门 将文件放入工程assets目录下。（一般个人习惯单独命名一个文件夹放字体文件，也可直接放入根目录，但记得改引用路径） 2、代码实现 a、自定义application，将第三方的字体，替换当
Android中粗字体
前言 最近UI大牛出了一版新的效果图，按照IOS的效果做的，页面里面有普通字体、中粗字体、加粗字体。对于IOS的小伙伴，分分钟搞定，但是对于Android开发的我，瞬间懵逼了。WTF！ 安卓只有粗和不粗呀，哪有中粗这回事。硬着头皮做出来一版之后，看到UI嫌弃的表情。深深的刺痛了我的完美心。说啥也要搞
TabLayout基本使用
前言 Tablayout继承自HorizontalScrollView，可以用作顶部标签效果、底部导航栏效果。一般多与ViewPager一起使用。 想直接了解如何实现短下滑效果的请看：TabLayout的高级用法 首先上几个效果图。 图： 使用方法 下面我们来看如何使用， 第一步，先在gradle引
AndroidStudio 各种异常情况处理大法
最近使用AndroidStudio出现了.java文件，显示为xml文件等问题，通过各种采坑之后，发现删除本地的缓存文件这个方法最管用，差不多可以根治95%的莫名其妙的问题。解决办法如下； 先将AS关闭，然后找到你电脑的目录C:\Users\用户名\.AndroidStudio3.5\system\
Android文件各种存储路径的比较
1、File cacheDir = context.getCacheDir(); 应用内部存储空间（数据文件私有）文件存储到这个路径下，不需要申请权限，当应用被卸载的时候，目录下的文件会被删除。 需要注意的是，这个文件的目录和应用的存储位置有关， 当应用被移动到外部存储设备的时候，文件的绝对路径也是
汉诺塔问题
汉诺塔问题 最近面试题遇到过汉诺塔的问题，当时竟然懵逼了，不会了！！大学研究的问题竟然都忘光了，于是抓紧捡起来。然而在网上看了看博客，发现非递归算法还真挺多。下面总结了一下。 一、递归算法 1、递归算法优缺点：递归算法算是最易于理解也是最容易实现的，但是对内存的消耗也是巨大的，因为递归需要系统堆栈来
苹果市值2025年有望达4万亿美元
pythonJavaScriptjavaHTMLreactjsC#AndroidCSSNode.jssqlrpython-3.xMysqLjQueryc++pandasFlutterangularIOSdjangolinuxswifttypescript路由器JSON路由器设置无线路由器h3c华三华三路由器设置华三路由器电脑软件教程arraysdocker软件图文教程Cvue.jslaravelspring-bootreact-native