Android实现仿QQ登录可编辑下拉菜单
在Android里,直接提供的Spinner控件虽然可以实现下拉菜单的效果,但其效果并不理想,很多时候我们需要类似手机QQ那样既可以在文本框中直接输入编辑文字,可以在下拉菜单中选中或者删除菜单选项,并且下拉菜单并不是以遮罩整个手机屏幕方式,而是以浮动在屏幕上的效果出现。下面呢,就来实现一下这些效果。
最后效果为:
此次主要以EdiText、PopupWindow、ListView及Adapter来实现这种下拉效果。具体实现步骤就不一步步详细介绍了,直接贴完整代码吧,注释比较详细,相信都能看得懂。
//主界面Activity代码:
- public class SelectActivity extends Activity implements Callback {
- //PopupWindow对象
- private PopupWindow selectPopupWindow= null;
- //自定义Adapter
- private OptionsAdapter optionsAdapter = null;
- //下拉框选项数据源
- private ArrayList<String> datas = new ArrayList<String>();;
- //下拉框依附组件
- private LinearLayout parent;
- //下拉框依附组件宽度,也将作为下拉框的宽度
- private int pwidth;
- //文本框
- private EditText et;
- //下拉箭头图片组件
- private ImageView image;
- //恢复数据源按钮
- private Button button;
- //展示所有下拉选项的ListView
- private ListView listView = null;
- //用来处理选中或者删除下拉项消息
- private Handler handler;
- //是否初始化完成标志
- private boolean flag = false;
- @Override
- public void onCreate(Bundle savedInstanceState) {
- super.onCreate(savedInstanceState);
- setContentView(R.layout.select);
- }
- /**
- * 没有在onCreate方法中调用initWedget(),而是在onWindowFocusChanged方法中调用,
- * 是因为initWedget()中需要获取PopupWindow浮动下拉框依附的组件宽度,在onCreate方法中是无法获取到该宽度的
- */
- @Override
- public void onWindowFocusChanged(boolean hasFocus) {
- super.onWindowFocusChanged(hasFocus);
- while(!flag){
- initWedget();
- flag = true;
- }
- }
- /**
- * 初始化界面控件
- */
- private void initWedget(){
- //初始化Handler,用来处理消息
- handler = new Handler(SelectActivity.this);
- //初始化界面组件
- parent = (LinearLayout)findViewById(R.id.parent);
- et = (EditText)findViewById(R.id.edittext);
- image = (ImageView)findViewById(R.id.btn_select);
- //获取下拉框依附的组件宽度
- int width = parent.getWidth();
- pwidth = width;
- //设置点击下拉箭头图片事件,点击弹出PopupWindow浮动下拉框
- image.setOnClickListener(new View.OnClickListener() {
- @Override
- public void onClick(View v) {
- if(flag){
- //显示PopupWindow窗口
- popupWindwShowing();
- }
- }
- });
- //初始化PopupWindow
- initPopuWindow();
- button = (Button)findViewById(R.id.refresh);
- //设置点击事件,恢复下拉框列表数据,没有什么作用,纯粹是为了方便多看几次效果而设置
- button.setOnClickListener(new View.OnClickListener() {
- @Override
- public void onClick(View v) {
- initDatas();
- optionsAdapter.notifyDataSetChanged();
- }
- });
- }
- /**
- * 初始化填充Adapter所用List数据
- */
- private void initDatas(){
- datas.clear();
- datas.add("北京");
- datas.add("上海");
- datas.add("广州");
- datas.add("深圳");
- datas.add("重庆");
- datas.add("青岛");
- datas.add("石家庄");
- }
- /**
- * 初始化PopupWindow
- */
- private void initPopuWindow(){
- initDatas();
- //PopupWindow浮动下拉框布局
- View loginwindow = (View)this.getLayoutInflater().inflate(R.layout.options, null);
- listView = (ListView) loginwindow.findViewById(R.id.list);
- //设置自定义Adapter
- optionsAdapter = new OptionsAdapter(this, handler,datas);
- listView.setAdapter(optionsAdapter);
- selectPopupWindow = new PopupWindow(loginwindow, pwidth,LayoutParams.WRAP_CONTENT, true);
- selectPopupWindow.setOutsideTouchable(true);
- //这一句是为了实现弹出PopupWindow后,当点击屏幕其他部分及Back键时PopupWindow会消失,
- //没有这一句则效果不能出来,但并不会影响背景
- //本人能力极其有限,不明白其原因,还望高手、知情者指点一下
- selectPopupWindow.setBackgroundDrawable(new BitmapDrawable());
- }
- /**
- * 显示PopupWindow窗口
- *
- * @param popupwindow
- */
- public void popupWindwShowing() {
- //将selectPopupWindow作为parent的下拉框显示,并指定selectPopupWindow在Y方向上向上偏移3pix,
- //这是为了防止下拉框与文本框之间产生缝隙,影响界面美化
- //(是否会产生缝隙,及产生缝隙的大小,可能会根据机型、Android系统版本不同而异吧,不太清楚)
- selectPopupWindow.showAsDropDown(parent,0,-3);
- }
- /**
- * PopupWindow消失
- */
- public void dismiss(){
- selectPopupWindow.dismiss();
- }
- /**
- * 处理Hander消息
- */
- @Override
- public boolean handleMessage(Message message) {
- Bundle data = message.getData();
- switch(message.what){
- case 1:
- //选中下拉项,下拉框消失
- int selIndex = data.getInt("selIndex");
- et.setText(datas.get(selIndex));
- dismiss();
- break;
- case 2:
- //移除下拉项数据
- int delIndex = data.getInt("delIndex");
- datas.remove(delIndex);
- //刷新下拉列表
- optionsAdapter.notifyDataSetChanged();
- break;
- }
- return false;
- }
- }
自定义适配器Adapter代码:
- public class OptionsAdapter extends BaseAdapter {
- private ArrayList<String> list = new ArrayList<String>();
- private Activity activity = null;
- private Handler handler;
- /**
- * 自定义构造方法
- * @param activity
- * @param handler
- * @param list
- */
- public OptionsAdapter(Activity activity,Handler handler,ArrayList<String> list){
- this.activity = activity;
- this.handler = handler;
- this.list = list;
- }
- @Override
- public int getCount() {
- return list.size();
- }
- @Override
- public Object getItem(int position) {
- return list.get(position);
- }
- @Override
- public long getItemId(int position) {
- return position;
- }
- @Override
- public View getView(final int position, View convertView, ViewGroup parent) {
- ViewHolder holder = null;
- if (convertView == null) {
- holder = new ViewHolder();
- //下拉项布局
- convertView = LayoutInflater.from(activity).inflate(R.layout.option_item, null);
- holder.textView = (TextView) convertView.findViewById(R.id.item_text);
- holder.imageView = (ImageView) convertView.findViewById(R.id.delImage);
- convertView.setTag(holder);
- } else {
- holder = (ViewHolder) convertView.getTag();
- }
- holder.textView.setText(list.get(position));
- //为下拉框选项文字部分设置事件,最终效果是点击将其文字填充到文本框
- holder.textView.setOnClickListener(new View.OnClickListener() {
- @Override
- public void onClick(View v) {
- Message msg = new Message();
- Bundle data = new Bundle();
- //设置选中索引
- data.putInt("selIndex", position);
- msg.setData(data);
- msg.what = 1;
- //发出消息
- handler.sendMessage(msg);
- }
- });
- //为下拉框选项删除图标部分设置事件,最终效果是点击将该选项删除
- holder.imageView.setOnClickListener(new View.OnClickListener() {
- @Override
- public void onClick(View v) {
- Message msg = new Message();
- Bundle data = new Bundle();
- //设置删除索引
- data.putInt("delIndex", position);
- msg.setData(data);
- msg.what = 2;
- //发出消息
- handler.sendMessage(msg);
- }
- });
- return convertView;
- }
- }
- class ViewHolder {
- TextView textView;
- ImageView imageView;
- }
主界面布局select.xml文件:
- <?xml version="1.0" encoding="utf-8"?>
- <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
- android:orientation="vertical"
- android:layout_width="fill_parent"
- android:layout_height="fill_parent"
- android:background="#EEEED1"
- >
- <LinearLayout android:id="@+id/parent" android:layout_width="wrap_content"
- android:layout_height="wrap_content" android:orientation="horizontal"
- android:layout_marginTop="50dp" android:layout_marginLeft="30dp">
- <EditText android:id="@+id/edittext" android:layout_width="200dp" android:singleLine="true"
- android:layout_height="40dp" android:background="@drawable/bg1" android:paddingLeft="3dp"/>
- <ImageView android:id="@+id/btn_select" android:layout_width="30dp" android:layout_height="40dp"
- android:src="@drawable/img1" android:scaleType="fitXY"/>
- </LinearLayout>
- <Button android:id="@+id/refresh" android:layout_width="wrap_content" android:layout_height="45dp"
- android:text="恢复" android:textColor="#000000" android:textSize="20sp"
- android:layout_marginTop="30dp" android:layout_marginLeft="30dp"/>
- lt;/LinearLayout>
PopupWindow浮动下拉框布局options.xml文件:
- <?xml version="1.0" encoding="utf-8"?>
- <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
- android:orientation="vertical"
- android:layout_width="fill_parent"
- android:layout_height="wrap_content"
- android:gravity="center_horizontal"
- >
- <ListView android:id="@+id/list" android:layout_width="fill_parent"
- android:layout_height="wrap_content" android:cacheColorHint="#00000000">
- </ListView>
- </LinearLayout>
下拉选项布局option_item.xml文件:
- <?xml version="1.0" encoding="utf-8"?>
- <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
- android:layout_width="fill_parent"
- android:layout_height="fill_parent"
- android:background="#235654"
- >
- <RelativeLayout
- android:layout_width="wrap_content"
- android:layout_height="wrap_content"
- android:gravity="center_vertical"
- android:minHeight="40dp"
- >
- <ImageView android:id="@+id/delImage" android:layout_width="20dp"
- android:layout_height="wrap_content" android:src="@drawable/del" android:textSize="18sp"
- android:layout_alignParentRight="true" android:layout_marginRight="10dp"/>
- <TextView android:id="@+id/item_text" android:layout_height="wrap_content"
- android:layout_width="fill_parent" android:layout_toLeftOf="@id/delImage"
- android:paddingLeft="5dp" android:layout_alignParentLeft="true"></TextView>
- </RelativeLayout>
- </LinearLayout>
Android实现仿QQ登录可编辑下拉菜单相关推荐
- android 实现仿QQ登录可编辑下拉菜单
今天,简单讲讲android里如何实现向QQ一样的登录后记住用户名的下拉框. 这个其实也很简单,网上搜索了一下,很多相关的资料,基本都是PopupWindow+ListView的方式,实现起来比较灵活 ...
- Android实现仿QQ登录可编辑下拉菜单
Android实现仿QQ登录可编辑下拉菜单 在Android里,直接提供的Spinner控件虽然可以实现下拉菜单的效果,但其效果并不理想,很多时候我们需要类似手机QQ那样既可以在文本框中直接输入编辑文 ...
- Android实现可编辑下拉菜单
Android实现仿QQ登录可编辑下拉菜单 在Android里,直接提供的Spinner控件虽然可以实现下拉菜单的效果,但其效果并不理想,很多时候我们需要类似手机QQ那样既可以在文本框中直接输入编辑文 ...
- android studio 下拉菜单,怎么在android studio中使用Spinner实现一个下拉菜单
怎么在android studio中使用Spinner实现一个下拉菜单 发布时间:2021-03-23 14:56:15 来源:亿速云 阅读:92 作者:Leah 这期内容当中小编将会给大家带来有关怎 ...
- Android实现仿QQ登录界面背景动画效果
登录QQ的时候,我们会看到在登录界面的背景不是静态的,而是一段动画效果,刚开始觉得蛮好奇的,现在我们也来实现一下这种效果,实现起来还是挺简单的. 实现步骤: 1.自定义CustomVideoView类 ...
- Android仿手机淘宝多级下拉菜单
我们在常用的电商或者旅游APP中,例如美团,手机淘宝等等,都能够看的到有那种下拉式的二级列表菜单.具体如图所示: 上面两张图就是美团的一个二级列表菜单的一个展示.我相信很多人都想开发一个跟它一样的功能 ...
- web前端页面——移动端简单登录页面、下拉菜单(代码详细注释)
今天跟着专业老师复习了一下前端,感觉好多都已经忘记了,我将今天复习的一些重点整理出来. https://blog.csdn.net/hanhanwanghaha宝藏女孩 欢迎您的关注! 欢迎关注微 ...
- Android高仿QQ消息列表、侧拉删除菜单按钮效果
目 录(本篇字数:3000) 介绍 Item布局 自定义存放Item父容器 Bug分析 ·一.解决滑动冲突 二.解决Item点击事件的冲突 三.限制只能有一个menu被打开 博文续篇 ListV ...
- 仿QQ空间,百思不得姐下拉刷新图片放大
1.概述 实习生进阶到项目部分会带他们做一个百思不得姐项目,那么个人主页就有类似于QQ空间下拉图片放大的效果,趁着现在还闲就实现一下效果: 2.实现 1. 效果分析 ScrollView和ListVi ...
最新文章
- 在Java SE中使用Hibernate处理数据
- android ios 上传图片到服务器,.net 接收ios, android的上传图片
- Replicate(网络复制),ActorRole(角色),Ownership(所有权)以及RPC(远程调用)等等...
- spring boot 微服务集群 + 注册中心
- apache wicket_Apache Wicket:记住我的功能
- ElasticSearch的Object数据类型
- fabric node enrollAdmin.js 报错SyntaxError: Unexpected token function at createScript (vm.js:56:10)
- 学习笔记之rpm程序包管理功能解析
- socket.io实现客户端和服务端的双向通信
- js手机号批量滚动抽奖代码实现
- 计算两向量的旋转角(转)
- 数据类型不一致: 应为 NUMBER, 但却获得 BINARY
- Pegasus Serial Port Tool @ Simplicity Version 串口测试工具简化版发布
- swal如何加入html语言,前端基础(九):SweetAlert(弹出框)
- 音乐、音效素材库,好听的BGM都在这~
- 第一章 初探Swing
- 招商银行信用卡中心18秋招题解
- gym100676 [小熊骑士限定]2015 ACM Arabella Collegiate Programming Contest
- 图像配准(匹配)与变化检测
- IT服务管理指标体系与报表体系