天天看點
傳回

Android筆記__PopupWindow底部彈出自定義菜單

Android筆記__PopupWindow底部彈出自定義菜單

        效果圖看不出漸變效果，實際上半透明的背景是有一個漸顯的效果，而底部的菜單彈出來的時候也是有一個從低往上彈的效果。

        主要原理是：

            1、直接顯示PopupWindow

            2、漸顯半透明背景，同時彈出底下的菜單

        話不多說，直接上代碼：

MenuBottomPopupWindow 代碼

package com.imxiaoyu.common.base.popup_window;

import android.app.Activity;
import android.view.LayoutInflater;
import android.view.View;
import android.view.animation.AlphaAnimation;
import android.view.animation.Animation;
import android.widget.LinearLayout;
import android.widget.TextView;

import com.imxiaoyu.common.R;
import com.imxiaoyu.common.utils.AnimatorUtils;
import com.imxiaoyu.common.utils.DensityUtils;

/**
 * 底部彈出的菜單
 * Created by 龐光渝 on 2017/3/22.
 */

public class MenuBottomPopupWindow extends BasePopupWindow {

    /**
     *
     */
    private TextView tvCancel;
    private TextView tvBg;
    private LinearLayout llyMenu;
    private LinearLayout llyAddMenu;
    private int dpHeight = ;


    public MenuBottomPopupWindow(Activity activity) {
        super(activity);
    }

    @Override
    protected int getLayoutId() {
        return R.layout.popup_window_menu_bottom;
    }

    @Override
    protected void initView() {
        llyMenu = findView(R.id.lly_menu);
        llyAddMenu = findView(R.id.lly_add_menu);
        tvCancel = findView(R.id.tv_cancel, this);
        tvBg = findView(R.id.tv_bg, this);
    }

    @Override
    public void onClick(View view) {
        if (view.getId() == tvCancel.getId()) {
            dismiss();
        }
        if (view.getId() == tvBg.getId()) {
            dismiss();
        }
    }


    /**
     * 添加一個菜單
     *
     * @param name            菜單的顯示名稱
     * @param onClickListener 菜單的相應點選事件
     */
    public void addMenu(String name, View.OnClickListener onClickListener) {
        dpHeight += ;
        MenuModel menuModel = new MenuModel();
        menuModel.setButtonName(name);
        menuModel.setOnClickListener(onClickListener);
        llyAddMenu.addView(getView(menuModel));
    }

    /**
     * 設定，并擷取到菜單子項的視圖（View）
     *
     * @param menuModel 菜單對象的模型
     * @return
     */
    private View getView(final MenuModel menuModel) {
        // 引入視窗配置檔案
        View itemView = LayoutInflater.from(getActivity()).inflate(R.layout.popup_window_menu_bottom_item, null);
        TextView textView = (TextView) itemView.findViewById(R.id.tv_item);
        if (menuModel != null) {
            textView.setText(menuModel.getButtonName() + "");
            if (menuModel.getOnClickListener() != null) {
                textView.setOnClickListener(new View.OnClickListener() {
                    @Override
                    public void onClick(View v) {
                        // TODO Auto-generated method stub
                        menuModel.getOnClickListener().onClick(v);
                        dismiss();
                    }
                });
            }
        }
        return itemView;
    }

    /**
     * 菜單對象模型
     */
    public class MenuModel {
        private String ButtonName;//菜單的名稱
        private View.OnClickListener onClickListener;//菜單相應的點選事件

        public String getButtonName() {
            return ButtonName;
        }

        public void setButtonName(String buttonName) {
            ButtonName = buttonName;
        }

        public View.OnClickListener getOnClickListener() {
            return onClickListener;
        }

        public void setOnClickListener(View.OnClickListener onClickListener) {
            this.onClickListener = onClickListener;
        }
    }

    public void show() {
        super.show();
        AnimatorUtils.startMove(llyMenu, , DensityUtils.dip2px(getActivity(), dpHeight));
        final AlphaAnimation alp = new AlphaAnimation(, );
        alp.setDuration();
        alp.setRepeatCount();
        tvBg.setAnimation(alp);
    }

    public void dismiss() {
        AnimatorUtils.startMove(llyMenu, DensityUtils.dip2px(getActivity(), dpHeight), );
        final AlphaAnimation alp = new AlphaAnimation(, );
        alp.setDuration();
        alp.setRepeatCount();
        alp.setAnimationListener(new Animation.AnimationListener() {

            public void onAnimationStart(Animation animation) {

            }

            public void onAnimationRepeat(Animation animation) {

            }

            public void onAnimationEnd(Animation animation) {
                MenuBottomPopupWindow.super.dismiss();//動畫放完了才隐藏
            }
        });
        tvBg.setAnimation(alp);
    }
}

        共有兩個布局：

        popup_window_menu_bottom布局

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <TextView
        android:id="@+id/tv_bg"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@color/black_50" />

    <LinearLayout
        android:background="@color/white"
        android:id="@+id/lly_menu"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:orientation="vertical">

        <LinearLayout
            android:id="@+id/lly_add_menu"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical">

        </LinearLayout>

        <View
            android:layout_width="match_parent"
            android:layout_height="12dp"
            android:background="@color/gray_f9f9" />

        <TextView
            android:id="@+id/tv_cancel"
            android:layout_width="match_parent"
            android:layout_height="44dp"
            android:background="@drawable/btn_n_w00_p_cccc"
            android:gravity="center"
            android:text="@string/cancel"
            android:textSize="16dp" />


    </LinearLayout>
</RelativeLayout>

        popup_window_menu_bottom_item.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical">
    <View
        android:layout_width="match_parent"
        android:layout_height="1px"
        android:background="@color/gray_cccc" />
    <TextView
        android:id="@+id/tv_item"
        android:layout_width="match_parent"
        android:layout_height="44dp"
        android:background="@drawable/btn_n_w00_p_cccc"
        android:gravity="center"
        android:text="@string/cancel"
        android:textSize="16dp" />

</LinearLayout>

        顔色：

<color name="gray_cccc">#cccccc</color>
    <color name="black_50">#88000000</color>
    <color name="gray_f9f9">#f9f9f9</color>
    <color name="white_00">#00ffffff</color>

        點選樣式：

        btn_n_w00_p_cccc.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">

    <item android:state_pressed="true">
        <shape>
            <solid android:color="@color/gray_cccc" />
        </shape>
    </item>
    <item android:state_selected="true">
        <shape>
            <solid android:color="@color/gray_cccc" />
        </shape>
    </item>

    <item android:state_focused="true">
        <shape>
            <solid android:color="@color/gray_cccc" />
        </shape>
    </item>
    <item>
        <shape>
            <solid android:color="@color/white_00" />
        </shape>
    </item>
</selector>

http://doutugongchang.com

技術 android 自定義菜單 popupWindow
上一篇: 【LeetCode 37】解數獨
下一篇: ChatGPT爆火，帶來哪些機會？

繼續閱讀