如何波纹动画效果的宠爱？

编程入门行业动态更新时间:2024-10-07 20:32:22

本文介绍了如何波纹动画效果的宠爱？的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！问题描述

我想prepare动画连锁反应我会告诉你的图片我感兴趣的是这种溺爱圈，这宠爱界应该从一个点褪色，变得越来越大，最终，圆应该消失，所以这应该是这样的屏幕上。这有点像涟漪效应

I would like to prepare animated ripple effect I show you on picture I'm interested in making this doted circles,this doted circles should fade in from one point, become bigger and bigger and in the end, circle should disappear, so this should look like on this screen. It's something like ripple efect

现在我在code alghoritm其中创建新圈子它变得越来越大，然后disapear写，所以不是这个圈子，我想有虚线的。

For now I write in the code alghoritm which create new circles which become bigger and bigger and then disapear, so instead of this circles I would like to have dotted ones.

这是我的code threadclass：

This is my code threadclass:

import android.annotation.SuppressLint; import android.graphics.Canvas; import android.view.SurfaceHolder; public class CanvasThreadForCanvas extends Thread { private SurfaceHolder mySurfaceHolder; private PanelForCanvas myPanel; public static boolean runIt = false; public CanvasThreadForCanvas(SurfaceHolder surfaceHolder, PanelForCanvas panel) { mySurfaceHolder = surfaceHolder; myPanel = panel; } public void setRunning(boolean run) { runIt= run; } @SuppressLint("WrongCall") @Override public void run() { Canvas c; while(runIt) { try { // how fast will be invoked on draw method Thread.sleep(10, 0); } catch (InterruptedException e) { // TODO Auto-generated catch block e.printStackTrace(); } c = null; try { synchronized(mySurfaceHolder) { c = mySurfaceHolder.lockCanvas(null); myPanel.onDraw(c); } }finally { if(c!= null) { mySurfaceHolder.unlockCanvasAndPost(c); } } } super.run(); } }

和平局的地方，我prepare方法5行

and the method where draw, I prepare 5 lines

public class PanelForCanvas extends SurfaceView implements SurfaceHolder.Callback { private CanvasThreadForCanvas canvasthread; public PanelForCanvas(Context context, AttributeSet attrs) { super(context, attrs); getHolder().addCallback(this); canvasthread = new CanvasThreadForCanvas(getHolder(),this); setFocusable(true); } @Override public void surfaceChanged(SurfaceHolder holder, int format, int width, int height) { } @Override public void surfaceCreated(SurfaceHolder holder) { canvasthread.setRunning(true); canvasthread.start(); } @Override public void surfaceDestroyed(SurfaceHolder holder) { boolean retry = true; canvasthread.setRunning(false); while(retry) { try { canvasthread.join(); retry = false; canvasthread.setRunning(false); } catch(InterruptedException e) { } catch(NullPointerException e) { } } } int radiusOfCircle =50; boolean circleend = false; //set of values for every line in the animation //so we'll see 4 line in one moment // for first line Paint line1; float levelOfAlpha1 =255; int line2luncher=0; // for second line Paint line2; float levelOfAlpha2 =255; int line3luncher=0; //for third line Paint line3; float levelOfAlpha3 =255; int line4luncher=0; // for fourth line Paint line4; float levelOfAlpha4 =255; int line5luncher=0; // for second line Paint line5; float levelOfAlpha5 =255; @Override protected void onDraw(Canvas canvas) { Paint paint = new Paint(); Paint linePaint = new Paint(); //Bitmap kangoo = BitmapFactory.decodeResource(getResources(),R.drawable.bccb3e123050fb9165ee8a91c447bcf3); canvas.drawColor(Color.WHITE); // need to add this style when you need to draw f.example // circle without filling it circleend = true; linePaint.setStyle(Paint.Style.STROKE); linePaint.setStrokeWidth(5); // give for every line color/style/ Stroke line1 =line2= line3 =line4 =line5 = linePaint; // the part where we animating fade lines // drawing this circle line // first line if(circleend == true) { // levelOfAlpha1 is set on the begining to 255, which // means that it will be full colorer, as much as levelOfAlpha1 is // decreasing as much the color became more transparently // so if the level is set to 0 we didn't see any color in this // place line1.setColor(Color.argb((int) levelOfAlpha1, 135, 206, 250)); canvas.drawCircle(1300, 0, 150, line1); // -3.4 is taken from calculation // 255 is max, we want to get the 0 during // one cycle of circle growth, // the loop must be made 75 times to make circle // growing from min to max // so 255/ 75 = 3.4 if(levelOfAlpha1==0) { levelOfAlpha1=255; } else { levelOfAlpha1-=3.4; //after 5 cycles line luncher will be 5 //which lunch the animation of second line if(line2luncher!=20){ line2luncher++; } } } if(line2luncher==20) { //this same as for first line line2.setColor(Color.argb((int) levelOfAlpha2, 135, 206, 250)); canvas.drawCircle(1300, 0, 175, line2); if(levelOfAlpha2==0) { levelOfAlpha2=255; } else { levelOfAlpha2-=3.4; if(line3luncher!=20){ line3luncher++; } } } if(line3luncher==20) { //this same as for first line line3.setColor(Color.argb((int) levelOfAlpha3, 135, 206, 250)); canvas.drawCircle(1300, 0, 200, line3); if(levelOfAlpha3==0) { levelOfAlpha3=255; } else { levelOfAlpha3-=3.4; if(line4luncher!=20){ line4luncher++; } } } if(line4luncher==20) { //this same as for first line line4.setColor(Color.argb((int) levelOfAlpha4, 135, 206, 250)); canvas.drawCircle(1300, 0, 225, line4); if(levelOfAlpha4==0) { levelOfAlpha4=255; } else { levelOfAlpha4-=3.4; if(line5luncher!=20){ line5luncher++; } } } if(line5luncher==20) { //this same as for first line line5.setColor(Color.argb((int) levelOfAlpha5, 135, 206, 250)); canvas.drawCircle(1300, 0, 250, line5); if(levelOfAlpha5==0) { levelOfAlpha5=255; } else { levelOfAlpha5-=3.4; } } }

和它的外观在屏幕上。这是不是很漂亮。结果我怎样才能得到点的这种效果呢？

and how it looks on the screen. It isn't so beautiful. How I can get this effect of dots?

如果你知道有更简单的方法来获得同样的点反复动画圈的效应，我将不胜感激。

If you know any easier method to get this same efect of repeatly animated circle of dot, I would be grateful.