转载请标明出处:
http://blog.csdn.net/android_it/article/details/51161038
本文出自:【老甩哥的CSDN博客】
在我们开发app的时候,很多地方需要弹出一个对话框,我们要不就直接用系统的Dialog或者就是AlertDialog,但是美工给我们的效果图片很多都是无法去实现的。接下来我们来看下自定义Dialog的使用方法:首先我给大家展示2个图片:
上面的2组图片使我们开发app经常需要的弹窗展示,四周是圆角,iOS几乎都是这个效果,里面的文字信息,颜色都可以改变。接下来我们逐一的进行讲解怎么去自定义Dialog做出这样子的效果:
一:首先我们要在values文件styles下,来写dialog的风格:
<! <style name="dialog_custom" parent="@android:style/Theme.Dialog"> <item name="android:windowIsFloating">true</item> <! <item name="android:windowIsTranslucent">true</item> <! <item name="android:windowNoTitle">false</item> <! <item name="android:windowBackground">@android:color/transparent</item> <! <item name="android:backgroundDimEnabled">false</item> <! </style><! <style name="bottom_menu_animation" parent="android:Animation"> <item name="@android:windowEnterAnimation">@anim/bottom_menu_enter</item> <item name="@android:windowExitAnimation">@anim/bottom_menu_exit</item> </style>
大家可以看到我在styles里面还加了一个动画效果风格,这个在后面自定义Dialog的时候会用到。@anim/bottom_menu_enter和@anim/bottom_menu_exit 分别是在res下建一个anim包添加了2个文件bottom_menu_enter和bottom_menu_exit :
在bottom_menu_enter下:
<?xml version="1.0" encoding="utf-8"?><set xmlns:android="http://schemas.android.com/apk/res/android" > <translate android:duration="400" android:fromYDelta="100%p" /></set>
在bottom_menu_exit 下:
<?xml version="1.0" encoding="utf-8"?><set xmlns:android="http://schemas.android.com/apk/res/android" > <translate android:duration="600" android:toYDelta="100%p" /></set>
上面的动画我就不在阐述了,继续朝下说:
首先我们先想下,自定义一个Dialog,首先要继承Dialog,然后就是要有构造方法,然后重写里面的某些方法,其实就是这样子。如果我们在某个Activity或者Fragment里面想要这个自定义Dialog的话,那么我们就要new这个自定义的Dialog。
那么我们就很自然的想到我们需要一个Context上下文,一个布局文件,如果我们还要操作布局里面的文件的话,那我们还要布局文件里面的id和监听事件;
说到这里:我们就开始一步一步的去写这个自定义的文件:
我们起一个自定义Dialog叫CenterDialog:
private Context context; private int layoutResID; private int[] listenedItems; public CenterDialog(Context context, int layoutResID, int[] listenedItems) { super(context, R.style.dialog_custom); this.context = context; this.layoutResID = layoutResID; this.listenedItems = listenedItems; }
通过上面的分析,我们已经把Context,布局文件,布局文件里面的控件id还有构造方法都写好了,这里说下,因为布局文件里面的id控件会有很多,所有写了一个int[]数组。
接下来我们重写onCreate()方法:
@Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); Window window = getWindow(); window.setGravity(Gravity.CENTER); window.setWindowAnimations(R.style.bottom_menu_animation); setContentView(layoutResID); WindowManager windowManager = ((Activity) context).getWindowManager(); Display display = windowManager.getDefaultDisplay(); WindowManager.LayoutParams lp = getWindow().getAttributes(); lp.width = display.getWidth()*4/5; getWindow().setAttributes(lp); setCanceledOnTouchOutside(true); for (int id : listenedItems) { findViewById(id).setOnClickListener(this); } }
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
接下来就是让CenterDialog implements View.OnClickListener重写onClick()方法,到这里我们再想下,如果想在外部要监听布局文件控件的事件,首先我们要对CenterDialog添加监听事件,然后才可以进行控制控件的监听事件?怎么做呢?
如果Java学的好的话,很明显我们要在这里面写个接口,然后添加一个方法,让外部重写,那下面我们看下代码:
private OnCenterItemClickListener listener; public interface OnCenterItemClickListener { void OnCenterItemClick(CenterDialog dialog, View view); } public void setOnCenterItemClickListener(OnCenterItemClickListener listener) { this.listener = listener; } @Override public void onClick(View view) { dismiss(); listener.OnCenterItemClick(this, view); }
好了,自定义的CenterDialog已经书写完毕,那我们调用看看:
首先写个简单的布局: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:background="#F0EFF5"> <Button android:id="@+id/button" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="点击" /></LinearLayout>
然后再写个dialog布局:dialog_layout.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:background="@drawable/dialog_center_background" android:gravity="center_horizontal" android:orientation="vertical"> <TextView android:id="@+id/dialog_text" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginBottom="20dp" android:layout_marginTop="20dp" android:text="需要写的信息" android:textColor="#F88833" android:textSize="20sp" /> <View android:layout_width="match_parent" android:layout_height="1dp" android:background="#cecece" /> <LinearLayout android:layout_width="match_parent" android:layout_height="50dp" android:orientation="horizontal"> <TextView android:id="@+id/dialog_cancel" android:layout_width="0dp" android:layout_height="match_parent" android:layout_weight="1" android:gravity="center" android:text="取消" android:textColor="#6FBF6A" android:textSize="20sp" /> <View android:layout_width="1dp" android:layout_height="match_parent" android:background="#cecece" /> <TextView android:id="@+id/dialog_sure" android:layout_width="0dp" android:layout_height="match_parent" android:layout_weight="1" android:gravity="center" android:text="确定" android:textColor="#6FBF6A" android:textSize="20sp" /> </LinearLayout></LinearLayout>
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
- 26
- 27
- 28
- 29
- 30
- 31
- 32
- 33
- 34
- 35
- 36
- 37
- 38
- 39
- 40
- 41
- 42
- 43
- 44
- 45
- 46
- 47
- 48
- 49
- 50
- 51
- 52
- 53
- 54
- 55
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
- 26
- 27
- 28
- 29
- 30
- 31
- 32
- 33
- 34
- 35
- 36
- 37
- 38
- 39
- 40
- 41
- 42
- 43
- 44
- 45
- 46
- 47
- 48
- 49
- 50
- 51
- 52
- 53
- 54
- 55
在MainActivity里面:我们new出CenterDialog对象,并添加点击事件:
package com.fshsoft.dialogdemo;import android.support.v7.app.AppCompatActivity;import android.os.Bundle;import android.view.View;import android.widget.Button;public class MainActivity extends AppCompatActivity implements View.OnClickListener, CenterDialog.OnCenterItemClickListener { private Button button; private CenterDialog centerDialog; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); button = (Button) findViewById(R.id.button); button.setOnClickListener(this); centerDialog = new CenterDialog(this, R.layout.dialog_layout, new int[]{R.id.dialog_cancel, R.id.dialog_sure}); centerDialog.setOnCenterItemClickListener(this); } @Override public void onClick(View v) { centerDialog.show(); } @Override public void OnCenterItemClick(CenterDialog dialog, View view) { case R.id.dialog_sure: Toast.makeText(MainActivity.this,"确定按钮",Toast.LENGTH_SHORT).show(); break; default: break; }}
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
- 26
- 27
- 28
- 29
- 30
- 31
- 32
- 33
- 34
- 35
- 36
- 37
- 38
- 39
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
- 26
- 27
- 28
- 29
- 30
- 31
- 32
- 33
- 34
- 35
- 36
- 37
- 38
- 39
在OnCenterItemClick();里面我没有进行取消按钮的判断,是因为在自定义的CenterDialog里面我已经把所有控件的id,点击都dismiss了,前面已经提到了。
以上就是自定义dialog的内容,到这里,也许你会说,我的布局里面需要一个取消按钮,但是不是确定,是添加图片这个字,我不可能再去写个布局把,你说的对,我们可以这样子做:
new int[]{R.id.dialog_cancel, R.id.dialog_sure}) centerDialog.show() TextView dialog_sure = (TextView) centerDialog.findViewById(R.id.dialog_sure) dialog_sure.setText("添加图片")
这里需要注意的事就是,需要先把dialog给show()出来,然后通过centerDialog.findViewById(R.id.dialog_sure);才能拿到控件对象,然后在setText(“添加图片”);当然还可以改变字体的颜色等等信息,这里就不再列举。
以上就是全部内容,写到这里,你可以尝试写下第二张图片的dialog.
不足之处请留言指正!有问题的可以给我留言!谢谢!
下载源码