项目中常用的弹框种类很多,自定义Dialog弹框式样就是其中之一,原生的Dialog弹框、第三方的Dialog等数不胜数,下面就简单的介绍一下自定义Dialog的实现。
AlertDialog—-普通的提示对话框
ProgressDialog–进度条对话
DatePickerDialog/TimePickerDialog–日期对话框/时间对话框
一.简单的原生Dialog:
1.一个简单的提示框类型的Dialog弹窗:
/**
* 普通dialog
*/
private void showAlterDialog(){
final AlertDialog.Builder alterDiaglog = new AlertDialog.Builder(BroadcastRActivity.this);
alterDiaglog.setIcon(R.drawable.icon_yes);//图标
alterDiaglog.setTitle("简单的dialog");//文字
alterDiaglog.setMessage("提示消息来了");//提示消息
//积极的选择
alterDiaglog.setPositiveButton("取消", new DialogInterface.OnClickListener() {
@Override
public void onClick(DialogInterface dialog, int which) {
Toast.makeText(BroadcastRActivity.this,"点击了取消",Toast.LENGTH_SHORT).show();
}
});
//消极的选择
alterDiaglog.setNegativeButton("确认", new DialogInterface.OnClickListener() {
@Override
public void onClick(DialogInterface dialog, int which) {
Toast.makeText(BroadcastRActivity.this,"点击了确认",Toast.LENGTH_SHORT).show();
}
});
//中立的选择
alterDiaglog.setNeutralButton("观望中", new DialogInterface.OnClickListener() {
@Override
public void onClick(DialogInterface dialog, int which) {
Toast.makeText(BroadcastRActivity.this,"点击了观望中",Toast.LENGTH_SHORT).show();
}
});
//显示
alterDiaglog.show();
}
2.一个简单的选择类型的弹框:
/**
* 列表Dialog
*/
private void showListDialog(){
final String[] items = {"保存","下载","分享"};
AlertDialog.Builder listDialog = new AlertDialog.Builder(MainActivity.this);
listDialog.setIcon(R.drawable.icon);//图标
listDialog.setTitle("选择操作:");
listDialog.setItems(items, new DialogInterface.OnClickListener() {
@Override
public void onClick(DialogInterface dialog, int which) {
Toast.makeText(MainActivity.this,"点击了"+items[which],Toast.LENGTH_SHORT).show();
}
});
listDialog.show();
}
3.一个简单的单选Dialog弹框:
/**
* 单选Dialog
*/
int choice;
private void showSingDialog(){
final String[] items = {"曹操","赵云","关羽"};
AlertDialog.Builder singleChoiceDialog = new AlertDialog.Builder(MainActivity.this);
singleChoiceDialog.setIcon(R.drawable.icon);
singleChoiceDialog.setTitle("我是单选Dialo");
//第二个参数是默认的选项
singleChoiceDialog.setSingleChoiceItems(items, 0, new DialogInterface.OnClickListener() {
@Override
public void onClick(DialogInterface dialog, int which) {
choice= which;
}
});
singleChoiceDialog.setPositiveButton("确定", new DialogInterface.OnClickListener() {
@Override
public void onClick(DialogInterface dialog, int which) {
if (choice!=-1){
Toast.makeText(MainActivity.this,
"你选择了" + items[choice],
Toast.LENGTH_SHORT).show();
}
}
});
singleChoiceDialog.show();
}
4.一个简单的多选Dialog弹窗:
/**
* 多选对话框
*/
ArrayList<Integer> choices= new ArrayList<>();
private void showMultiChoiceDialog(){
final String[] items = {"妲己","貂蝉","大乔"};
//设置默认选择都是false
final boolean initchoices[] = {false,false,false};
choices.clear();
AlertDialog.Builder multChoiceDialog = new AlertDialog.Builder(MainActivity.this);
multChoiceDialog.setIcon(R.drawable.icon);
multChoiceDialog.setTitle("我是个多选Dialog");
multChoiceDialog.setMultiChoiceItems(items, initchoices, new DialogInterface.OnMultiChoiceClickListener() {
@Override
public void onClick(DialogInterface dialog, int which, boolean isChecked) {
if (isChecked){
choices.add(which);
}else {
choices.remove(which);
}
}
});
multChoiceDialog.setPositiveButton("确定", new DialogInterface.OnClickListener() {
@Override
public void onClick(DialogInterface dialog, int which) {
int size = choices.size();
String str = "";
for(int i = 0;i<size;i++){
str+=items[choices.get(i)]+"";
}
Toast.makeText(MainActivity.this,
"你选中了" + str,
Toast.LENGTH_SHORT).show();
}
});
multChoiceDialog.show();
}
5.一个简单的等待Dialog弹框:
private void showProgressDialog(){
final int MAX = 100;
final ProgressDialog progressDialog = new ProgressDialog(this);
progressDialog.setTitle("我是个等待的Dialog");
progressDialog.setMessage("等待中");
progressDialog.setIndeterminate(true);
progressDialog.setCancelable(false);
progressDialog.show();
}
6.一个简单的进度条Dialog弹窗:
/**
* 进度条Dialog
*/
private void showWhiteDialog(){
/* @setProgress 设置初始进度
* @setProgressStyle 设置样式(水平进度条)
* @setMax 设置进度最大值
*/
final int Max = 100;
final ProgressDialog progressDialog = new ProgressDialog(MainActivity.this);
progressDialog.setProgress(0);
progressDialog.setIcon(R.drawable.icon);
progressDialog.setTitle("我是一个进度条Dialog");
progressDialog.setProgressStyle(ProgressDialog.STYLE_HORIZONTAL);
progressDialog.setMax(Max);
progressDialog.show();
/**
* 开个线程
*/
new Thread(new Runnable() {
@Override
public void run() {
int p = 0;
while (p<Max){
try {
Thread.sleep(100);
p++;
progressDialog.setProgress(p);
}catch (InterruptedException e){
e.printStackTrace();
}
}
progressDialog.cancel();//达到最大就消失
}
}).start();
}
二.自定义Dialog弹框:
1.一个简单的自定义Dialog弹框类型:
自定义Dialog:
import android.app.Dialog;
import android.content.Context;
import android.os.Bundle;
import android.text.TextUtils;
import android.view.View;
import android.widget.Button;
import android.widget.ImageView;
import android.widget.TextView;
import com.example.qd.douyinwu.R;
/**
* description:自定义dialog
*/
public class CommonDialog extends Dialog {
/**
* 显示的图片
*/
private ImageView imageIv ;
/**
* 显示的标题
*/
private TextView titleTv ;
/**
* 显示的消息
*/
private TextView messageTv ;
/**
* 确认和取消按钮
*/
private Button negtiveBn ,positiveBn;
/**
* 按钮之间的分割线
*/
private View columnLineView ;
public CommonDialog(Context context) {
super(context, R.style.CustomDialog);
}
/**
* 都是内容数据
*/
private String message;
private String title;
private String positive,negtive ;
private int imageResId = -1 ;
/**
* 底部是否只有一个按钮
*/
private boolean isSingle = false;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.common_dialog_layout);
//按空白处不能取消动画
setCanceledOnTouchOutside(false);
//初始化界面控件
initView();
//初始化界面数据
refreshView();
//初始化界面控件的事件
initEvent();
}
/**
* 初始化界面的确定和取消监听器
*/
private void initEvent() {
//设置确定按钮被点击后,向外界提供监听
positiveBn.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
if ( onClickBottomListener!= null) {
onClickBottomListener.onPositiveClick();
}
}
});
//设置取消按钮被点击后,向外界提供监听
negtiveBn.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
if ( onClickBottomListener!= null) {
onClickBottomListener.onNegtiveClick();
}
}
});
}
/**
* 初始化界面控件的显示数据
*/
private void refreshView() {
//如果用户自定了title和message
if (!TextUtils.isEmpty(title)) {
titleTv.setText(title);
titleTv.setVisibility(View.VISIBLE);
}else {
titleTv.setVisibility(View.GONE);
}
if (!TextUtils.isEmpty(message)) {
messageTv.setText(message);
}
//如果设置按钮的文字
if (!TextUtils.isEmpty(positive)) {
positiveBn.setText(positive);
}else {
positiveBn.setText("确定");
}
if (!TextUtils.isEmpty(negtive)) {
negtiveBn.setText(negtive);
}else {
negtiveBn.setText("取消");
}
if (imageResId!=-1){
imageIv.setImageResource(imageResId);
imageIv.setVisibility(View.VISIBLE);
}else {
imageIv.setVisibility(View.GONE);
}
/**
* 只显示一个按钮的时候隐藏取消按钮,回掉只执行确定的事件
*/
if (isSingle){
columnLineView.setVisibility(View.GONE);
negtiveBn.setVisibility(View.GONE);
}else {
negtiveBn.setVisibility(View.VISIBLE);
columnLineView.setVisibility(View.VISIBLE);
}
}
@Override
public void show() {
super.show();
refreshView();
}
/**
* 初始化界面控件
*/
private void initView() {
negtiveBn = (Button) findViewById(R.id.negtive);
positiveBn = (Button) findViewById(R.id.positive);
titleTv = (TextView) findViewById(R.id.title);
messageTv = (TextView) findViewById(R.id.message);
imageIv = (ImageView) findViewById(R.id.image);
columnLineView = findViewById(R.id.column_line);
}
/**
* 设置确定取消按钮的回调
*/
public OnClickBottomListener onClickBottomListener;
public CommonDialog setOnClickBottomListener(OnClickBottomListener onClickBottomListener) {
this.onClickBottomListener = onClickBottomListener;
return this;
}
public interface OnClickBottomListener{
/**
* 点击确定按钮事件
*/
public void onPositiveClick();
/**
* 点击取消按钮事件
*/
public void onNegtiveClick();
}
public String getMessage() {
return message;
}
public CommonDialog setMessage(String message) {
this.message = message;
return this ;
}
public String getTitle() {
return title;
}
public CommonDialog setTitle(String title) {
this.title = title;
return this ;
}
public String getPositive() {
return positive;
}
public CommonDialog setPositive(String positive) {
this.positive = positive;
return this ;
}
public String getNegtive() {
return negtive;
}
public CommonDialog setNegtive(String negtive) {
this.negtive = negtive;
return this ;
}
public int getImageResId() {
return imageResId;
}
public boolean isSingle() {
return isSingle;
}
public CommonDialog setSingle(boolean single) {
isSingle = single;
return this ;
}
public CommonDialog setImageResId(int imageResId) {
this.imageResId = imageResId;
return this ;
}
}
自定义布局:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:tools="http://schemas.android.com/tools">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:minWidth="260dp"
android:layout_centerInParent="true"
android:paddingTop="16dp"
android:background="@drawable/divider"
android:orientation="vertical">
<TextView
android:id="@+id/title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
android:layout_marginBottom="16dp"
android:gravity="center"
tools:text="消息提示"
android:visibility="visible"
android:textColor="#333333"
android:textSize="18sp" />
<ImageView
android:id="@+id/image"
tools:src="p1"
android:layout_gravity="center"
android:maxHeight="150dp"
android:maxWidth="150dp"
android:layout_marginBottom="10dp"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
android:visibility="visible"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<TextView
android:id="@+id/message"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center|left"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"
android:lineSpacingExtra="3dp"
android:lineSpacingMultiplier="1.2"
android:textSize="14dp"
android:textColor="#999999"
tools:text="提示消息提示消息提示消息提示消息提示消息提示消息提示消息提示消息" />
<View
android:layout_width="match_parent"
android:layout_height="1px"
android:layout_marginTop="16dp"
android:background="#E4E4E4" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<Button
android:id="@+id/negtive"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:paddingTop="16dp"
android:paddingBottom="16dp"
android:layout_weight="1"
android:background="@null"
android:gravity="center"
android:singleLine="true"
tools:text="No"
android:textColor="#999999"
android:textSize="16sp" />
<View
android:id="@+id/column_line"
android:layout_width="1px"
android:layout_height="match_parent"
android:background="#E4E4E4" />
<Button
android:id="@+id/positive"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginRight="10dp"
android:layout_weight="1"
android:paddingTop="16dp"
android:paddingBottom="16dp"
android:background="@null"
android:gravity="center"
android:singleLine="true"
tools:text="Yes"
android:textColor="#38ADFF"
android:textSize="16sp" />
</LinearLayout>
</LinearLayout>
</RelativeLayout>
Dialog的styles.xml:
<style name="CustomDialog" parent="android:style/Theme.Dialog">
<!--背景颜色及和透明程度-->
<item name="android:windowBackground">@android:color/transparent</item>
<!--是否去除标题 -->
<item name="android:windowNoTitle">true</item>
<!--是否去除边框-->
<item name="android:windowFrame">@null</item>
<!--是否浮现在activity之上-->
<item name="android:windowIsFloating">true</item>
<!--是否模糊-->
<item name="android:backgroundDimEnabled">true</item>
</style>
在Activity或Fragment中实现Dialog中的监听事件,有利于对Activity、Fragment的一系列刷新等操作:
(比如:在Activity、Fragment中点击某个按钮显示弹框Dialog,然后点击Dialog中的按钮来操作Dialog后面的界面,Dialog不会消失,操作的过程中可以实时的查看数据的变化,就不需要再使用广播BroadCastReceiver、EventBus等通知了)
private void initDialog() {
final CommonDialog dialog = new CommonDialog(BroadcastRActivity.this);
dialog.setMessage("这是一个自定义Dialog。")
.setImageResId(R.mipmap.ic_launcher)
// .setTitle("系统提示")
.setSingle(true).setOnClickBottomListener(new CommonDialog.OnClickBottomListener() {
@Override
public void onPositiveClick() {
// dialog.dismiss();
tv_dialog.setText("8888888");
Toast.makeText(BroadcastRActivity.this,"确认",Toast.LENGTH_SHORT).show();
}
@Override
public void onNegtiveClick() {
// dialog.dismiss();
Toast.makeText(BroadcastRActivity.this,"取消",Toast.LENGTH_SHORT).show();
}
}).show();
}
圆角背景:
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<solid android:color="#ffffff" />
<stroke
android:width="0.8dp"
android:color="#ffffff" />
<!-- 圆角 -->
<corners android:radius="6dp" />
</shape>