安卓实现电脑端的QQ登录界面 自动提示+点击按钮提示输入记录

最近在论坛里面有人提出一个问题，要实现类似于电脑端QQ的登录界面的输入样式，

大概就是上面这个效果，下面我给大家大概讲一下思路：

很多人都说用Editext还有spinner来完成，大家可能都忽略了一个控件叫做AutoComleteTextView：这是一个带自动提示框的输入View，下面看代码吧：

public class QQLoginDemoActivity extends AppCompatActivity {


    private AutoCompleteTextView view;
    MyAdapter arrayAdapter;
    List<String> dd = new ArrayList<>();

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_demo);

        dd.add("283426462");
        dd.add("2339124534");
        dd.add("32132465411");
        dd.add("321324654");
        view = ((AutoCompleteTextView) findViewById(R.id.atv));
        arrayAdapter = new MyAdapter(this, R.layout.item, view);
        view.setAdapter(arrayAdapter);

    }

    public void click(View view) {
        this.view.showDropDown();//这个方法是主动弹出提示
    }

    class MyAdapter extends ArrayAdapter<String> {
        private Context context;
        private int resourse;
        private AutoCompleteTextView act;

        public MyAdapter(Context context, int resource, AutoCompleteTextView view) {
            super(context, resource);
            this.context = context;
            this.resourse = resource;
            this.act = view;
        }

        @Override
        public int getCount() {
            return dd.size();
        }

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

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

        @Override
        public View getView(final int i, View view, ViewGroup viewGroup) {
            ViewHolder holder;
            if (null == view) {
                view = LayoutInflater.from(context).inflate(resourse, viewGroup, false);
                holder = new ViewHolder(view);
                view.setTag(holder);
            } else {
                holder = (ViewHolder) view.getTag();
            }
            holder.textView.setText((getItem(i)));
            holder.button.setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View view) {
                    dd.remove(i);
                    notifyDataSetChanged();
                }
            });
            return view;
        }

        class ViewHolder {

            private final TextView textView;
            private final TextView button;

            public ViewHolder(View view) {
                textView = ((TextView) view.findViewById(R.id.text));
                button = ((TextView) view.findViewById(R.id.delete));
            }
        }
    }
}

布局文件很简单：activity_demo.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/activity_demo"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.lixuce.kotlindemo.DemoActivity">

   <AutoCompleteTextView
       android:id="@+id/atv"
       android:layout_width="300dp"
       android:layout_height="wrap_content" />
   <Button
       android:id="@+id/button"
       android:onClick="click"
       android:layout_toRightOf="@+id/atv"
       android:layout_width="wrap_content"
       android:layout_height="wrap_content" />
</RelativeLayout>

item的布局：

<?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="horizontal">

    <TextView
        android:text="提示"
        android:id="@+id/text"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="1" />

    <TextView
        android:id="@+id/delete"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="删除" />
</LinearLayout>

大概的实现过程就是这样了，因为是Demo，布局需要自己调整一下。