博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
Android Material Design 阴影实现
阅读量:5739 次
发布时间:2019-06-18

本文共 1330 字,大约阅读时间需要 4 分钟。

转载自: 让 View 产生阴影有以下 4 种方式:

控制 elevation 使用 OutlineProvider 使用 9 图 使用 MD 风格的控件,如 CardView,FloatingActionButton 0.Z轴的概念 Android 在 5.0 及以后采用了 Material Design 设计语言,引入了 Z 轴的概念,也就是垂直于屏幕的轴,Z 轴会让 View 产生阴影的效果:

shadows-depth.png 想象有一束斜光投向屏幕,Z 轴值越大,离光就越近,阴影的范围就越大;Z 轴值越小,离光就越远,阴影的范围就越小。而:

Z=elevation+ translationZ

elevation 一般是写在 xml 文件中做静态配置,translateZ 是用来控制动画效果。

是 Z 轴让 View 产生了阴影,我们要控制阴影就是控制 Z 轴啦:

1.控制 elevation 控制 elevation,需要先设置 View 的 BackGround,再设置 elevation。

首先配置一个 drawable:

再设置 background 和 elevation:

效果图 2.使用 OutlineProvider

第 1 种方式可以满足大多数情况,但如果 View 的 background 是 color、图片,甚至是自定义 View 时就无法产生阴影效果了,这是我们需要通过代码设置阴影。官方称之为 outline。

view.setOutlineProvider(new ViewOutlineProvider() {        @Override        public void getOutline(View view, Outline outline) {            outline.setRect(0,0,view.getWidth(),view.getHeight());        }    });复制代码

outline 就是绘制的外部阴影样式,样式可以是任意的:矩形、园、圆角矩形、甚至是路径:

outline的方法 3.使用 9 图

前面两种方法涵盖了大多数情况,实在还有意外:比如兼容 5.0 之前的 UI 样式、UI设计的阴影居然是彩色的!那就使用最后的绝招了: 9 图。不过使用 9 图的灵活性实在是差,高度不同就要不同的切图,这里有一个网站可以自己随意切阴影图:

4.使用官方 MD 组件

其实官方组件的 ActionBar、CardView,FloatingActionButton就自带阴影,应尽量使用他们,这里就不展开讲了。

5.translateZ 动画

介绍 Z 轴时,说过 Z=elevation+ translationZ。elevation 是静态的,而 translateZ 是动态的。如我们点击按钮时希望它有一个弹起的效果,像这样:

弹起

其实是给 view 配置状态动画控制 translationZ:

android:stateListAnimator="@drawable/selector_elevation"

动画 xml 如下

你可能感兴趣的文章
PHP-X开发扩展
查看>>
android学习笔记——onSaveInstanceState的使用
查看>>
工作中如何做好技术积累
查看>>
怎么用sysLinux做U盘双PE+DOS??
查看>>
Spring Transactional
查看>>
shell脚本实例
查看>>
我的友情链接
查看>>
Windows Phone 7 隔离存储空间资源管理器
查看>>
Microsoft Excel 2000/2003修复工具
查看>>
apache安装报错undefined reference ssl
查看>>
关于爱情只有一句忠告
查看>>
CentOS 7下安装部署Oracle11g图文教程
查看>>
F#初学笔记06
查看>>
实战:将企业域名解析委派给企业DNS服务器
查看>>
在Lync 2013环境部署Office Web Apps
查看>>
微软大会Ignite,你准备好了么?
查看>>
读书笔记-高标管事 低调管人
查看>>
Master带给世界的思考:是“失控”还是进化
查看>>
用户和开发者不满苹果iCloud问题多多
查看>>
attrs.xml中declare-styleable 详解(用于自定义控件的属性)
查看>>