创建自定义布局AlertDialog

版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/weixin_35959554/article/details/85273647

就手机来说，因为屏幕不够大，所以在显示不是必须的信息时或者不是常用的操作时，我们可以在对话框中显示，但不是传统的那种简单的对话框，需要自己自定义一下，这样不仅能节约空间，并且功能也一样不缺。自定义AlertDialog跟普通的其实差不多，就是多了一些附加操作，使得对话框的交互跟activity界面交互一样，所以今天做了一个简单的例子。效果如下图。

因为注释很详细所有我少说话多贴代码了（懒。。）。

创建对话框，但是用的是自己写的样式

       //用自己写的样式替换context的样式
        Context context = new ContextThemeWrapper(this, R.style.customDialog);
        dialog = new AlertDialog.Builder(context).create();
        //设置可点击对话框外 对话框关闭
        dialog.setCanceledOnTouchOutside(true);
        dialog.setTitle("");
        dialog.show();

样式也挺简单的就是常规设置，备注很详细

 <style name="customDialog" parent="@android:style/Theme.Dialog">
        <!--是否有边框-->
        <item name="android:windowFrame">@null</item>
        <!--是否有标题-->
        <item name="android:windowNoTitle">true</item>
        <!--背景颜色-->
        <item name="android:windowBackground">@color/translucent_background</item>
        <!--是否浮动-->
        <item name="android:windowIsFloating">true</item>
        <!--是否允许背景变暗-->
        <item name="android:backgroundDimEnabled">true</item>
        <!--是否透明的-->
        <item name="android:windowIsTranslucent">true</item>
        <!--动画-->
        <item name="android:windowAnimationStyle">@android:style/Animation.Translucent</item>
    </style>

既然是自定义，当然得自己设置对话框的大小以及位置了

        Window window = dialog.getWindow();
        //得到屏幕信息
        DisplayMetrics dm = getResources().getDisplayMetrics();
        WindowManager.LayoutParams p = window.getAttributes();
        //背景变暗
        p.dimAmount = 0.1f;
        p.height = (int) (dm.heightPixels * 0.8);
        p.width = (int) (dm.widthPixels * 0.8);
        // 设置对话框大小
        window.setAttributes(p);
       //设置显示位置
        window.setGravity(Gravity.LEFT | Gravity.TOP);

最重要的就是添加自己的布局了，可以自己随意的添加修改，我只是随便显示了一个图片和两个按钮两个列表

 //添加自定义的布局
        window.setContentView(R.layout.view_list_dialog);
        lv_1 = window.findViewById(R.id.lv_1);
        lv_1.setAdapter(new ArrayAdapter<String>(this, android.R.layout.simple_list_item_1, list));
        lv_2 = window.findViewById(R.id.lv_2);
        lv_2.setAdapter(new ArrayAdapter<String>(this, android.R.layout.simple_list_item_1, list));
        btn_1 = window.findViewById(R.id.btn_1);
        btn_2 = window.findViewById(R.id.btn_2);
        btn_1.setOnClickListener(this);
        btn_2.setOnClickListener(this);
        dialog.dismiss();

然后在按钮点击时显示dialog就行了。

完整activity代码如下：

public class DialogActivity extends AppCompatActivity implements View.OnClickListener {
    private  Button btn_show_dialog, btn_1, btn_2;
    private ListView lv_1, lv_2;
    private AlertDialog dialog;
    private List<String> list = new ArrayList<>();

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_dialog);
        InitDialog();
        btn_show_dialog = findViewById(R.id.btn_show_dialog);
        btn_show_dialog.setOnClickListener(this);
        for (int i = 0; i < 20; i++) {
            list.add("数据" + i);
        }
    }

    public void InitDialog() {
        //用自己写的样式替换context的样式
        Context context = new ContextThemeWrapper(this, R.style.customDialog);
        dialog = new AlertDialog.Builder(context).create();
        //设置可点击对话框外 对话框关闭
        dialog.setCanceledOnTouchOutside(true);
        dialog.setTitle("");
        dialog.show();
        Window window = dialog.getWindow();
        //得到屏幕信息
        DisplayMetrics dm = getResources().getDisplayMetrics();
        WindowManager.LayoutParams p = window.getAttributes();
        //背景变暗
        p.dimAmount = 0.1f;
        p.height = (int) (dm.heightPixels * 0.8);
        p.width = (int) (dm.widthPixels * 0.8);
        // 设置对话框大小
        window.setAttributes(p);
        //设置显示位置
        window.setGravity(Gravity.LEFT | Gravity.TOP);
        //添加自定义的布局
        window.setContentView(R.layout.view_list_dialog);
        lv_1 = window.findViewById(R.id.lv_1);
        lv_1.setAdapter(new ArrayAdapter<String>(this, android.R.layout.simple_list_item_1, list));
        lv_2 = window.findViewById(R.id.lv_2);
        lv_2.setAdapter(new ArrayAdapter<String>(this, android.R.layout.simple_list_item_1, list));
        btn_1 = window.findViewById(R.id.btn_1);
        btn_2 = window.findViewById(R.id.btn_2);
        btn_1.setOnClickListener(this);
        btn_2.setOnClickListener(this);
        dialog.dismiss();
    }

    @Override
    public void onClick(View v) {
        switch (v.getId()) {
            case R.id.btn_1:
                Toast.makeText(DialogActivity.this, "你点击了按钮1", Toast.LENGTH_SHORT).show();
                break;
            case R.id.btn_2:
                Toast.makeText(DialogActivity.this, "你点击了按钮2", Toast.LENGTH_SHORT).show();
                break;
            case R.id.btn_show_dialog:
                dialog.show();
                break;
        }

    }

    @Override
    protected void onDestroy() {
        super.onDestroy();
        //别忘了关闭对话框
        if (dialog!=null&&dialog.isShowing())
            dialog.dismiss();
    }
}

自定义对话框布局：

<?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="match_parent"
              android:layout_margin="4dp"
              android:background="@color/white"
              android:orientation="vertical"
    >

    <ImageView
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:src="@mipmap/ic_launcher"
        />

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="6"
        android:orientation="horizontal"
        >
        <LinearLayout
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:orientation="vertical">

            <TextView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:text="    列表1"/>

            <TextView
                android:layout_width="match_parent"
                android:layout_height="1dp"
                android:layout_marginLeft="2dp"
                android:layout_marginRight="2dp"
                android:background="@color/exam_text_color"
                />

            <ListView
                android:id="@+id/lv_1"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:scrollbars="none"
                android:textColor="@color/exam_text_color">

            </ListView>

        </LinearLayout>

        <TextView
            android:layout_width="2dp"
            android:layout_height="match_parent"
            android:layout_marginLeft="2dp"

            android:layout_marginRight="2dp"
            android:background="@color/exam_text_color"
            />

        <LinearLayout
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:orientation="vertical">

            <TextView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:text="    列表2"/>

            <TextView
                android:layout_width="match_parent"
                android:layout_height="1dp"
                android:layout_marginLeft="2dp"
                android:layout_marginRight="2dp"
                android:background="@color/exam_text_color"
                />

            <ListView
                android:id="@+id/lv_2"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:scrollbars="none">

            </ListView>
        </LinearLayout>
    </LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="2"
        android:gravity="center"
        android:orientation="horizontal"
        >

        <Button
            android:id="@+id/btn_1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="按钮1"
            />

        <Button
            android:id="@+id/btn_2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="按钮2"
            />


    </LinearLayout>

</LinearLayout>

activity布局就很简单了一个按钮：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:gravity="center|bottom"
    tools:context=".DialogActivity">
    <Button
        android:id="@+id/btn_show_dialog"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="显示对话框"
        />

</LinearLayout>

 到这里就介绍完了，并且可以使用了，是不是很简单，自定义对话框还有很多很多扩展的，发挥你们的想象力吧。