从底部弹出的PopupWindow

来源:互联网 发布:百度软件制作 编辑:程序博客网 时间:2024/04/23 18:43
嗯哼,最近有个新的需求,需要做一个从底部弹出的popupWindow,让Android向ios看齐。。。

本来Android的是右上角弹出一个pop就好了。。。

首先是简单的布局,一个LinearLayout下放三个textview

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:orientation="vertical"    android:layout_width="match_parent"    android:layout_height="match_parent">    <TextView        android:id="@+id/tv_bottom_up_first_item"        android:text="@string/first_item"        android:gravity="center"        android:background="@drawable/text_bg"        android:layout_marginLeft="20dp"        android:layout_marginRight="20dp"        android:layout_marginBottom="6dp"        android:layout_width="match_parent"        android:layout_height="40dp" />    <TextView        android:id="@+id/tv_bottom_up_second_item"        android:text="@string/second_item"        android:gravity="center"        android:background="@drawable/text_bg"        android:layout_marginLeft="20dp"        android:layout_marginRight="20dp"        android:layout_marginBottom="6dp"        android:layout_width="match_parent"        android:layout_height="40dp" />    <TextView        android:id="@+id/tv_bottom_up_third_item"        android:text="@string/third_item"        android:gravity="center"        android:background="@drawable/text_bg"        android:layout_marginLeft="20dp"        android:layout_marginRight="20dp"        android:layout_marginBottom="6dp"        android:layout_width="match_parent"        android:layout_height="40dp" /></LinearLayout>

Textview的background如下:

<shape xmlns:android="http://schemas.android.com/apk/res/android">    <solid android:color="#f4f2f2"/>    <corners android:radius="15dp"/>    <padding        android:left="5dp"        android:top="5dp"        android:right="5dp"        android:bottom="5dp"        />    <stroke        android:color="#ffffff"        android:width="2dp"        /></shape>

接着写popupwindow的出场和消失动画:
在res下新建一个anim文件夹,分别写出场和消失的动画
出场动画如下:

<set xmlns:android="http://schemas.android.com/apk/res/android"    android:shareInterpolator="false">    <translate        android:fromYDelta="100%p"        android:toYDelta="0"        android:duration="300"        />    <alpha        android:fromAlpha="0"        android:toAlpha="1.0"        android:duration="200"        /></set>

消失动画差不多:

<set xmlns:android="http://schemas.android.com/apk/res/android"    android:shareInterpolator="false"    >    <translate        android:fromYDelta="0"        android:toYDelta="100%p"        android:duration="300"        />    <alpha        android:fromAlpha="1.0"        android:toAlpha="0"        android:duration="200"        /></set>

在values的style文件下写:两个anim后面的名字是刚才定义的出场和消失动画的文件名

<style name="Animation">        <item name="android:windowEnterAnimation">@anim/enter_up</item>        <item name="android:windowExitAnimation">@anim/out_down</item>    </style>

最后贴上popupWindow的代码:

public class BottomUpPopView extends PopupWindow {    private TextView mFirstItem;    private TextView mSecondItem;    private TextView mThirdItem;    private Activity mActivity;    private View mView;    private List<String> mItemNames;    private final LayoutInflater minflater;    View.OnClickListener mItemClickListener;    /**     *     * @param activity     * @param mItemNames item的名字     * @param itemClickListener view.onClickListener     */    public BottomUpPopView(Activity activity,List<String> mItemNames,View.OnClickListener itemClickListener) {        this.mItemNames = mItemNames;        this.mActivity = activity;        mItemClickListener = itemClickListener;        minflater = activity.getLayoutInflater();        init();    }    private void init(){        mView = minflater.inflate(R.layout.pop_bottom_up,null);        mFirstItem = mView.findViewById(R.id.tv_bottom_up_first_item);        mSecondItem = mView.findViewById(R.id.tv_bottom_up_second_item);        mThirdItem = mView.findViewById(R.id.tv_bottom_up_third_item);        mFirstItem.setText(mItemNames.get(0));        mSecondItem.setText(mItemNames.get(1));        mThirdItem.setText(mItemNames.get(2));        mFirstItem.setOnClickListener(mItemClickListener);        mSecondItem.setOnClickListener(mItemClickListener);        mThirdItem.setOnClickListener(mItemClickListener);        //设置pop的参数        this.setContentView(mView);        this.setWidth(ViewGroup.LayoutParams.MATCH_PARENT);        this.setHeight(ViewGroup.LayoutParams.WRAP_CONTENT);        this.setFocusable(true);        this.setOutsideTouchable(true);        this.update();        this.setAnimationStyle(R.style.Animation);        //当pop消失的时候就不用再做处理了        this.setOnDismissListener(new OnDismissListener() {            @Override            public void onDismiss() {                backgroundAlpha(1.0f);            }        });    }    public void backgroundAlpha(float bgAlpha)    {        WindowManager windowManager = mActivity.getWindowManager();        WindowManager.LayoutParams lp = mActivity.getWindow().getAttributes();        lp.alpha = bgAlpha; //0.0-1.0        mActivity.getWindow().setAttributes(lp);    }}

其中backgroundAlpha方法的作用是让popupwindow出现和消失的时候,整个屏幕变暗和恢复
设置为1.0的时候代表屏幕正常显示。
最后看一下使用:(这里用的是kotlin,尝试一下Kotlin和Java的结合)

class MainActivity : AppCompatActivity() {    private var mButton: Button? = null    private var mPopView: BottomUpPopView? = null    private val mItemClickListener = View.OnClickListener { v ->        when (v.id) {            R.id.tv_bottom_up_first_item -> {                Toast.makeText(this@MainActivity, "点击了第一个item", Toast.LENGTH_SHORT).show()            }            R.id.tv_bottom_up_second_item -> {                Toast.makeText(this@MainActivity,"点击了第二个item",Toast.LENGTH_SHORT).show()            }            R.id.tv_bottom_up_third_item ->{                Toast.makeText(this@MainActivity,"点击了第三个item",Toast.LENGTH_SHORT).show()            }        }    }    override fun onCreate(savedInstanceState: Bundle?) {        super.onCreate(savedInstanceState)        setContentView(R.layout.activity_main)        mButton = findViewById<Button>(R.id.btn_pop) //查找控件的方式一        val mNames = ArrayList<String>()        mNames.add("赞同")        mNames.add("反对")        mNames.add("弃权")        mPopView = BottomUpPopView(this,mNames,mItemClickListener)        //查找控件的方式二:直接对应xml中的用户名        btn_pop.setOnClickListener { _ ->            mPopView?.showAtLocation(findViewById(R.id.cl_main), Gravity.BOTTOM or Gravity.CENTER_HORIZONTAL,0,0)            mPopView?.backgroundAlpha(0.5f)        }    }}