安卓实现电脑端的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，布局需要自己调整一下。