簡評：使用 StateListAnimator 輕松實現(xiàn) Material Design 效果。

Material Design 中最基礎(chǔ)的一條原則就是 'motion provides meaning'，也就是當用戶和你的 app 交互時應當提供合理的視覺反饋。標準做法是使用官方提供的 StateListDrawable 來為控件實現(xiàn)交互效果。

StateListAnimator 是和 Material Design 一同在 API 21 引入的，可以用來方便的實現(xiàn)交互反饋的視覺效果，今天這篇文章就講解了 StateListAnimator 的用法。

在以前，我們處理 Button，TextView 等控件的點擊效果時，通常是定義一個 selector，為按下和普通情況分別設置顏色。但這樣的效果一方面不夠動人，另一方面也不符合 Material Design 的規(guī)范。

Material Design 規(guī)范推薦 Button 等控件應當以材質(zhì)的方式表現(xiàn)，當接觸到手指時上升。因此 Material Design 對組件有了 z 軸這個概念，也就是高度。z 值越大，組件離界面底層（水平面）越遠，投影越重。

那我們怎么來實現(xiàn)組件在 z 軸（高度）上的變化效果呢？這就需要用到今天講到的 StateListAnimator 了。

首先，讓我們創(chuàng)建一個 animator 資源文件夾，在其中創(chuàng)建一個 selector_animator.xml：

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
 <item android:state_pressed="true">
 <set>
  <objectAnimator
  android:duration="@android:integer/config_shortAnimTime"
  android:propertyName="scaleX"
  android:valueTo="1.025"
  android:valueType="floatType" />
  <objectAnimator
  android:duration="@android:integer/config_shortAnimTime"
  android:propertyName="scaleY"
  android:valueTo="1.025"
  android:valueType="floatType" />
  <objectAnimator
  android:duration="@android:integer/config_shortAnimTime"
  android:propertyName="translationZ"
  android:valueTo="4dp"
  android:valueType="floatType" />
 </set>
 </item>
 
 <item>
 <set>
  <objectAnimator
  android:duration="@android:integer/config_shortAnimTime"
  android:propertyName="scaleX"
  android:valueTo="1.0"
  android:valueType="floatType" />
  <objectAnimator
  android:duration="@android:integer/config_shortAnimTime"
  android:propertyName="scaleY"
  android:valueTo="1.0"
  android:valueType="floatType" />
  <objectAnimator
  android:duration="@android:integer/config_shortAnimTime"
  android:propertyName="translationZ"
  android:valueTo="0dp"
  android:valueType="floatType" />
 </set>
 </item>
 </selector>

代碼很簡單，當處于按下情況時，組件沿 x, y 軸擴大 1.025 倍并升高 4dp（會在組件四周產(chǎn)生投影效果）。

需要注意其中的 propertyName 屬性目前支持：

• translationX, translationY: 控制組件沿 x 和 y 軸移動多少距離。
• rotation, rotationX, rotationY: 繞中心點旋轉(zhuǎn)，設置 rotation 是 2D 平面旋轉(zhuǎn)，rotationX 和 rotationY 分別是從屏幕內(nèi)向屏幕外旋轉(zhuǎn)和從左到右旋轉(zhuǎn)，均為 3D 旋轉(zhuǎn)。
• scaleX, scaleY: 沿 x, y 軸的縮放比例，設置為 1.5 即 1.5 倍。
• pivotX, pivotY: 設置組件的中心點在哪里，scale 和 rotation 都會根據(jù)設置的中心點來變化，默認為幾何中心。
• x, y: 組件最終要出現(xiàn)在相對其父容器的位置。
• alpha: 組件的透明度，值的范圍從 0 到 1，為 0 時完全透明。

然后在 layout 文件中設置組件的 stateListAnimator 值就可以啦：

<TextView
 android:id="@+id/textView"
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 ... 
 android:stateListAnimator="@animator/selector_animator" />

因為知乎不支持 gif，感興趣的同學可以點擊原文鏈接查看實現(xiàn)效果。

原文：StateListAnimator

總結(jié)

以上就是這篇文章的全部內(nèi)容了，希望本文的內(nèi)容對大家的學習或者工作具有一定的參考學習價值，謝謝大家對我們的支持。