Android實現(xiàn)自定義華麗的水波紋效果
先來看看效果

實現(xiàn)效果
模擬水波紋的效果:點擊屏幕就有圓環(huán)出現(xiàn),半徑從小到大,透明度從大到小(0為透明)
實現(xiàn)思路
1.自定義類繼承View。
2.定義每個圓環(huán)的實體類 Wave,并初始化繪制圓環(huán)的畫筆的數(shù)據(jù)。
3.重寫onTouchEvent方法,down時,獲得坐標點,做為圓環(huán)圓心。
4.發(fā)送handler信息,對數(shù)據(jù)進行修改,刷新頁面。
5.重寫onDraw方法,繪制一個圓環(huán)。
1. 自定義類繼承View
新建WaterWaveView2類繼承View
public class WaterWaveView2 extends View {
//存放圓環(huán)的集合
private ArrayList<Wave> mList;
//界面刷新
private Handler mHandler = new Handler() {
@Override
public void handleMessage(Message msg) {
invalidate();//刷新界面,會執(zhí)行onDraw方法
}
};
public WaterWaveView2(Context context) {
this(context, null);
}
public WaterWaveView2(Context context, AttributeSet attrs) {
super(context, attrs);
mList = new ArrayList<Wave>();
}
2. 定義實體類 Wave
/**
* Created by HongJay on 2016/8/30.
* 把wave的數(shù)據(jù)封裝成一個對象
*/
public class Wave {
public float x;//圓心x坐標
public float y;//圓心y坐標
public Paint paint; //畫圓的畫筆
public float width; //線條寬度
public int radius; //圓的半徑
public int ranNum;//隨機數(shù)
public int[] randomColor={Color.BLUE,Color.CYAN,
Color.GREEN,Color.MAGENTA,Color.RED,Color.YELLOW};
public Wave(float x, float y) {
this.x = x;
this.y = y;
initData();
}
/**
* 初始化數(shù)據(jù),每次點擊一次都要初始化一次
*/
private void initData() {
paint=new Paint();//因為點擊一次需要畫出不同的圓環(huán)
paint.setAntiAlias(true);//打開抗鋸齒
ranNum=(int) (Math.random()*6);//[0,5]的隨機數(shù)
paint.setColor(randomColor[ranNum]);//設置畫筆的顏色
paint.setStyle(Paint.Style.STROKE);//描邊
paint.setStrokeWidth(width);//設置描邊寬度
paint.setAlpha(255);//透明度的設置(0-255),0為完全透明
radius=0;//初始化
width=0;
}
}
3. 重寫onTouchEvent方法
獲得圓心,并且刪除集合中透明度為0的圓環(huán),通知handler調用onDraw()方法
public boolean onTouchEvent(MotionEvent event) {
super.onTouchEvent(event);
switch (event.getAction()) {
case MotionEvent.ACTION_DOWN:
float x = event.getX();
float y = event.getY();
deleteItem();
Wave wave = new Wave(x, y);
mList.add(wave);
//刷新界面
invalidate();
break;
case MotionEvent.ACTION_MOVE:
float x1 = event.getX();
float y1 = event.getY();
deleteItem();
Wave wave1 = new Wave(x1, y1);
mList.add(wave1);
invalidate();
break;
}
//處理事件
return true;
}
//刪除透明度已經為0的圓環(huán)
private void deleteItem(){
for (int i = 0; i <mList.size() ; i++) {
if(mList.get(i).paint.getAlpha()==0){
mList.remove(i);
}
}
}
}
4. 重寫onDraw()方法,循環(huán)繪制圓環(huán)
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
//避免程序一運行就進行繪制
if (mList.size() > 0) {
//對集合中的圓環(huán)對象循環(huán)繪制
for (Wave wave : mList) {
canvas.drawCircle(wave.x, wave.y, wave.radius, wave.paint);
wave.radius += 3;
//對畫筆透明度進行操作
int alpha = wave.paint.getAlpha();
if (alpha < 80) {
alpha = 0;
} else {
alpha -= 3;
}
//設置畫筆寬度和透明度
wave.paint.setStrokeWidth(wave.radius / 8);
wave.paint.setAlpha(alpha);
//延遲刷新界面
mHandler.sendEmptyMessageDelayed(1, 100);
}
}
}
總結
以上就是Android實現(xiàn)自定義水波紋效果的全部內容,怎么樣?實現(xiàn)的效果不錯吧,感興趣的小伙伴們快快自己動手實踐起來,希望這篇文章對大家的學習和工作能有所幫助。
相關文章
Android Studio 新建項目通過git上傳到碼云圖文教程詳解
本文通過圖文并茂的方式給大家介紹了Android Studio 新建項目通過git上傳到碼云的方法,需要的朋友可以參考下2017-11-11
使用Android原生WebView+Highcharts實現(xiàn)可左右滑動的折線圖
折線圖是Android開發(fā)中經常會碰到的效果,但由于涉及自定義View的知識,對許多剛入門的小白來說會覺得很高深,下面這篇文章主要給大家介紹了關于如何使用Android原生WebView+Highcharts實現(xiàn)可左右滑動的折線圖的相關資料,需要的朋友可以參考下2022-05-05
Android實現(xiàn)網(wǎng)絡加載時的對話框功能
這篇文章主要介紹了Android實現(xiàn)網(wǎng)絡加載時的對話框功能,非常不錯,具有參考借鑒價值,需要的朋友可以參考下2017-02-02

