Android 高仿微信朋友圈评论popwindow

最近在工作中用到了评论和赞的功能,在网上搜了一下有类似的Demo,个人觉得不太好用,就稍微的做了一下优化和修改。
这个功能用到了Popwindow,也就是可以自己定义动画的弹出框。

首先是popwindow的布局文件

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
<span style="font-size:14px;"><?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="165dp"
android:layout_height="35dp"
android:layout_gravity="center"
android:gravity="center_vertical" >
<TextView
android:id="@+id/popu_praise"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="@drawable/zan_left"
android:drawableLeft="@drawable/zan"
android:text="赞"
android:drawablePadding="@dimen/small_space"
android:gravity="center_vertical"
android:paddingLeft="@dimen/middle_space"
android:textColor="#ffffffff"
android:textSize="@dimen/smaller_textSize" />
<TextView
android:id="@+id/popu_cancel"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:drawableLeft="@drawable/zan_left"
android:layout_gravity="center_horizontal"
android:text="取消"
android:drawablePadding="@dimen/small_space"
android:gravity="center_vertical"
android:paddingLeft="@dimen/middle_space"
android:visibility="gone"
android:textColor="#ffffffff"
android:textSize="16sp" />
<LinearLayout
android:background="#4d5054"
android:layout_marginTop="1px"
android:layout_marginBottom="1px"
android:layout_width="wrap_content"
android:layout_height="match_parent">
<View
android:layout_width="0.5dp"
android:layout_height="18dp"
android:layout_gravity="center_vertical"
android:background="#3b3f43" />
</LinearLayout>
<TextView
android:id="@+id/popu_comment"
android:background="@drawable/zan_right"
android:layout_width="0dp"
android:layout_height="match_parent"
android:drawablePadding="@dimen/small_space"
android:gravity="center_vertical"
android:paddingLeft="@dimen/middle_space"
android:layout_weight="1"
android:drawableLeft="@drawable/pinglun"
android:text="评论"
android:textColor="#ffffffff"
android:textSize="@dimen/smaller_textSize" />
</LinearLayout>

接下来说一下具体实现步骤:

1.自定义继承popwindow,并且实现赞、评论的按钮点击事件….

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
/**
* 功能描述:标题按钮上的弹窗(继承自PopupWindow)
*/
public class TitlePopup extends PopupWindow {
private TextView priase;
private TextView comment;
private TextView cancel;
private Context mContext;
// 列表弹窗的间隔
protected final int LIST_PADDING = 10;
// 实例化一个矩形
private Rect mRect = new Rect();
// 坐标的位置(x、y)
private final int[] mLocation = new int[2];
// 屏幕的宽度和高度
private int mScreenWidth, mScreenHeight;
// 判断是否需要添加或更新列表子类项
private boolean mIsDirty;
// 位置不在中心
private int popupGravity = Gravity.NO_GRAVITY;
// 弹窗子类项选中时的监听
private OnItemOnClickListener mItemOnClickListener;
// 定义弹窗子类项列表
private ArrayList<ActionItem> mActionItems = new ArrayList<ActionItem>();
public TitlePopup(Context context) {
// 设置布局的参数
this(context, LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);
}
public TitlePopup(Context context, int width, int height) {
this.mContext = context;
// 设置可以获得焦点
setFocusable(true);
// 设置弹窗内可点击
setTouchable(true);
// 设置弹窗外可点击
setOutsideTouchable(true);
// 获得屏幕的宽度和高度
// mScreenWidth = Util.getScreenWidth(mContext);
// mScreenHeight = Util.getScreenHeight(mContext);
// 设置弹窗的宽度和高度
setWidth(width);
setHeight(height);
setBackgroundDrawable(new BitmapDrawable());
// 设置弹窗的布局界面
View view = LayoutInflater.from(mContext).inflate(
R.layout.comment_popu, null);
setContentView(view);
Log.e("",
"3333==========" + view.getHeight() + " " + view.getWidth());
priase = (TextView) view.findViewById(R.id.popu_praise);
comment = (TextView) view.findViewById(R.id.popu_comment);
cancel = (TextView) view.findViewById(R.id.popu_cancel);
priase.setOnClickListener(onclick);
comment.setOnClickListener(onclick);
}
/**
* 显示弹窗列表界面
*/
public void show(final View c) {
// 获得点击屏幕的位置坐标
c.getLocationOnScreen(mLocation);
// 设置矩形的大小
mRect.set(mLocation[0], mLocation[1], mLocation[0] + c.getWidth(),
mLocation[1] + c.getHeight());
priase.setText(mActionItems.get(0).mTitle);
// 判断是否需要添加或更新列表子类项
if (mIsDirty) {
// populateActions();
}
Log.e("", "333 " + this.getHeight());// 50
Log.e("", "333 " + c.getHeight());// 96
Log.e("", "333 " + this.getWidth());
Log.e("", "333 " + (mLocation[1]));
// 显示弹窗的位置
// showAtLocation(view, popupGravity, mScreenWidth - LIST_PADDING
// - (getWidth() / 2), mRect.bottom);
showAtLocation(c, Gravity.NO_GRAVITY, mLocation[0] - this.getWidth()
- 10, mLocation[1] - ((this.getHeight() - c.getHeight()) / 2));
}
OnClickListener onclick = new OnClickListener() {
@Override
public void onClick(View v) {
switch (v.getId()) {
case R.id.popu_comment:
mItemOnClickListener.onItemClick(mActionItems.get(1), 1);
dismiss();
break;
case R.id.popu_praise:
mItemOnClickListener.onItemClick(mActionItems.get(0), 0);
dismiss();
break;
}
}
};
/**
* 添加子类项
*/
public void addAction(ActionItem action) {
if (action != null) {
mActionItems.add(action);
mIsDirty = true;
}
}
/**
* 清除子类项
*/
public void cleanAction() {
if (mActionItems.isEmpty()) {
mActionItems.clear();
mIsDirty = true;
}
}
/**
* 根据位置得到子类项
*/
public ActionItem getAction(int position) {
if (position < 0 || position > mActionItems.size())
return null;
return mActionItems.get(position);
}
/**
* 移除指定位置Item
* @param position
*/
public void removeActionItem(int position){
if (position < 0 || position > mActionItems.size()&&mActionItems!=null){
return ;
}else{
mActionItems.remove(position);
}
}
/**
* 移除指定位置Item
* @param position
*/
public void addPositionActionItem(int position,ActionItem item){
if (position < 0 || position > mActionItems.size()&&mActionItems!=null){
return ;
}else{
mActionItems.add(position,item);
}
}
/**
* 设置监听事件
*/
public void setItemOnClickListener(
OnItemOnClickListener onItemOnClickListener) {
this.mItemOnClickListener = onItemOnClickListener;
}
/**
* @author yangyu 功能描述:弹窗子类项按钮监听事件
*/
public static interface OnItemOnClickListener {
public void onItemClick(ActionItem item, int position);
}
}

2.在使用的地方初始化TitlePop,就可以了

赞评论点击弹出的popwindow

1
2
3
4
5
6
private TitlePopup titlePopup;
titlePopup = new TitlePopup(this,
ZanPinglunUtil.dip2px(this,165),
ZanPinglunUtil.dip2px(
this, 40));

3.初始化赞和评论按钮执行点击事件就ok了

最后的执行效果如下图所示: