PopupWindow 仿微信点赞和评论弹出

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了PopupWindow 仿微信点赞和评论弹出相关的知识,希望对你有一定的参考价值。

微信朋友圈的点赞和评论功能,有2个组成部分:左下角的“更多”按钮;点击该按钮后弹出的对话框;
技术分享

PopupWindow,弹出框使用PopupWindow实现,这是点赞和评论的载体,具体要涉及 PopupWindow 点击非窗口位置和再次点击消失以及显示位置的问题(根据相应更多按钮的位置确定 PopupWindow 的显示位置

  1 package com.example.cmm.helloworld;
  2 
  3 import android.app.AlertDialog;
  4 import android.content.Context;
  5 import android.graphics.drawable.BitmapDrawable;
  6 import android.support.v7.app.AppCompatActivity;
  7 import android.os.Bundle;
  8 import android.view.LayoutInflater;
  9 import android.view.View;
 10 import android.view.ViewGroup;
 11 import android.widget.BaseAdapter;
 12 import android.widget.ImageView;
 13 import android.widget.ListView;
 14 import android.widget.PopupWindow;
 15 import android.widget.TextView;
 16 
 17 import java.util.ArrayList;
 18 import java.util.List;
 19 
 20 public class MainActivity extends AppCompatActivity {
 21 
 22     private PopupWindow mMorePopupWindow;
 23     private int mShowMorePopupWindowWidth;
 24     private int mShowMorePopupWindowHeight;
 25 
 26     @Override
 27     protected void onCreate(Bundle savedInstanceState) {
 28 
 29         super.onCreate(savedInstanceState);
 30 
 31         setContentView(R.layout.activity_main);
 32 
 33         ListView lv = (ListView) findViewById(R.id.listview);
 34 
 35         lv.setAdapter(new MyAdapter(MainActivity.this, getData()));
 36 
 37     }
 38 
 39     private List<Data> getData() {
 40 
 41         List<Data> data = new ArrayList<>();
 42 
 43         data.add(new Data(R.drawable.xiaona, "薄荷栗", "我学过跆拳道,都给我跪下唱征服", "昨天"));
 44         data.add(new Data(R.drawable.xueyan, "欣然", "走遍天涯海角,唯有我家风景最好,啊哈哈", "昨天"));
 45         data.add(new Data(R.drawable.leishao, "陈磊_CL", "老子以后要当行长的,都来找我借钱吧,now", "昨天"));
 46         data.add(new Data(R.drawable.yuhong, "永恒依然", "房子车子都到碗里来", "昨天"));
 47         data.add(new Data(R.drawable.lanshan, "蓝珊", "你们这群傻×,我笑而不语", "昨天"));
 48 
 49         return data;
 50     }
 51 
 52     class MyAdapter extends BaseAdapter {
 53         private List<Data> listdata;
 54         private Context context;
 55 
 56         public MyAdapter(Context context, List<Data> listdata) {
 57             this.context = context;
 58             this.listdata = listdata;
 59         }
 60 
 61         @Override
 62         public int getCount() {
 63             return listdata.size();
 64         }
 65 
 66         @Override
 67         public Object getItem(int arg0) {
 68             return listdata.get(arg0);
 69         }
 70 
 71         @Override
 72         public long getItemId(int arg0) {
 73             return arg0;
 74         }
 75 
 76         @Override
 77         public View getView(int position, View convertView, ViewGroup parent) {
 78 
 79             LayoutInflater inflater = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
 80             convertView = inflater.inflate(R.layout.listview_item, null, false);
 81 
 82             // 带赋值区域
 83             ImageView ivPortrait = (ImageView) convertView.findViewById(R.id.portrait);
 84             TextView tvNickName = (TextView) convertView.findViewById(R.id.nick_name);
 85             TextView tvContent = (TextView) convertView.findViewById(R.id.content);
 86             TextView tvCreatedAt = (TextView) convertView.findViewById(R.id.created_at);
 87             ImageView moreBtn = (ImageView) convertView.findViewById(R.id.more_btn);
 88 
 89             // 赋值
 90             Data data = listdata.get(position);
 91             ivPortrait.setImageResource(data.getPortraitId());
 92             tvNickName.setText(data.getNickName());
 93             tvContent.setText(data.getContent());
 94             tvCreatedAt.setText(data.getCreatedAt());
 95 
 96             // 更多按钮的点击事件
 97             moreBtn.setOnClickListener(new View.OnClickListener() {
 98                 @Override
 99                 public void onClick(View v) {
100                     showMore(v);
101                 }
102             });
103 
104             return convertView;
105         }
106 
107         /**
108          * 弹出点赞和评论框
109          *
110          * @param moreBtnView
111          */
112         private void showMore(View moreBtnView) {
113 
114             if (mMorePopupWindow == null) {
115 
116                 LayoutInflater li = (LayoutInflater) MainActivity.this.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
117                 View content = li.inflate(R.layout.layout_more, null, false);
118 
119                 mMorePopupWindow = new PopupWindow(content, ViewGroup.LayoutParams.WRAP_CONTENT,
120                         ViewGroup.LayoutParams.WRAP_CONTENT);
121                 mMorePopupWindow.setBackgroundDrawable(new BitmapDrawable());
122                 mMorePopupWindow.setOutsideTouchable(true);
123                 mMorePopupWindow.setTouchable(true);
124 
125                 content.measure(View.MeasureSpec.UNSPECIFIED, View.MeasureSpec.UNSPECIFIED);
126                 mShowMorePopupWindowWidth = content.getMeasuredWidth();
127                 mShowMorePopupWindowHeight = content.getMeasuredHeight();
128 
129                 View parent = mMorePopupWindow.getContentView();
130 
131                 TextView like = (TextView) parent.findViewById(R.id.like);
132                 TextView comment = (TextView) parent.findViewById(R.id.comment);
133 
134                 // 点赞的监听器
135                 like.setOnClickListener(new View.OnClickListener() {
136                     @Override
137                     public void onClick(View v) {
138 
139                         final AlertDialog.Builder alert = new AlertDialog.Builder(MainActivity.this);
140                         alert.setTitle("点赞");
141                         alert.setNegativeButton("取消", null);
142                         alert.show();
143                     }
144                 });
145 
146                 // 评论的监听器
147                 comment.setOnClickListener(new View.OnClickListener() {
148                     @Override
149                     public void onClick(View v) {
150                         final AlertDialog.Builder alert = new AlertDialog.Builder(MainActivity.this);
151                         alert.setTitle("评论");
152                         alert.setNegativeButton("取消", null);
153                         alert.show();
154                     }
155                 });
156             }
157 
158             if (mMorePopupWindow.isShowing()) {
159                 mMorePopupWindow.dismiss();
160             } else {
161                 int heightMoreBtnView = moreBtnView.getHeight();
162 
163                 mMorePopupWindow.showAsDropDown(moreBtnView, -mShowMorePopupWindowWidth,
164                         -(mShowMorePopupWindowHeight + heightMoreBtnView) / 2);
165             }
166         }
167     }
168 
169     class Data {
170         private int portraitId; // 头像
171         private String nickName; // 昵称
172         private String content; // 说说
173         private String createdAt; // 发布时间
174 
175         public Data(int portraitId, String nickName, String content, String createdAt) {
176             this.portraitId = portraitId;
177             this.nickName = nickName;
178             this.content = content;
179             this.createdAt = createdAt;
180         }
181 
182         public int getPortraitId() {
183             return portraitId;
184         }
185 
186         public String getNickName() {
187             return nickName;
188         }
189 
190         public String getContent() {
191             return content;
192         }
193 
194         public String getCreatedAt() {
195             return createdAt;
196         }
197     }
198 
199 }

 


以上是关于PopupWindow 仿微信点赞和评论弹出的主要内容,如果未能解决你的问题,请参考以下文章

微信点赞功能测试用例

Android LayoutInflater

Redis缓存 + 定时写入DB,仿微信点赞模块设计

高仿微信朋友圈

Android封装类似微信的顶部TitleBar弹出的PopupWindow代码

Android 仿微信调用第三方应用导航(百度,高德腾讯)