Android Material设计中阴影效果的实现方法

View可以投下的阴影，一个View的elevation值决定了它的阴影的大小和绘制的顺序。可以设置一个视图的elevation，在布局中使用属性：android:elevation

android:id="@+id/my_textview"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:text="@string/next"

android:background="@color/white"

android:elevation="5dp" />

新的translationz属性使您能够创建一个反映了暂时的elevation变化的动画。elevation的变化可在响应触摸手势时可能是有用的。

每个View的elevation值，相当于z属性，它决定了阴影的大小：z越大，阴影越大。

Views仅仅在z=0的平面上才会投影；它们不会投影在放置在它们下面和上面的的其他Views上。

使用较高z值的Views会阻隔使用较低z值的Views。

然而，一个View的Z值不会影响View的大小。

elevation有利于创建 在组件需要临时上升到View的平面之上做一些操作时 的动画。

更多关于elevation的介绍，详见http://www.google.com/design/spec/what-is-material/elevation-shadows.html

Assign Elevation to Your Views  在Views中指定Elevation

Z值包含两个成分：elevation和translation。elevation是一个静态的成分，translation使用了动画：Z = elevation + translationZ

在layout中设置elevation，使用android:elevation属性。在代码中设置，使用View.setElevation()方法。

设置一个View的translation,使用View.setTranslationZ()方法。

ViewPropertyAnimator.z()和ViewPropertyAnimator.translationZ() 能使你更轻易的推动Views的elevation。

您还可以使用一个StateListAnimator指定这些动画声明的方式。在状态改变触发动画的情况下，这是特别有用的，比如当用户按下一个按钮时。

Customize View Shadows and Outlines  自定义View的阴影和轮廓

View的背影图片的边界确定了阴影的默认图形。轮廓代表一个图形对象的外部形状和定义的用于触摸反馈的波纹区域。

参考：

android:id="@+id/myview"

...

android:elevation="2dp"

android:background="@drawable/myrect" />

背景图片可以定义成一个圆角的矩形

< !-- res/drawable/myrect.xml -->

< shape xmlns:android="http://schemas.android.com/apk/res/android"

android:shape="rectangle">

< solid android:color="#42000000" / >

< corners android:radius="5dp" / >

< /shape >

因为背景图片定义了View的轮廓(outline)，所以View会投放一个使用了圆角的阴影。提供一个自定义的轮廓重写View的默认阴影图形。

自定义轮廓在代码中：

继承自ViewOutlineProvider

重写getOutline()

使用View.setOutlineProvider()，指派新的轮廓

使用Outline类的一些方法，创建圆角矩形和椭圆的轮廓。默认的outline provider 包含了View的背影轮廓。阻止一个View的投影，可以设置View的ouline provider 为null。

Clip Views  裁剪

剪裁视图使您能够轻松地更改视图的形状。你可以统一裁剪成使用了其他设计元素，或在响应用户输入时改变View的形状。可以裁剪View的外部轮廓区域，使用View.setClipToOutline()或者android:clipToOutline属性。只有矩形、圆形、圆角矩形支持轮廓的裁剪，由Outline.canClip()方法来确定。

当要裁剪成一个图片的形状时，需要设置该图片为View的背景，并调用View.setClipToOutline()。

裁剪是一个奢侈的操作，不要使用动态图形来裁剪。为了实现这种效果，可以使用动画来展现。

资源来自互联网，仅供学习研究使用，切勿作为商业用途。

若对您有所帮助，点击左侧漂浮分享，谢谢！

本站内容，欢迎转载，但必须保留此段声明。

且在文章页面明显位置给出『原文链接』，感谢合作！

如您发现文章有所侵权，请立即联系，将会予以删除。