一,我就不吐槽现在某些UI的审美观了,android的扁平化美观的设计风格有多少个UI自己去研究过。大部分公司搞UI的,我就感觉苹果设计风格最棒,苹果能做出来的你搞android的就做不出来。我心里一万个cnm。当然了最后还是按照人家的效果图做,下面来几张图片吧,看看效果。然后撸代码
二,分析所需的材料:
1) 首先我们要知道IOS风格的弹窗需要高亮和圆角的四周而且不会拉升变形。所以我们
需要制作.9图片来达到效果。
2) 我们需要弹窗的每一个Dialog弹出的动画和弹窗的样式所以我们需要自定义弹窗样
式。因为底部的需要弹出动画和退出动画。所以我们需要自定义两个弹窗样式。
3) 我们需要两xml布局来设置中间和底部弹出的两个弹出所显示需要的空间布局。
三,分析所需要的属性来自定义属性和动画这些:
1) 如图所示:弹出时候,从下往上弹出,退出时候从上往下消失所以我们需要自定义两个动画:
我们在res下面新建一个anim然后新建两个xml文件animal_show_dialog(弹出动画)和animal_dissmiss_dialog(退出动画)代码如下:这里动画给图自己
一看就懂哦(非常感谢学步圆提供的图片):
//从底部弹出时候动画设置:animal_show_dialog.xml
<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="200"
android:fromYDelta="100%"
android:toYDelta="0" />
//从底部消失时候动画设置:animal_dissmiss_dialog.xml
<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="300"
android:fromYDelta="0"
android:toYDelta="100%" />
2)我们必须给Dialog自定义样式,让其布局虚化且弹出消失有动画。代码如下
我们在styles.xml里面:
<!--自定义DiaLog的样式,模仿模糊效果-->
<style name="ActionBootoomDialogStyle" parent="Theme.AppCompat.Dialog">
<!--背景是透明的-->
<item name="android:windowBackground">@android:color/transparent</item>
<item