android底部弹窗的几种实现方式


实现底部弹窗有以下几种方式: 
1.dialog 
2.Activity 
3.DialogFragment 
4.bottomSheet

底部弹窗本质上就是将对话框显示在底部。

在开始之前先给出布局文件:

   

<LinearLayout
        android:layout_width="wrap_content"
        android:orientation="vertical"
        android:layout_gravity="center_vertical"
        android:layout_height="wrap_content">
        <Button
            android:layout_gravity="center_horizontal"
            android:onClick="onDialog"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="dialog"/>
        <Button
            android:layout_gravity="center_horizontal"
            android:onClick="onActivity"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="activity"/>
        <Button
            android:layout_gravity="center_horizontal"
            android:onClick="onDialogFragment"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="DialogFragment"/>
        <Button
            android:layout_gravity="center_horizontal"
            android:onClick="onButtonSheet"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="ButtonSheet"/>
    </LinearLayout>

    <android.support.v4.widget.NestedScrollView
        android:id="@+id/scroll"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:layout_behavior="android.support.design.widget.BottomSheetBehavior">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical">

            <TextView
                android:layout_width="match_parent"
                android:layout_height="170dp"
                android:gravity="center"
                android:background="@color/colorPrimary"
                android:text="底部弹窗"
                android:textColor="@android:color/white"/>

        </LinearLayout>
    </android.support.v4.widget.NestedScrollView>

</android.support.design.widget.CoordinatorLayout>



布局文件中显示4个button和一个NestedScrollView。NestedScrollView中为bottomSheet的内容。

一 通过Dialog实现
dialog.xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
              android:id="@+id/layout"
              android:orientation="vertical"
              android:layout_width="match_parent"
              android:layout_height="match_parent">
    <TextView
        android:layout_width="match_parent"
        android:layout_height="170dp"
        android:gravity="center"
        android:background="@color/colorPrimary"
        android:text="底部弹窗"
        android:textColor="@android:color/white"/>
</LinearLayout>

public void onDialog(View view)
    {
        Dialog dialog=new Dialog(this);//可以在style中设定dialog的样式
        dialog.setContentView(R.layout.dialog);
        WindowManager.LayoutParams lp=dialog.getWindow().getAttributes();
        lp.gravity= Gravity.BOTTOM;
        lp.height= WindowManager.LayoutParams.WRAP_CONTENT;
        lp.width= WindowManager.LayoutParams.MATCH_PARENT;
        dialog.getWindow().setAttributes(lp);
        //设置该属性,dialog可以铺满屏幕
        dialog.getWindow().setBackgroundDrawable(null);
        dialog.show();
//      dialog.getWindow().setWindowAnimations();
        slideToUp(dialog.getWindow().findViewById(R.id.layout));

    }

    public static void slideToUp(View view){
        Animation slide = new TranslateAnimation(Animation.RELATIVE_TO_SELF, 0.0f,
                Animation.RELATIVE_TO_SELF, 0.0f, Animation.RELATIVE_TO_SELF,
                1.0f, Animation.RELATIVE_TO_SELF, 0.0f);

        slide.setDuration(2000);
        slide.setFillAfter(true);
        slide.setFillEnabled(true);
        view.startAnimation(slide);

        slide.setAnimationListener(new Animation.AnimationListener() {
            @Override
            public void onAnimationStart(Animation animation) {

            }

            @Override
            public void onAnimationEnd(Animation animation) {

            }

            @Override
            public void onAnimationRepeat(Animation animation) {

            }
        });

    }


二 通过activity实现
需要将activity的样式设置为Dialog的样式。
 

<style name="bottom_style" parent="android:Theme.Dialog">
        <item name="android:windowAnimationStyle">@style/AnimBottom</item>
        <item name="android:windowFrame">@null</item>
        <!-- 边框 -->
        <item name="android:windowNoTitle">true</item>
        <!-- 无标题 -->
        <item name="android:windowBackground">@android:color/transparent</item>
        <!-- 背景透明 -->
    </style>

<activity android:name=".DialogActivity" android:theme="@style/bottom_style"/>
public class DialogActivity extends Activity {
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.dialog);
        getWindow().setLayout(WindowManager.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.WRAP_CONTENT);
        getWindow().getAttributes().gravity= Gravity.BOTTOM;
    }
}


相比于dialog的实现方式,通过activity可以管理弹窗的生命周期。

三 通过DialogFragment实现
DialogFragment在android 3.0时被引入。是一种特殊的Fragment,典型的用于:展示警告框,输入框,确认框等等。 
在DialogFragment产生之前,创建对话框一般采用AlertDialog和Dialog。注:官方不推荐直接使用Dialog创建对话框。 
使用DialogFragment来管理对话框,当旋转屏幕和按下后退键时可以更好的管理其声明周期,它和Fragment有着基本一致的声明周期。因此3.0之后最好使用DialogFragment,而不是使用以上两种方式。 
使用DialogFragment至少需要实现onCreateView或者onCreateDIalog方法。onCreateView即使用定义的xml布局文件展示Dialog。onCreateDialog即利用AlertDialog或者Dialog创建出Dialog。
四 bottomSheet
Bottom Sheet是在support library 23.2之后提供的一个新控件,也就是需要用6.0以上的SDK进行编译才可以使用此控件。 
添加依赖:

compile 'com.android.support:design:23.2.0'


在dialog.xml中通过NestedScrollView的layout_behavior已经实现了上滑拉出窗口。 


当然也可以通过点击弹出。

public void onButtonSheet(View view)
    {
        BottomSheetBehavior behavior=BottomSheetBehavior.from(findViewById(R.id.scroll));
        if (behavior.getState()==BottomSheetBehavior.STATE_EXPANDED)
        {
            behavior.setState(BottomSheetBehavior.STATE_COLLAPSED);
        }else if (behavior.getState()==BottomSheetBehavior.STATE_COLLAPSED)
        {
            behavior.setState(BottomSheetBehavior.STATE_EXPANDED);

    }
    }


可以直接通过代码的方式实现:

public void onButtonSheet(View view)
    {
//      BottomSheetBehavior behavior=BottomSheetBehavior.from(findViewById(R.id.scroll));
//      if (behavior.getState()==BottomSheetBehavior.STATE_EXPANDED)
//      {
//          behavior.setState(BottomSheetBehavior.STATE_COLLAPSED);
//      }else if (behavior.getState()==BottomSheetBehavior.STATE_COLLAPSED)
//      {
//          behavior.setState(BottomSheetBehavior.STATE_EXPANDED);
//      }

        BottomSheetDialog dialog=new BottomSheetDialog(this);
        dialog.setContentView(R.layout.dialog);
        dialog.show();
    }

猜你喜欢

转载自blog.csdn.net/weixin_37734988/article/details/89303898