Android自訂群組件系列【14】——Android5.0按鈕波紋效果實現，androidandroid5.0

Android自訂群組件系列【14】——Android5.0按鈕波紋效果實現，androidandroid5.0

今天任老師發表了一篇關於Android5.0中按鈕按下的波紋效果實現《Android L中水波紋點擊效果的實現》，出於好奇我下載了原始碼看了一下效果，正好手邊有一個Nexus手機，我結合實際效果看了一下，發現有一些地方和實際效果稍有不同，參考任老師的博文實現簡單實現了一個重寫View組件的代碼，將全部代碼貼出，如果有什麼問題或者更好的方式請指出，在此再次感謝任老師的這篇博文。

轉載請說明出處：http://blog.csdn.net/dawanganban

順便在這裡拉一下票，如果你覺得這篇文章對你有所協助，給陽光小強投一票吧：點擊投票

主要改變的地方有：

1、在手指按下的時候會有兩個變化，一個是在按鈕上產生一個暗色全鋪背景，然後再出現一個擴散的水波。

2、有長按和點擊的區別，長按的時候水波是慢慢擴散，如果點擊則會迅速擴散。

示範效果（這裡暫時不貼圖了，沒有安裝Android模擬器，動畫效果錄製不理想）

實現過程可以參考任老師的博文，並參考代碼注釋（注釋的很詳細，想必不難理解）

MyButton.java

package com.example.myreveallayout;import android.content.Context;import android.graphics.Canvas;import android.graphics.Paint;import android.os.SystemClock;import android.util.AttributeSet;import android.view.MotionEvent;import android.view.View;import android.view.ViewConfiguration;/** * Android 5.0按鈕點擊效果 * 說明：可以將View替換成Button、ImageButton等組件。 * @author 陽光小強  http://blog.csdn.net/dawanganban * */public class MyButton extends View{private static final int INVALIDATE_DURATION = 20; //每次重新整理的時間間隔private static int DIFFUSE_GAP = 10;  //擴散半徑增量private static int TAP_TIMEOUT;  //判斷點擊和長按的時間private int viewWidth;  //控制項寬度和高度private int viewHeight;                            private int pointX;  //控制項原點座標（左上方）private int pointY;private int maxRadio;  //擴散的最大半徑private int shaderRadio;private Paint bottomPaint;  //畫筆private Paint colorPaint;private boolean isPushButton;    //記錄是否按鈕被按下public MyButton(Context context, AttributeSet attrs) {super(context, attrs);initPaint();TAP_TIMEOUT = ViewConfiguration.getLongPressTimeout();}/** * 初始化筆刷資源 */private void initPaint() {colorPaint = new Paint();bottomPaint = new Paint();colorPaint.setColor(getResources().getColor(R.color.reveal_color));bottomPaint.setColor(getResources().getColor(R.color.bottom_color));}@Overrideprotected void onSizeChanged(int w, int h, int oldw, int oldh) {super.onSizeChanged(w, h, oldw, oldh);this.viewWidth = w;this.viewHeight = h;}private int eventX;private int eventY;private long downTime = 0;@Overridepublic boolean onTouchEvent(MotionEvent event) {switch (event.getAction()) {case MotionEvent.ACTION_DOWN://只需要取一次時間if(downTime == 0){downTime = SystemClock.elapsedRealtime();}eventX = (int)event.getX();eventY = (int)event.getY();//計算最大半徑countMaxRadio();isPushButton = true;postInvalidateDelayed(INVALIDATE_DURATION);break;case MotionEvent.ACTION_UP:case MotionEvent.ACTION_CANCEL:if(SystemClock.elapsedRealtime() - downTime < TAP_TIMEOUT){DIFFUSE_GAP = 30;postInvalidate();}else{clearData();}break;}return true;}/** * 計算此時的最大半徑 */private void countMaxRadio() {if(viewWidth > viewHeight){if(eventX < viewWidth / 2){maxRadio = viewWidth - eventX;}else{maxRadio = viewWidth / 2 + eventX;}}else{if(eventY < viewHeight / 2){maxRadio = viewHeight - eventY;}else{maxRadio = viewHeight / 2 + eventY;}}}/** * 清理改變的資料（初始化資料） */private void clearData(){downTime = 0;DIFFUSE_GAP = 10;isPushButton = false;shaderRadio = 0;postInvalidate();}@Overrideprotected void dispatchDraw(Canvas canvas) {super.dispatchDraw(canvas);if(!isPushButton) return; //如果按鈕沒有被按下則返回//繪製按下後的整個背景canvas.drawRect(pointX, pointY, pointX + viewWidth, pointY + viewHeight, bottomPaint);canvas.save();//繪製擴散圓形背景canvas.clipRect(pointX, pointY, pointX + viewWidth, pointY + viewHeight);canvas.drawCircle(eventX, eventY, shaderRadio, colorPaint);canvas.restore();//直到半徑等於最大半徑if(shaderRadio < maxRadio){postInvalidateDelayed(INVALIDATE_DURATION, pointX, pointY, pointX + viewWidth, pointY + viewHeight);shaderRadio += DIFFUSE_GAP;}else{clearData();}}}

完整原始碼下載請點擊右下角跳舞的小人，在群共用中可下載。