安卓开发笔记 通过AlertDialog实现从底部弹出的菜单的代码编写

如图是我想要实现的从屏幕底部弹出的菜单 的效果。

下面开始进行代码的实现：主要是通过自定义AlertDialog实现：

一）菜单的布局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="match_parent"    android:background="@android:color/transparent"    android:orientation="vertical"    android:gravity="center">    <LinearLayout        android:layout_width="wrap_content"        android:layout_height="match_parent"        android:orientation="vertical"        android:gravity="center">        <Button            android:id="@+id/btn1_bottom_menu"            android:layout_width="match_parent"            android:layout_height="wrap_content"            android:paddingLeft="120dp"            android:paddingRight="120dp"            android:text="Button1"            android:textSize="18sp"            android:background="@drawable/shape_bottom_menu_button1"/>        <!--这是可爱的浅蓝色分割线-->        <ImageView            android:layout_width="match_parent"            android:layout_height="0.5dp"            android:background="#A6D3F0"/>        <Button            android:id="@+id/btn2_bottom_menu"            android:layout_width="match_parent"            android:layout_height="wrap_content"            android:paddingLeft="120dp"            android:paddingRight="120dp"            android:text="Button2"            android:textSize="18sp"            android:background="@drawable/shape_bottom_menu_button2"/>        <!--这是可爱的分割线（第二个按钮 与第三个按钮之间的空隙）-->        <ImageView            android:layout_width="match_parent"            android:layout_height="10dp"            android:background="@android:color/transparent"/>        <Button            android:id="@+id/btn_bottom_menu_cancel"            android:layout_width="match_parent"            android:layout_height="wrap_content"            android:paddingLeft="120dp"            android:paddingRight="120dp"            android:textSize="18sp"            android:text="取消"            android:background="@drawable/shape_bottom_menu_button3"/>        </LinearLayout></LinearLayout>

二）三个按钮的背景是带有圆角的矩形，这个圆角的背景通过shape实现

shape_bottom_menu_button1.xml

//上方两个圆角<?xml version="1.0" encoding="utf-8"?><shape xmlns:android="http://schemas.android.com/apk/res/android">    <corners        android:topRightRadius="15dp"        android:topLeftRadius="15dp" />    <solid        android:color="#FFFFFF"/></shape>//底部两角 圆角<?xml version="1.0" encoding="utf-8"?><shape xmlns:android="http://schemas.android.com/apk/res/android">    <corners        android:bottomRightRadius="15dp"        android:bottomLeftRadius="15dp" />    <solid        android:color="#FFFFFF"/> </shape><?xml version="1.0" encoding="utf-8"?><shape xmlns:android="http://schemas.android.com/apk/res/android">    <corners        android:bottomRightRadius="15dp"        android:bottomLeftRadius="15dp" />    <solid        android:color="#FFFFFF"/></shape>//四个角都是圆角<?xml version="1.0" encoding="utf-8"?><shape xmlns:android="http://schemas.android.com/apk/res/android">    <corners        android:radius="15dp" />    <solid        android:color="#FFFFFF"/></shape>

等会即将用到的动画效果：在res/anim目录下：

window_up_in.xml

<?xml version="1.0" encoding="utf-8"?><translate xmlns:android="http://schemas.android.com/apk/res/android"    android:fromYDelta="50%p"    android:toYDelta="0%p"    android:duration="300"    />

window_down_off.xml

<?xml version="1.0" encoding="utf-8"?><translate xmlns:android="http://schemas.android.com/apk/res/android"    android:fromYDelta="0%p"    android:toYDelta="50%p"    android:duration="300"    />

res/values目录下的style.xml

<span style="color:#000000;"><resources><!--屏幕下方弹出的菜单--><style name="animation_bottom_menu">    <item name="android:windowEnterAnimation">@anim/window_up_in</item>    <item name="android:windowExitAnimation">@anim/window_down_off</item></style></resources></span>

三）创建一个类BottomMenu，在这个类中封装了 初始化以及显示自定义AlertDialog的方法

package com.xuhai.myapplication;import android.app.AlertDialog;import android.content.Context;import android.view.Gravity;import android.view.LayoutInflater;import android.view.View;import android.view.Window;import android.widget.Button;import android.widget.LinearLayout;/** * 自定义的 底部滑出菜单，共有三个按钮，除了取消按钮以外 可以自定义上面两个按钮的Text和OnClickListener ** Created by Administrator on 2015/9/15. */public class BottomMenu {    AlertDialog.Builder builder;    View view;    Button button1;    Button button2;    Button buttonCancel;    Context context;    /**     * 初始化 菜单布局以及按钮     * @param context     */    public BottomMenu(Context context) {        this.context=context;        builder=new AlertDialog.Builder(context);        view= LayoutInflater.from(context).inflate(R.layout.layout_bottom_menu,null);        button1=(Button)view.findViewById(R.id.btn1_bottom_menu);        button2=(Button)view.findViewById(R.id.btn2_bottom_menu);        buttonCancel=(Button)view.findViewById(R.id.btn_bottom_menu_cancel);    }    /**     * 设置第一个按钮的 文字内容和监听器     * @param title     * @param listener     */    public void setButton1(String title,View.OnClickListener listener){        button1.setText(title);        button1.setOnClickListener(listener);    }    /**     * 设置第二个按钮的 文字内容和监听器     * @param title     * @param listener     */    public void setButton2(String title,View.OnClickListener listener){        button2.setText(title);        button2.setOnClickListener(listener);    }    /**     * 初始化完毕后，调用该方法 显示菜单     */    public void show(){        final AlertDialog dialog=new AlertDialog.Builder(context).create();//生成一个AlertDialog对象        dialog.show();//调用AlertDialog的show()方法显示        buttonCancel.setOnClickListener(new View.OnClickListener() {//取消按钮点击后 回撤销dialog            @Override            public void onClick(View view) {                dialog.dismiss();            }        });        Window window=dialog.getWindow();//获取当前的Window对象，然后下面进行窗口属性的设置        window.setContentView(view);//加载布局，view是填充自定义菜单布局xml 得到的        window.setBackgroundDrawableResource(android.R.color.transparent);//这个很重要，将背景设为透明        // 这样子 第二和第三个按钮的空隙才会显示出来        window.setGravity(Gravity.BOTTOM);//这个也很重要，将弹出菜单的位置设置为底部        window.setWindowAnimations(R.style.animation_bottom_menu);//菜单进入和退出屏幕的动画，实现了上下滑动的动画效果        window.setLayout(LinearLayout.LayoutParams.WRAP_CONTENT, LinearLayout.LayoutParams.WRAP_CONTENT);//设置菜单的尺寸    }}

四）在MainActivity中设置点击监听器，点击hello world的TextView控件时 弹出菜单

package com.xuhai.myapplication;import android.support.v7.app.AppCompatActivity;import android.os.Bundle;import android.view.View;import android.widget.TextView;public class MainActivity extends AppCompatActivity {    private TextView tv;    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_main);        tv=(TextView)findViewById(R.id.tv);        tv.setOnClickListener(new View.OnClickListener() {            @Override            public void onClick(View v) {                BottomMenu menu=new BottomMenu(MainActivity.this);                menu.setButton1("照相",null);//这里根据自己需求可以设置 菜单上的按钮文字以及点击监听器                menu.setButton2("相册",null);                menu.show();            }        });    }}

五）最后运行程序，一个还勉强看得过去的 底部弹出菜单诞生啦~

点击Hello World! 弹出菜单~