版權聲明:本文為部落客原創文章,轉載請标明出處。 https://blog.csdn.net/lyhhj/article/details/47283619
最近在工作中用到了評論和贊的功能,在網上搜了一下有類似的Demo,個人覺得不太好用,就稍微的做了一下優化和修改。
這個功能用到了Popwindow,也就是可以自己定義動畫的彈出框。
首先是popwindow的布局檔案
<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></span>
接下來說一下具體實作步驟:
1.自定義繼承popwindow,并且實作贊、評論的按鈕點選事件....
/**
* 功能描述:标題按鈕上的彈窗(繼承自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,就可以了
<span style="font-size:12px;">/*贊評論點選彈出的popwindow*/
private TitlePopup titlePopup;</span>
<pre class="java" name="code"><span style="font-size:12px;">titlePopup = new TitlePopup(this, ZanPinglunUtil.dip2px(this, 165), ZanPinglunUtil.dip2px(
this, 40));</span>
3.初始化贊和評論按鈕執行點選事件就ok了
最後的執行效果如下圖所示: