Android AlertDialog 弹出框

在上一章节 Android AlertDialog 弹出框 我们学习了如何创建四种类型的弹出框

这已经能满足大部分的需求了,但总有那么几次,要去定制一个弹出框,因为,UI 的天马行空是无法想象的

还有上一章节我们是直接弹出,而不是先点一个按钮再弹出,这次我们就完整点,点一个按钮再弹出

实现定制一个弹出框的核心就是调用 Builder.setView() 加载布局


  1. 创建一个 空的 Android 项目 cn.twle.android.AlertDialog

  2. 下载 /static/i/android/alertdialog.zip 并将所有的图片放到 res/drawable 目录下

  3. 修改 activity_main.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="match_parent"
        android:gravity="center_horizontal"
        android:padding="16dp" 
        android:orientation="vertical" >
    
        <Button 
            android:id="@+id/btn_pop"
            android:text="弹出框" 
            android:layout_width="wrap_content" 
            android:layout_height="wrap_content" />
    
    </LinearLayout>
    
  4. 给弹出框中的不同按钮添加不同状态的样式

    1. res/drawable 目录下新建 btn_selector_exit.xml

      <?xml version="1.0" encoding="utf-8"?>
      <selector xmlns:android="http://schemas.android.com/apk/res/android">
          <item android:state_pressed="true" android:drawable="@drawable/icon_exit_pressed"/>
          <item android:drawable="@drawable/icon_exit_normal"/>
      </selector>
      
    2. res/drawable 目录下新建 btn_selector_choose.xml

      <?xml version="1.0" encoding="utf-8"?>
      <selector xmlns:android="http://schemas.android.com/apk/res/android">
          <item android:state_pressed="true" android:drawable="@drawable/bg_btn_pressed"/>
          <item android:drawable="@drawable/bg_btn_normal"/>
      </selector>
      
  5. 接着是自定义的 Dialog 布局,在 res/layout 目录下新建 view_dialog_custom.xml

    <?xml version="1.0" encoding="utf-8"?>
    <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/RelativeLayout1"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">
    
        <RelativeLayout
            android:id="@+id/titlelayout"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_alignParentLeft="true"
            android:layout_alignParentTop="true"
            android:background="#eeeeee"
            android:padding="5dp">
    
            <TextView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_centerVertical="true"
                android:text="提示信息"
                android:textColor="#333333"
                android:textSize="18sp"
                android:textStyle="bold" />
    
            <Button
                android:id="@+id/btn_cancle"
                android:layout_width="30dp"
                android:layout_height="30dp"
                android:layout_alignParentRight="true"
                android:background="@drawable/btn_selector_exit" />
    
        </RelativeLayout>
    
        <LinearLayout
            android:id="@+id/ly_detail"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_alignParentLeft="true"
            android:layout_below="@+id/titlelayout"
            android:layout_centerInParent="true"
            android:orientation="vertical">
    
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginLeft="10dp"
                android:layout_marginTop="20dp"
                android:text="简单教程,简单编程"
                android:textColor="#333333"
                android:textSize="18sp" />
        </LinearLayout>
    
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_below="@+id/ly_detail"
            android:layout_marginTop="10dp"
            android:orientation="horizontal">
    
            <Button
                android:id="@+id/btn_blog"
                android:layout_width="match_parent"
                android:layout_height="40dp"
                android:layout_margin="5dp"
                android:layout_weight="1"
                android:background="@drawable/btn_selector_choose"
                android:text="访问网站"
                android:textColor="#ffffff"
                android:textSize="20sp" />
    
            <Button
                android:id="@+id/btn_close"
                android:layout_width="match_parent"
                android:layout_height="40dp"
                android:layout_margin="5dp"
                android:layout_weight="1"
                android:background="@drawable/btn_selector_choose"
                android:text="不了,谢谢"
                android:textColor="#ffffff"
                android:textSize="20sp" />
    
        </LinearLayout>
    
    </RelativeLayout>
    
  6. 修改 MainActivity.java

    package cn.twle.android.alertdialog;
    
    import android.support.v7.app.AppCompatActivity;
    import android.os.Bundle;
    
    import android.content.Intent;
    import android.net.Uri;
    import android.content.Context;
    import android.app.AlertDialog;
    
    import android.widget.Button;
    import android.view.View;
    import android.view.LayoutInflater;
    import android.widget.Toast;
    
    public class MainActivity extends AppCompatActivity {
    
        private View view_custom;
        private AlertDialog alert = null;
        private AlertDialog.Builder builder = null;
    
        @Override
        protected void onCreate(Bundle savedInstanceState) {
            super.onCreate(savedInstanceState);
            setContentView(R.layout.activity_main);
    
            final Context mContext = MainActivity.this;
            Button btn_show = (Button) findViewById(R.id.btn_pop);
    
            //初始化Builder
            builder = new AlertDialog.Builder(mContext);
    
            //加载自定义的那个View,同时设置下
    
            final LayoutInflater inflater = MainActivity.this.getLayoutInflater();
            view_custom = inflater.inflate(R.layout.view_dialog_custom, null,false);
            builder.setView(view_custom);
            builder.setCancelable(false);
    
            alert = builder.create();
    
            view_custom.findViewById(R.id.btn_cancle).setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View v) {
                    alert.dismiss();
                }
            });
    
            view_custom.findViewById(R.id.btn_blog).setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View v) {
                    Toast.makeText(getApplicationContext(), "访问网站", Toast.LENGTH_SHORT).show();
                    Uri uri = Uri.parse("https://www.twle.cn");
                    Intent intent = new Intent(Intent.ACTION_VIEW, uri);
                    startActivity(intent);
                    alert.dismiss();
                }
            });
    
            view_custom.findViewById(R.id.btn_close).setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View v) {
                    Toast.makeText(getApplicationContext(), "对话框已关闭~", Toast.LENGTH_SHORT).show();
                    alert.dismiss();
                }
            });
    
            btn_show.setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View v) {
                    alert.show();
                }
            });
        }
    }
    

参考文档

  1. Android AlertDialog

  2. Android 对话框

Android 基础教程

关于   |   FAQ   |   我们的愿景   |   广告投放   |  博客

  简单教程,简单编程 - IT 入门首选站

Copyright © 2013-2022 简单教程 twle.cn All Rights Reserved.