对话框在实际开发中较为常用,但系统自带的对话框不够美观,于是便自定义了一个对话框,本文结合一个实例来分享一下自定义对话框的大概步骤和具体实现。
先看看效果图,标题和消息内容都可以自定义,哈哈哈,还不错吧,简洁美观。下面我们按照步骤依依实现这个效果。
基本步骤:
一、继承android.app.Dialog类
二、设置对话框的样式
三、设置对话框的布局
四、重写Dialog的方法
1、继承android.app.Dialog并重写父类的构造方法:
public class CustomDialog extends Dialog
{
private Context context;
private String title = "";
private String dialogMsg = "";
private TextView tv_title, tv_msg, positiveTxv, negativeTxv;
/*public CustomDialog(Context context)
{
super(context);
this.context = context;
}*/
/* 构造函数,用于创建自定义的对话框对象
* 对话框分为三部分:标题栏,消息和消息事件,所以在此直接将标题和消息作为构造函数的参数传入
* title:描述对话框的用途
* dialogMsg:作为信息显示给用户看
*/
public CustomDialog(Context context, String title, String dialogMsg)
{
super(context, R.style.Custom_Dialog);
this.context = context;
this.title = title;
this.dialogMsg = dialogMsg;
}
}
Dialog有两个构造函数,在本例中我们只用了带有两个参数的那一个,其中context用于指定Dialog依靠的Activity,R.style.Custom_Dialog是对话框的样式,在res/values/style.xml中定义:
<resources>
<!-- Custom Dialog Style -->
<style name="Custom_Dialog" parent="@android:Theme.Dialog">
<!-- Dialog的windowFrame框为无 -->
<item name="android:windowFrame">@null</item>
<!-- 是否显示title -->
<item name="android:windowNoTitle">true</item>
<!-- 背景 -->
<item name="android:windowBackground">@android:color/transparent</item>
<!-- 是否浮现在activity之上 -->
<item name="android:windowIsFloating">true</item>
<!-- 对话框是否有遮盖 -->
<item name="android:windowContentOverlay">@null</item>
</style>
</resources>
2、设置对话框的样式
通过设置样式,我们可以开发出自己想要的效果,如style.xml中所示,我们已经定义好了样式。
3、对话框布局
对话框布局最能体现出自定义的对话框的个性和效果,直白的说就是用对话框把你的布局展示出来。具体实现就是在布局文件中定义好布局,然后用setContentView()指定布局文件。
act_dialog.xml
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#1E90FF" >
<RelativeLayout
android:id="@+id/dialog_title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="1dp"
android:background="#FFFFFFFF" >
<ImageView
android:id="@+id/dialog_icon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:paddingBottom="5dp"
android:src="@android:drawable/ic_dialog_alert" />
<TextView
android:id="@+id/title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignBottom="@+id/dialog_icon"
android:layout_centerVertical="true"
android:layout_toRightOf="@+id/dialog_icon"
android:paddingBottom="5dp"
android:textColor="#1E90FF" />
</RelativeLayout>
<RelativeLayout
android:id="@+id/dialog_msg"
android:layout_width="match_parent"
android:layout_height="150dp"
android:layout_below="@+id/dialog_title"
android:background="#FFFFFFFF" >
<!--
对话框消息内容,在此 RelativeLayout中,
有兴趣的同学还可以试着添加其他内容
-->
<TextView
android:id="@+id/msg"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="50dp"
android:layout_marginTop="50dp"
android:singleLine="false"
android:textColor="@android:color/black"
android:textSize="20sp" />
</RelativeLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="@+id/dialog_msg"
android:background="@android:color/darker_gray"
android:orientation="horizontal" >
<TextView
android:id="@+id/dialog_cancle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginRight="1dp"
android:layout_marginTop="1dp"
android:layout_weight="1"
android:background="@android:color/white"
android:clickable="true"
android:gravity="center_horizontal"
android:paddingBottom="5dp"
android:paddingTop="10dp"
android:text="@android:string/cancel"
android:textColor="@android:color/darker_gray" />
<TextView
android:id="@+id/dialog_ok"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="1dp"
android:layout_weight="1"
android:background="@android:color/white"
android:clickable="true"
android:gravity="center_horizontal"
android:paddingBottom="5dp"
android:paddingTop="10dp"
android:text="@android:string/ok" />
</LinearLayout>
</RelativeLayout>
4、重写Dialog的方法
指定好了布局,剩下的就只有重写Dialog的方法了,直接看CustomDialog.java完整代码:
CustomDialog.java
package com.justkin.customwidget.dialog;
import android.app.Dialog;
import android.content.Context;
import android.os.Bundle;
import android.view.Gravity;
import android.view.LayoutInflater;
import android.view.View;
import android.view.Window;
import android.view.WindowManager;
import android.widget.TextView;
import com.justkin.customwidget.R;
public class CustomDialog extends Dialog
{
private Context context;
private String title = "";
private String dialogMsg = "";
private TextView tv_title, tv_msg, positiveTxv, negativeTxv;
/*public CustomDialog(Context context)
{
super(context);
this.context = context;
}*/
/* 构造函数,用于创建自定义的对话框对象
* 对话框分为三部分:标题栏,消息和消息事件,所以在此直接将标题和消息作为构造函数的参数传入
* title:描述对话框的用途
* dialogMsg:作为信息显示给用户看
*/
public CustomDialog(Context context, String title, String dialogMsg)
{
super(context, R.style.Custom_Dialog);
this.context = context;
this.title = title;
this.dialogMsg = dialogMsg;
}
@Override
protected void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
/*
* 设置居中显示
*/
Window window = getWindow();
WindowManager.LayoutParams params = window.getAttributes();
params.gravity = Gravity.CENTER;
window.setAttributes(params);
initDialog(context);
}
private void initDialog(Context context)
{
/*
* 设置对话框布局
*/
View view = LayoutInflater.from(context).inflate(R.layout.act_dialog, null);
setContentView(view);
tv_title = (TextView) view.findViewById(R.id.title);
tv_msg = (TextView) view.findViewById(R.id.msg);
positiveTxv = (TextView) view.findViewById(R.id.dialog_ok);
negativeTxv = (TextView) view.findViewById(R.id.dialog_cancle);
tv_title.setText(title); //设置标题
tv_msg.setText(dialogMsg); //设置消息内容
//确定键点击事件
positiveTxv.setOnClickListener(new View.OnClickListener()
{
@Override
public void onClick(View v)
{
//创建该示例时重写
setOnPositiveListener();
}
});
//取消键点击事件
negativeTxv.setOnClickListener(new View.OnClickListener()
{
@Override
public void onClick(View v)
{
//创建该示例时重写
setOnNegativeListener();
}
});
}
/**
* 确定键监听器
*/
public void setOnPositiveListener()
{
}
/**
* 取消键监听器
*
*/
public void setOnNegativeListener()
{
}
@Override
public void dismiss()
{
//关闭对话框
super.dismiss();
}
}
至此,对话框就定义完了,当要用这个对话框是,只需创建这样一个对象,重写监听事件就OK了。在本例中,用一个按钮触发事件然后创建对话框,且看下面的代码:
new CustomDialog(context, "自定义对话框", "自定义对话框消息内容")
{
@Override
public void setOnPositiveListener()
{
dismiss();//点击后只是关闭对话框
}
@Override
public void setOnNegativeListener()
{
dismiss();//点击后只是关闭对话框
}
@Override
public void dismiss()
{
super.dismiss();
}
}.show();
OK,自定义对话框就搞定,希望和大家一起分享编码的乐趣……~_~……