欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  移动技术

Android 自定义简洁大方的Dialog

程序员文章站 2022-06-16 10:22:32
在android开发中常常会出现用户手机系统版本不同,导致默认的弹窗样式也会不同;或者是系统弹窗跟UI设计的界面风格不搭的现象,这时候就需要我们自定义弹窗风格样式,才能做到弹窗统一,画风和谐效果。现在我们就来学习如何自定义Dialog弹窗。先看看自定义Dialog的效果图:如何实现简洁大方Dialog?1.新建一个dialog_layout.xml布局,如下图:可以看到Button按钮的背景是白色的并带有圆角,这个效果可以让美工提供背景图片,也可以用shape绘制。1.1在drawable下新...

在android开发中常常会出现用户手机系统版本不同,导致默认的弹窗样式也会不同;或者是系统弹窗跟UI设计的界面风格不搭的现象,这时候就需要我们自定义弹窗风格样式,才能做到弹窗统一,画风和谐效果。现在我们就来学习如何自定义Dialog弹窗。

先看看自定义Dialog的效果图:
Android 自定义简洁大方的Dialog

如何实现简洁大方的Dialog?

1.新建一个dialog_layout.xml布局,如下图:
Android 自定义简洁大方的Dialog

可以看到Button按钮的背景是白色的并带有圆角,这个效果可以让UI设计师提供背景图片,也可以用shape绘制。

1.1在drawable下新建bg_radius_top_white_8.xml文件绘制背景,比如拨打电话的背景:
Android 自定义简洁大方的Dialog

1.2如果需要统一设置按钮的宽,高,颜色,字体,可以在styles.xml中设置,在dialog_layout.xml布局引用,如下图:

Android 自定义简洁大方的Dialog

2.自定义Dialog样式,同样是在styles.xml中设置:
Android 自定义简洁大方的Dialog

2.1在colors.xml中设置颜色:
Android 自定义简洁大方的Dialog

3自定义Dialog的入场、出场动画
3.1新建资源文件夹命名为anim,并新建动画的xml文件:
Android 自定义简洁大方的Dialog
Android 自定义简洁大方的Dialog

3.2 弹窗进入时(从底部垂直进入,动画持续300毫秒),如下图

Android 自定义简洁大方的Dialog

3.3 弹窗退出时的布局是dialog_exit.xml(从底部垂直退出到手机屏幕外,动画持续300毫秒)

3.4同样在styles.xml设置:

Android 自定义简洁大方的Dialog

4.新建BottomUpDialog 继承Dialog,在构造方法中引入写好的自定义Dialog样式:R.style.bottom_dialog,如下图:

Android 自定义简洁大方的Dialog

最后在MainActivity中调用一下,就能看到效果了
Android 自定义简洁大方的Dialog

完整demo地址:https://github.com/yanhuomatou2015/CustomDialogDemo

今天的分享结束了,再见~

本文地址:https://blog.csdn.net/yanhuomatou2015/article/details/109431023

相关标签: 笔记