Android5.0新特性之——動畫效果1漣漪效果

標籤：app   auto   primary   圖片   margin   一個   horizon   相容   round   

Android5.0 Material Design設計的動畫效果RippleDrawable漣漪效果

      漣漪效果是Android5.0以後的新特性。為了相容性，建議建立drawable-v21檔案夾來存放RippleDrawable，drawable檔案夾下也要放相應的適配圖片。（這裡可以安裝一個AndroidSelector外掛程式，具體的可以參考53102615的第三部分）

     漣漪動畫主要是對於ripple標籤的使用。，其中ripple節點的，必須要設定color屬性。這雷根節點的設定的color就是漣漪效果的波紋顏色。子節點的item設定的drawable是漣漪效果的背景（也可以認為是漣漪效果的展示範圍）。

我這雷根據情境分了4種不同的效果。話不多說先。

1、只有ripple節點，無item子節點。通過可以看出，漣漪效果的擴散範圍沒有限制。已經擴散到了父控制項。

1 <?xml version="1.0" encoding="utf-8"?>2 <ripple xmlns:android="http://schemas.android.com/apk/res/android" 3     android:color="@color/colorBtn">4 </ripple>

2、含有一個item節點。通過，可以看到，控制項顯示了設定的背景色。漣漪效果的範圍得到了控制。

<?xml version="1.0" encoding="utf-8"?><ripple xmlns:android="http://schemas.android.com/apk/res/android" android:color="@color/colorBtn">    <!--顯示預設的 drawable-->    <item android:drawable="@color/colorWhite" /></ripple>

3、第二種情況已經符合大多數的情境了。但是隨著現在的一些視覺效果的變更，可能存在只要漣漪效果，背景可能是透明色的。設定id為mask的item節點，只起到一個漣漪效果限制作用，並不顯示設定的drawable

<?xml version="1.0" encoding="utf-8"?><ripple xmlns:android="http://schemas.android.com/apk/res/android" android:color="@color/colorBtn">    <item        android:id="@android:id/mask"        android:drawable="@color/colorPrimary"/></ripple>

4、第四種其實和第二種效果上是一樣的。個人感覺沒有什麼區別。希望瞭解的大牛進行指點

<?xml version="1.0" encoding="utf-8"?><ripple xmlns:android="http://schemas.android.com/apk/res/android" android:color="@color/colorBtn">    <!--顯示預設的 drawable-->    <item android:drawable="@color/colorWhite" />    <item        android:id="@android:id/mask"        android:drawable="@color/colorAccent"/></ripple>

我的布局檔案：

<?xml version="1.0" encoding="utf-8"?><android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:app="http://schemas.android.com/apk/res-auto"    xmlns:tools="http://schemas.android.com/tools"    android:layout_width="match_parent"    android:layout_height="match_parent"    tools:context="com.gaosiedu.android50.MainActivity">    <Button        android:id="@+id/btn_touch_no"        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:layout_marginEnd="8dp"        android:layout_marginStart="8dp"        android:layout_marginTop="48dp"        android:background="@drawable/ripple_item_no"        android:text="無item效果"        app:layout_constraintEnd_toEndOf="parent"        app:layout_constraintStart_toStartOf="parent"        app:layout_constraintTop_toTopOf="parent" />    <Button        android:id="@+id/btn_touch_single"        android:layout_width="0dp"        android:layout_height="wrap_content"        android:layout_marginStart="8dp"        android:layout_marginTop="44dp"        android:background="@drawable/ripple_item_single"        android:text="有item效果"        app:layout_constraintEnd_toEndOf="@+id/btn_touch_no"        app:layout_constraintStart_toStartOf="@+id/btn_touch_no"        app:layout_constraintTop_toBottomOf="@+id/btn_touch_no" />    <Button        android:id="@+id/btn_touch_mask"        android:layout_width="0dp"        android:layout_height="wrap_content"        android:layout_marginTop="40dp"        android:background="@drawable/ripple_item_mask"        android:text="item含mask效果"        app:layout_constraintEnd_toEndOf="@+id/btn_touch_single"        app:layout_constraintStart_toStartOf="@+id/btn_touch_single"        app:layout_constraintTop_toBottomOf="@+id/btn_touch_single" />    <Button        android:id="@+id/btn_touch_double"        android:layout_width="360dp"        android:layout_height="wrap_content"        android:layout_marginEnd="8dp"        android:layout_marginTop="40dp"        android:background="@drawable/ripple_item_double"        android:text="2個item含mask效果"        app:layout_constraintEnd_toEndOf="@+id/btn_touch_mask"        app:layout_constraintHorizontal_bias="0.0"        app:layout_constraintStart_toStartOf="@+id/btn_touch_mask"        app:layout_constraintTop_toBottomOf="@+id/btn_touch_mask" /></android.support.constraint.ConstraintLayout>

 

Android5.0新特性之——動畫效果1漣漪效果