Fade Animation of Android graphics

Realized an interesting little thing: with a custom view drawing, draw lines, and the lines fade until they disappear. The effect is as follows:

Using a property animation or a gradient fill (Shader) can be a stroke of change, but to a gradient (the finger does not lift the edge of the drawing edge), not found in Android ready-made API available. So, I made one.

The basic idea is this:

• Record the touch point in the ontouchevent of the view, generate a line lineelement, and place it in a list. Configure a paint instance for each lineelement.
• Draws a segment in OnDraw.
• The alpha value of the paint instance that transforms the lineelement.
• Reorganize segment list by alpha value

The other does not say, on the code:

 PackageCom.example.disappearinglines;ImportAndroid.content.Context;ImportAndroid.graphics.Canvas;ImportAndroid.graphics.Paint;ImportAndroid.graphics.Path;ImportAndroid.graphics.RectF;ImportAndroid.os.Handler;ImportAndroid.os.Message;ImportAndroid.os.SystemClock;ImportAndroid.support.annotation.NonNull;ImportAndroid.util.AttributeSet;ImportAndroid.util.Log;ImportAndroid.view.MotionEvent;ImportAndroid.view.View;ImportJava.util.ArrayList;ImportJava.util.Collection;ImportJava.util.Iterator;ImportJava.util.List;ImportJava.util.ListIterator; Public  class disappearingdoodleview extends View {    Final StaticString TAG ="Doodleview"; Class Lineelement {Static Final  Public intAlpha_step =5;Static Final  Public intSubpath_dimension =8; Public lineelement() {Mpaint =NewPaint (); Mpaint.setargb (255,255,0,0); Mpaint.setantialias (true); Mpaint.setstrokewidth ( -);            Mpaint.setstrokecap (Paint.Cap.BUTT);        Mpaint.setstyle (Paint.Style.STROKE); } Public lineelement(Paint paint)        {mpaint = paint; } Public void Setpaint(Paint paint)        {mpaint = paint; } Public void Setalpha(intAlpha) {Mpaint.setalpha (alpha); } Public floatMstartx =-1; Public floatMstarty =-1; Public floatMendx =-1; Public floatMendy =-1; PublicPaint Mpaint; }PrivateLineelement Mcurrentline =NULL;PrivateList<lineelement> Mlines =NULL;Private Longmelapsed =0;PrivateHandler Mhandler =NewHandler () {@Override         Public void Handlemessage(Message msg) {Disappearingdoodleview. This. Invalidate (); }    }; Public Disappearingdoodleview(Context context) {Super(context); } Public Disappearingdoodleview(context context, AttributeSet attrs) {Super(context, attrs); }@Override    protected void OnDraw(Canvas canvas) {melapsed = Systemclock.elapsedrealtime ();if(Mlines! =NULL) { for(Lineelement e:mlines) {if(E.mstartx <0|| E.mendy <0)Continue;            Canvas.drawline (E.mstartx, E.mstarty, E.mendx, E.mendy, E.mpaint);        } compactpaths (); }    }@Override     Public Boolean ontouchevent(Motionevent event) {floatx = Event.getx ();floaty = event.gety ();intAction = Event.getaction ();if(action = = motionevent.action_up) {//End one line after finger releaseMcurrentline.mendx = x;            Mcurrentline.mendy = y; Mcurrentline =NULL; Invalidate ();return true; }if(action = = Motionevent.action_down) {Mcurrentline =NewLineelement ();            Addtopaths (Mcurrentline);            Mcurrentline.mstartx = x; Mcurrentline.mstarty = y;return true; }if(action = = motionevent.action_move)            {mcurrentline.mendx = x;            Mcurrentline.mendy = y; Mcurrentline =NewLineelement ();            Addtopaths (Mcurrentline);            Mcurrentline.mstartx = x;        Mcurrentline.mstarty = y; }if(Mhandler.hasmessages (1) {Mhandler.removemessages (1); } Message msg =NewMessage (); Msg.what =1; Mhandler.sendmessagedelayed (MSG,0);return true; }Private void addtopaths(lineelement Element) {if(Mlines = =NULL) {Mlines =NewArraylist<lineelement> ();    } mlines.add (Element); } Public void compactpaths(){intSize = Mlines.size ();intindex = size-1;if(Size = =0)return;intBasealpha =255-Lineelement.alpha_step;intItselfalpha; Lineelement Line; for(; index >=0;            Index--, Basealpha-= lineelement.alpha_step) {line = Mlines.get (index); Itselfalpha = Line.mPaint.getAlpha ();if(Itselfalpha = =255){if(Basealpha <=0) {++index; Break;            } line.setalpha (Basealpha); }Else{Itselfalpha-= Lineelement.alpha_step;if(Itselfalpha <=0) {++index; Break;            } line.setalpha (Itselfalpha); }        }if(Index >= size) {//All sub-path should disappearMlines =NULL; }Else if(Index >=0){//log.i (TAG, "compactpaths from" + Index + "to" + (size-1));Mlines = mlines.sublist (index, size); }Else{//No sub-path should disappear}LongInterval = +-Systemclock.elapsedrealtime () + melapsed;if(Interval <0) Interval =0; Message msg =NewMessage (); Msg.what =1;    Mhandler.sendmessagedelayed (msg, interval); }}

This example can also add some effects, such as making the line thinner while it is thinning.

There are still some problems, the line is thick, you can clearly see the line between the segment and the line between the gap or rip, who thought how to optimize, you can tell me, thank you very much. ^_^.

Fade Animation of Android graphics