Androd自定义对话框Dialog视图及参数传递的实现方法

今天给大家讲讲有关自定义对话框的相关内容,前面两篇都在在利用系统提供的函数来实现对话框,但局限性太大,当我们想自己定义视图的时候,就不能利用系统函数了,就需要我们这里的自定义对话框了,有关自定义对话框的东东,以前有写过一篇《android之Dialog相关》,写的不好,今天给大家重新写一篇

一、雏形构建

先给大家看下这小节的效果图:

自定义一个对话框,内容是四个ImageView横排;

1、Dialog布局

根据上图的对话框样式,我们看一下Dialog的布局定义(custom_dialog.xml)

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
 android:id="@+id/log_in_layout"
 android:layout_width="fill_parent"
 android:layout_height="wrap_content"
 android:orientation="horizontal">
 <ImageView
  android:layout_width="match_parent"
  android:layout_height="100dip"
  android:src="@drawable/animal1"
  android:clickable="true"
  android:layout_weight="1"/>
 <ImageView
  android:layout_width="match_parent"
  android:layout_height="100dip"
  android:src="@drawable/animal2"
  android:clickable="true"
  android:layout_weight="1"/>
 <ImageView
  android:layout_width="match_parent"
  android:layout_height="100dip"
  android:src="@drawable/animal3"
  android:clickable="true"
  android:layout_weight="1"/>
 <ImageView
  android:layout_width="match_parent"
  android:layout_height="100dip"
  android:src="@drawable/animal4"
  android:clickable="true"
  android:layout_weight="1"/>
</LinearLayout> 

2、从Dialog派生对话框类

有关构造函数:

有三种构造函数,现在我这里使用重写了两个,这里只需要使用第一个,即传进去context即可;

有关OnCreate()

在OnCreate()时,利用LayoutInflater获取我们对话框的View,然后利用SetContentView指定为我们CustomDialog类的布局。

public class CustomDialog extends Dialog {
 Context mContext;
 public CustomDialog (Context context){
  super(context);
  mContext = context;
 }
 public CustomDialog(Context context, int theme) {
  super(context, theme);
  mContext = context;
 }
 @Override
 protected void onCreate(Bundle savedInstanceState) {
  super.onCreate(savedInstanceState);
  LayoutInflater inflater = (LayoutInflater) mContext
    .getSystemService(Context.LAYOUT_INFLATER_SERVICE);
  View layout = inflater.inflate(R.layout.custom_dialog, null);
  this.setContentView(layout);
 }
} 

3、主函数(MainActivity)

在MainActivity中,我们写一个Button,当用户点击的时候弹出我们自定义的对话框实例

MainActivity的布局:(activity_main.xml)

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
 xmlns:tools="http://schemas.android.com/tools"
 android:layout_width="match_parent"
 android:layout_height="match_parent"
 tools:context=".MainActivity">
 <Button
  android:id="@+id/btn_pop_dialog"
  android:layout_width="fill_parent"
  android:layout_height="wrap_content"
  android:text="弹出对话框"/>
</RelativeLayout> 

代码中的处理:(MainActivity.java)

在点击Btn的时候,创建CustomDialog类的实例,并显示

public class MainActivity extends Activity {
 @Override
 protected void onCreate(Bundle savedInstanceState) {
  super.onCreate(savedInstanceState);
  setContentView(R.layout.activity_main);
  Button btn = (Button)findViewById(R.id.btn_pop_dialog);
  btn.setOnClickListener(new View.OnClickListener() {
   @Override
   public void onClick(View view) {
    CustomDialog dialog = new CustomDialog(MainActivity.this);
    dialog.show();
   }
  });
 }
} 

这部分源码在文章最底部给出;

二、定义对话框样式

这里再回头看看上面弹出的对话框:

在布局中,我们只定义了一个水平布局,里面放了四个ImageView,即那四个小动物,那上面那一坨是哪来的呢(我用红笔圈出来的那块)?能不能去掉?这节,我们就说说有关样式的问题。

第一个问题,只所有上面那一坨,是因为我们没有指定对话框样式,系统会使用默认样式,那一坨就是标题栏。

要去掉的话,我们就需要自定义样式。

1、自定义样式

我们的样式是写在res/values文件夹下的style.xml文件中的,如图,如果没有style.xml,自已新建一个,位置如图:

这里定义的样式代码是这样的:

<style name="dialog" parent="android:Theme.Dialog">
 <item name="android:windowFrame">@null</item>
 <item name="android:windowIsFloating">true</item>
 <item name="android:windowContentOverlay">@null</item>
 <item name="android:windowNoTitle">true</item>
</style> 

先对这几个参数解释一下:

Android:windowFrame:界面对应的前景图片;

android:windowIsFloating:表示浮在屏幕上的,如果在这里使用了,整个layout就会在 屏幕中心,相当于浮在屏幕上,所以这个只适用于dialog

android:windowContentOverlay:表示标题栏的阴影部分的样式,使用图片或者颜色

android:windowNoTitle:标题栏是否隐藏,这就是我们上面显示的标题栏

有关样式的内容很多很杂,这里有篇文章大家可以参考下《Andriod中Style/Theme原理以及Activity界面文件选取过程浅析》,有机会给大家总结一下有关样式和主题的内容,到时再细讲,这里不是本篇的重点,就不再细讲了。

2、使用样式

方法一:

这里有两种方法来使用样式,主要还是利用构造函数,还记得我们上面说过,对话框的两个构造函数:

public class CustomDialog extends Dialog {
 Context mContext;
 public CustomDialog(Context context) {
  super(context);
  mContext = context;
 }
 public CustomDialog(Context context, int theme) {
  super(context, theme);
  mContext = context;
 }
 …………
} 

看第二个就是我们的Theme样式,所以第一种使用样式的方法是在构造时直接将样式传进来,如果这样使用,那我们在构造对话框时应该是这样的“:

public class MainActivity extends Activity {
 @Override
 protected void onCreate(Bundle savedInstanceState) {
  super.onCreate(savedInstanceState);
  setContentView(R.layout.activity_main);
  Button btn = (Button)findViewById(R.id.btn_pop_dialog);
  btn.setOnClickListener(new View.OnClickListener() {
   @Override
   public void onClick(View view) {
    CustomDialog dialog = new CustomDialog(MainActivity.this,R.style.dialog);
    dialog.show();
   }
  });
 }
} 

即在新建CustomDialog实例时,第二个参数传进来我们上面定义的样式。

方法二:

第二种方法,就是我们在构造时,不让别人传样式,只让传进来Context,但在内部,我们利用Super(context,theme)来指定样式,代码如下:

public class CustomDialog extends Dialog {
 Context mContext;
 public CustomDialog(Context context) {
  super(context,R.style.dialog);
  mContext = context;
 }
 …………
} 

这种情况一般用在我们封装代码时,不让其它人在外部改变我们的样式时使用的。

无论使用哪种方法,我们就已经指定我我们的对话框样式,现在的效果是这样的:

看到了没,上面的标题栏没了,下面再看看有关参数传递的问题

三、参数传递

这里涉及到两个问题:传进去和传出来;

传进去:下面有两个按钮,当用户点第一个按钮时,在对话框中显示"From btn 1",如果用户点击第二个按钮,在对话框中显示“From btn 2”

传出来:这四个图片都是可以点击的,当用户点击任何一个图片,把它的ID传出来,并设置到我们的MainActivity中;

这里为了好理解,更改了对话框的布局,将水平布局改成了垂直布局。并且在MainActiviy下面加了一个ImageView.

1、传进去

往对话框里传参数,一般就是利用构造函数来完成的,很简单,即在对话框的构造函数上加上我们自己想要传的参数,这里我们需要额外传一个字符串,来表示从哪个BTN来的。

所以对话框的构造函数就变成了这样:

public class CustomDialog extends Dialog{
 private Context mContext;
 private String mStr;
 public CustomDialog(Context context, String str, int theme) {
  super(context, theme);
  mContext = context;
  mStr = str;
 }
 …………
}

在使用的时候,也很简单:

Button btn2 = (Button)findViewById(R.id.btn_pop_dialog_2);
btn2.setOnClickListener(new View.OnClickListener() {
 @Override
 public void onClick(View view) {
  CustomDialog dialog = new CustomDialog(MainActivity.this,"From btn 2",R.style.dialog);
  dialog.show();
 }
}); 

直接利用构造函数传参即可

2、传出来

利用构造函数传参数大家都知道,但要怎么把用户的操作信息传出来就不是那么简单了,这里就要利用回调来实现了!
回调函数的使用主要依照下面这些步骤:

在对话框中:

public class CustomDialog extends Dialog {
 // 利用interface来构造一个回调函数
 public interface ICustomDialogEventListener {
  public void customDialogEvent(int valueYouWantToSendBackToTheActivity);
 }
 private ICustomDialogEventListener onCustomDialogEventListener;
 // 在构造函数中,设置进去回调函数
 public CustomDialog(Context context,
      ICustomDialogEventListener onCustomDialogEventListener) {
  super(context);
  this.onCustomDialogEventListener = onCustomDialogEventListener;
 }
 //当你想把值传回去的时候,调用回调函数将值设置进去
 @Override
 public void onCreate(Bundle savedInstanceState)
 {
  Button btnOk = (Button) findViewById(R.id.customDialogButton);
  btnOk.setOnClickListener( new Button.OnClickListener()
  {
   public void onClick(View v) {
    onCustomDialogEventListener.customDialogEvent(valueYouWantToSendBackToTheActivity);
    dismiss();
   }
  });
 }
} 

在构造对话框时:

final CustomDialog dialog = new CustomDialog(this, new ICustomDialogEventListener() {
 public void customDialogEvent(int value) {
  //在这里就获取到了从对话框传回来的值
 }
}); 

大致使用流程就是这样的,下面就把我们上面的效果利用回调函数实现出来;
首先在对话框中新建一个回调函数(接口),并且在对话框的构造方法中把回调函数传进来:

public class CustomDialog extends Dialog implements View.OnClickListener {
 //增加一个回调函数,用以从外部接收返回值
 public interface ICustomDialogEventListener {
  public void customDialogEvent(int id);
 }
 private ICustomDialogEventListener mCustomDialogEventListener;
 private Context mContext;
 private String mStr;
 //把回调函数传进来
 public CustomDialog(Context context, String str, ICustomDialogEventListener listener, int theme) {
  super(context, theme);
  mContext = context;
  mStr = str;
  mCustomDialogEventListener = listener;
 }
 …………
} 

然后在OnCreate() 函数中设定ImageView的点击事件,我们将CustomDialog类继承View.OnClickListener接口,对点击事件统一处理:

private void bindImageClickEvent(View layout){
 ImageView img1 = (ImageView)layout.findViewById(R.id.dialog_image1);
 ImageView img2 = (ImageView)layout.findViewById(R.id.dialog_image2);
 ImageView img3 = (ImageView)layout.findViewById(R.id.dialog_image3);
 ImageView img4 = (ImageView)layout.findViewById(R.id.dialog_image4);
 img1.setOnClickListener(this);
 img2.setOnClickListener(this);
 img3.setOnClickListener(this);
 img4.setOnClickListener(this);
}
@Override
protected void onCreate(Bundle savedInstanceState) {
 super.onCreate(savedInstanceState);
 LayoutInflater inflater = (LayoutInflater) mContext
   .getSystemService(Context.LAYOUT_INFLATER_SERVICE);
 View layout = inflater.inflate(R.layout.custom_dialog, null);
 TextView tv = (TextView)layout.findViewById(R.id.dialog_text);
 tv.setText(mStr);
 bindImageClickEvent(layout);//绑定ImageView点击事件
 this.setContentView(layout);
} 

在OnCreate()中,首先将传进来的String字符串设置到对话框的TextView中;然后绑定各个ImageView的点击事件

然后 就是在OnClick中的处理:

主要是根据用户当前点击的ImageView的ID,把这个ImageView所用的图片的DrawableID返回给MainActivity,代码如下:

public void onClick(View view) {
 int id = view.getId();
 int drawableID = -1;
 switch (id){
  case R.id.dialog_image1:
   drawableID = R.drawable.animal1;
   break;
  case R.id.dialog_image2:
   drawableID = R.drawable.animal2;
   break;
  case R.id.dialog_image3:
   drawableID = R.drawable.animal3;
   break;
  case R.id.dialog_image4:
   drawableID = R.drawable.animal4;
   break;
 }
 if (drawableID != -1) {
  mCustomDialogEventListener.customDialogEvent(drawableID);
 }
 dismiss();
} 

这样就把对话框的构造过程讲完了,完整的对话框代码是这样的:

public class CustomDialog extends Dialog implements View.OnClickListener{
 //增加一个回调函数,用以从外部接收返回值
 public interface ICustomDialogEventListener {
  public void customDialogEvent(int id);
 }
 private ICustomDialogEventListener mCustomDialogEventListener;
 private Context mContext;
 private String mStr;
 public CustomDialog(Context context) {
  super(context);
  mContext = context;
 }
 public CustomDialog(Context context, String str,ICustomDialogEventListener listener,int theme) {
  super(context, theme);
  mContext = context;
  mStr = str;
  mCustomDialogEventListener = listener;
 }
 private void bindImageClickEvent(View layout){
  ImageView img1 = (ImageView)layout.findViewById(R.id.dialog_image1);
  ImageView img2 = (ImageView)layout.findViewById(R.id.dialog_image2);
  ImageView img3 = (ImageView)layout.findViewById(R.id.dialog_image3);
  ImageView img4 = (ImageView)layout.findViewById(R.id.dialog_image4);
  img1.setOnClickListener(this);
  img2.setOnClickListener(this);
  img3.setOnClickListener(this);
  img4.setOnClickListener(this);
 }
 @Override
 protected void onCreate(Bundle savedInstanceState) {
  super.onCreate(savedInstanceState);
  LayoutInflater inflater = (LayoutInflater) mContext
    .getSystemService(Context.LAYOUT_INFLATER_SERVICE);
  View layout = inflater.inflate(R.layout.custom_dialog, null);
  TextView tv = (TextView)layout.findViewById(R.id.dialog_text);
  tv.setText(mStr);
  bindImageClickEvent(layout);
  this.setContentView(layout);
 }
 @Override
 public void onClick(View view) {
  int id = view.getId();
  int drawableID = -1;
  switch (id){
   case R.id.dialog_image1:
    drawableID = R.drawable.animal1;
    break;
   case R.id.dialog_image2:
    drawableID = R.drawable.animal2;
    break;
   case R.id.dialog_image3:
    drawableID = R.drawable.animal3;
    break;
   case R.id.dialog_image4:
    drawableID = R.drawable.animal4;
    break;
  }
  if (drawableID != -1) {
   mCustomDialogEventListener.customDialogEvent(drawableID);
  }
  dismiss();
 }
} 

下面就是构造对话框的过程了:

在MainAcitivity中,当点击一个按钮时,new一个ICustomDialogEventListener实例来接收传过来的值;

Button btn = (Button)findViewById(R.id.btn_pop_dialog_1);
btn.setOnClickListener(new View.OnClickListener() {
 @Override
 public void onClick(View view) {
  CustomDialog dialog = new CustomDialog(MainActivity.this,"From btn 1",new CustomDialog.ICustomDialogEventListener() {
   @Override
   public void customDialogEvent(int id) {
    ImageView imageView = (ImageView)findViewById(R.id.main_image);
    imageView.setImageDrawable(getResources().getDrawable(id));
   }
  },R.style.dialog);
  dialog.show();
 }
}); 

在我们收到传过来的DrawableID时,把它设置gc主页面ImageVIew里显示出来,这就完成了我们上面的功能。

好了,本文就到这里了,有关对话框的东东基本上都讲完了,一般还是我们自定义对话框的时间比较多,所以这里讲的啰嗦了一点;

(0)

相关推荐

  • Android中制作自定义dialog对话框的实例分享

    自定义dialog基础版 很多时候,我们在使用android sdk提供的alerdialog的时候,会因为你的系统的不同而产生不同的效果,就好比如你刷的是MIUI的系统,弹出框都会在顶部显示!这里简单的介绍自定义弹出框的应用. 首先创建布局文件dialog: 代码: <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.and

  • Android中AlertDialog各种对话框的用法实例详解

    目标效果: 程序运行,显示图一的几个按钮,点击按钮分别显示图二到图六的对话框,点击对话框的某一项或者按钮,也会显示相应的吐司输出. 1.activity_main.xml页面存放五个按钮. activity_main.xml页面: <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools&

  • Android 自定义对话框 showSetPwdDialog

    样式如下所示: 布局: layout dialog_set_pwd.xml <?xml version="." encoding="utf-"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height=&

  • Android UI设计系列之自定义Dialog实现各种风格的对话框效果(7)

    虽然Android给我们提供了众多组件,但是使用起来都不是很方便,我们开发的APK都有自己的风格,如果使用了系统自带的组件,总是觉得和应用的主题不着边际并且看起来也不顺心,那我们就需要自定义了,为了方便大家对自定义组件的学习,我接下来准备了几遍有关自定义的Dialog的文章,希望对大家有帮助. 在开发APK中最常见的估计就数弹出对话框了,这种对话框按照按钮数量来分大致是三种:一个按钮,两个按钮,三个按钮.现在要讲的就是按照按钮数量分为以上三类吧(当然了可以有更多的按钮,只要你愿意). 自定义Di

  • Android中使用DialogFragment编写对话框的实例教程

    Android提供alert.prompt.pick-list,单选.多选,progress.time-picker和date-picker对话框,并提供自定义的dialog.在Android 3.0后,dialog基于fragment,并对之前版本提供兼容支持库,也就是说对于开发者而言,dialog是基于DialogFragment的,但此时需要在应用中加入相关的兼容库. 和Windows或者网页JS的Dialog不同,Android的dialog是异步的,而不是同步的.对于同步的dialog

  • Androd自定义对话框Dialog视图及参数传递的实现方法

    今天给大家讲讲有关自定义对话框的相关内容,前面两篇都在在利用系统提供的函数来实现对话框,但局限性太大,当我们想自己定义视图的时候,就不能利用系统函数了,就需要我们这里的自定义对话框了,有关自定义对话框的东东,以前有写过一篇<android之Dialog相关>,写的不好,今天给大家重新写一篇 一.雏形构建 先给大家看下这小节的效果图: 自定义一个对话框,内容是四个ImageView横排: 1.Dialog布局 根据上图的对话框样式,我们看一下Dialog的布局定义(custom_dialog.x

  • Android编程自定义对话框(Dialog)位置及大小的方法

    本文实例讲述了Android编程自定义对话框(Dialog)位置及大小的方法.分享给大家供大家参考,具体如下: 代码: package angel.devil; import android.app.Activity; import android.app.Dialog; import android.os.Bundle; import android.view.Gravity; import android.view.Window; import android.view.WindowMana

  • Android自定义对话框Dialog

    本文简单介绍自定义对话框Dialog的使用,代码和结构都非常简单,目的是能够快速使用自定义对话框,在本文中不具体讲解对话框的高级使用. 实现步骤 首先需要自己在我们的.xml文件中自己构建布局 布局文件做好之后,我们可以在style文件下自己定义布局的样式 前两步都做好之后,我开始在写java文件 具体实现过程 1.   xml文件 <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns

  • Android编程实现在自定义对话框中获取EditText中数据的方法

    本文实例讲述了Android编程实现在自定义对话框中获取EditText中数据的方法.分享给大家供大家参考,具体如下: 在项目中忽然遇到这样的问题,需要自定义对话框,对话框需要有一个输入框,以便修改所选中的价格,然后点击确定之后,修改所显示的价格.遇到的最大的问题就是如何能够获取到自定义对话框当中edittext输入的数值,百度了很久,看到的答案都是如下: //得到自定义对话框 final View DialogView = a .inflate ( R.layout.loand, null);

  • Android自定义对话框Dialog的简单实现

    本文着重研究了自定义对话框,通过一下步骤即可清晰的理解原理,通过更改界面设置和style类型,可以应用在各种各样适合自己的App中. 首先来看一下效果图: 首先是activity的界面 点击了上述图片的按钮后,弹出对话框: 点击对话框的确定按钮: 点击对话框的取消按钮: 下面来说一下具体实现步骤: 第一步:设置Dialog的样式(一般项目都可以直接拿来用):style.xml中 <!--自定义Dialog背景全透明无边框theme--> <style name="MyDialo

  • Android中自定义对话框(Dialog)的实例代码

    1.修改系统默认的Dialog样式(风格.主题) 2.自定义Dialog布局文件 3.可以自己封装一个类,继承自Dialog或者直接使用Dialog类来实现,为了方便以后重复使用,建议自己封装一个Dialog类 第一步: 我们知道Android定义个控件或View的样式都是通过定义其style来实现的,查看Android框架中的主题文件,在源码中的路径:/frameworks/base/core/res/res/values/themes.xml,我们可以看到,Android为Dialog定义了

  • 属于自己的Android对话框(Dialog)自定义集合

    Activities提供了一种方便管理的创建.保存.回复的对话框机制,例如 onCreateDialog(int), onPrepareDialog(int, Dialog), showDialog(int), dismissDialog(int)等方法,如果使用这些方法的话,Activity将通过getOwnerActivity()方法返回该Activity管理的对话框(dialog). onCreateDialog(int):当你使用这个回调函数时,Android系统会有效的设置这个Acti

  • Android实现自定义圆角对话框Dialog的示例代码

    前言: 项目中多处用到对话框,用系统对话框太难看,就自己写一个自定义对话框. 对话框包括:1.圆角 2.app图标 , 提示文本,关闭对话框的"确定"按钮 难点:1.对话框边框圆角显示 2.考虑到提示文本字数不确定,在不影响美观的情况下,需要在一行内显示提示的文字信息 3.设置对话框的宽和高 技术储备: 1.安卓开发_使用AlertDialog实现对话框    知道AlertDialog有setView(view) ,Dialog 有ContentView(view) 方法. 2.An

  • Android 对话框 Dialog使用实例讲解

    对话框 Dialog 什么是对话框 对话框是在当前的页面之上弹出的小窗口, 用于显示一些重要的提示信息, 提示用户的输入,确认信息,或显示某种状态.如 : 显示进度条对话框, 退出提示. 对话框的特点: 1, 当前界面弹出的小窗口. 2, 用户要与它进行交互, 可以接收用户输入的信息, 也可以反馈信息给用户. 常用对话框: 1, 普通对话框 AlertDialog 2, 进度条对话框 ProgressDialog 3, 日期对话框 DatePickerDialog 4, 时间对话框 TimePi

  • Android实现可使用自定义透明Dialog样式的Activity完整实例

    本文实例讲述了Android实现可使用自定义透明Dialog样式的Activity.分享给大家供大家参考,具体如下: 有时你需要一个对话框,但同时对话框中的内容有更多控制和能控制其生命周期,这时你可以使用带有Dialog样式的Activity来应用你的项目中,想使Activity有对话框那样效果可以在Androidmanifest中添加 Android:style/Theme.Dialog 的主题特性 例如这样: <activity android:name="MyDialogActivi

随机推荐