android自定義popupwindow仿微信右上角彈出菜單效果

2019-12-12 04:30:53

字體：大中小

來源：轉載

供稿：網友

微信右上角的操作菜單看起來很好用，就照著仿了一下，不過是舊版微信的，手里剛好有一些舊版微信的資源圖標，給大家分享一下。

不知道微信是用什么實現的，我使用popupwindow來實現，主要分為幾塊內容：

1、窗口布局文件：popwin_share.xml

 <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"   android:layout_width="wrap_content"   android:layout_height="wrap_content"   android:background="@drawable/title_tools_bg"   android:orientation="vertical" >    <LinearLayout     android:id="@+id/layout_share"     style="@style/fill_width"     android:orientation="horizontal"      android:background="@drawable/menu_left_item_selector"     android:padding="5dp">      <ImageView       android:layout_marginLeft="7dp"       style="@style/wrap"       android:scaleType="fitCenter"       android:src="@drawable/share" />      <TextView       style="@style/wrap"       android:textColor="@color/white"       android:textSize="@dimen/text18"       android:layout_marginLeft="5dp"       android:text="分享內容" />   </LinearLayout>      <LinearLayout     android:id="@+id/layout_copy"     style="@style/fill_width"     android:orientation="horizontal"      android:background="@drawable/menu_left_item_selector"     android:padding="5dp">      <ImageView       android:layout_marginLeft="5dp"       style="@style/wrap"       android:scaleType="fitCenter"       android:src="@drawable/copy_pressed" />      <TextView       style="@style/wrap"       android:textColor="@color/white"       android:textSize="@dimen/text18"       android:layout_marginLeft="5dp"       android:text="復制結果" />   </LinearLayout>  </LinearLayout>

采用線性布局，因為里面是一行一行豎排的菜單，線性布局更容易控制。大布局里面放了兩個垂直排列的線性布局，每個線性布局中分別有橫向排列的imageview和textview，很簡單的布局。大布局的背景用了一個圖片，當然也可以自定義一些其他顏色。

2、popupwindow代碼，我這里是自定義一個popupwindows類，繼承自PopupWindow：

 package com.xjw.view;  import com.xjw.translate.R;  import android.app.Activity; import android.graphics.drawable.ColorDrawable; import android.view.LayoutInflater; import android.view.View; import android.widget.AdapterView; import android.widget.BaseAdapter; import android.widget.LinearLayout; import android.widget.ListView; import android.widget.PopupWindow;   /**     * 項目名稱：translate   * 實現功能： 翻譯詳情界面，分享彈出窗口  * 類名稱：PopWinShare   * 類描述：(該類的主要功能)  * 創建人：徐紀偉  * E-mail: xujiwei558@126.com  * 創建時間：2014年10月18日 下午4:37:25     * @version    */ public class PopWinShare extends PopupWindow{   private View mainView;   private LinearLayout layoutShare, layoutCopy;   public PopWinShare(Activity paramActivity, View.OnClickListener paramOnClickListener, int paramInt1, int paramInt2){      super(paramActivity);      //窗口布局     mainView = LayoutInflater.from(paramActivity).inflate(R.layout.popwin_share, null);     //分享布局     layoutShare = ((LinearLayout)mainView.findViewById(R.id.layout_share));     //復制布局     layoutCopy = (LinearLayout)mainView.findViewById(R.id.layout_copy);     //設置每個子布局的事件監聽器     if (paramOnClickListener != null){       layoutShare.setOnClickListener(paramOnClickListener);       layoutCopy.setOnClickListener(paramOnClickListener);     }     setContentView(mainView);     //設置寬度     setWidth(paramInt1);     //設置高度     setHeight(paramInt2);     //設置顯示隱藏動畫     setAnimationStyle(R.style.AnimTools);     //設置背景透明     setBackgroundDrawable(new ColorDrawable(0));   } }

里面提供了一個構造方法，包含四個參數，第一個參數是上下文的activity，第二個是菜單的點擊事件，從外邊傳遞進來的，要綁定給每一行的菜單，具體的事件實現當然要寫在activity中，后面兩個分別是彈出窗口的寬度和高度。里面還包含了一個動畫樣式，窗口打開和關閉時出現動畫的樣式。

3、動畫樣式，顯示動畫，縮放動畫：push_in.xml

<?xml version="1.0" encoding="utf-8"?> <scale  xmlns:android="http://schemas.android.com/apk/res/android"     android:interpolator="@android:anim/accelerate_decelerate_interpolator"      android:fromXScale="1.0"       android:toXScale="1.0"       android:fromYScale="0"       android:toYScale="1.0"       android:pivotX="0"      android:pivotY="10%"      android:duration="200" />

關閉動畫，也是縮放動畫：push_out.xml

 <?xml version="1.0" encoding="utf-8"?>  <scale  xmlns:android="http://schemas.android.com/apk/res/android"     android:interpolator="@android:anim/accelerate_decelerate_interpolator"      android:fromXScale="1.0"       android:toXScale="1.0"       android:fromYScale="1.0"       android:toYScale="0"       android:pivotX="0"      android:pivotY="10%"      android:duration="200" />

style樣式定義：

 <style name="AnimTools" parent="@android:style/Animation">    <item name="android:windowEnterAnimation">@anim/push_in</item>    <item name="android:windowExitAnimation">@anim/push_out</item>  </style>

到此為止我們的自定義窗口已經定義好了。接下來看使用。

 if (popWinShare == null) {   //自定義的單擊事件   OnClickLintener paramOnClickListener = new OnClickLintener();   popWinShare = new PopWinShare(TranslateDataContentActivity.this, paramOnClickListener, DisplayUtil.dip2px(context, 160), DisplayUtil.dip2px(context, 160));   //監聽窗口的焦點事件，點擊窗口外面則取消顯示   popWinShare.getContentView().setOnFocusChangeListener(new View.OnFocusChangeListener() {          @Override     public void onFocusChange(View v, boolean hasFocus) {       if (!hasFocus) {         popWinShare.dismiss();       }     }   }); } //設置默認獲取焦點 popWinShare.setFocusable(true); //以某個控件的x和y的偏移量位置開始顯示窗口 popWinShare.showAsDropDown(btnTools, 0, 0); //如果窗口存在，則更新 popWinShare.update();

每個子菜單的單擊事件自定義內部類，在里面就可以寫每個子菜單的單擊事件啦，

class OnClickLintener implements OnClickListener{      @Override     public void onClick(View v) {       switch (v.getId()) {       case R.id.layout_share:                  break;       case R.id.layout_copy:                  break;                 default:         break;       }            }        }

效果預覽：