Dynamically generated line with glow effective

Question

I want to draw line with glow effect like this
glow line
The problem - i must generate this line in program in dependence on user's interaction ( the form of line will be generated in onTouchEvent - ACTION_MOVE ).

Can i generate this effect without xml files or drawing premaid bitmap ?

score 73 · Accepted Answer · edited Feb 15 '17 at 18:42

73

I imitate this effect in this way :

Draw line with BlurMaskFilter;
Draw over it normal line.

I use Path class to generate line and save coordinates of MOVE_ACTION event to generate only part of path what i need.

Create 2 Paint()s:

_paintSimple = new Paint();
_paintSimple.setAntiAlias(true);
_paintSimple.setDither(true);
_paintSimple.setColor(Color.argb(248, 255, 255, 255));
_paintSimple.setStrokeWidth(20f);
_paintSimple.setStyle(Paint.Style.STROKE);
_paintSimple.setStrokeJoin(Paint.Join.ROUND);
_paintSimple.setStrokeCap(Paint.Cap.ROUND);

_paintBlur = new Paint();
_paintBlur.set(_paintSimple);
_paintBlur.setColor(Color.argb(235, 74, 138, 255));
_paintBlur.setStrokeWidth(30f);
_paintBlur.setMaskFilter(new BlurMaskFilter(15, BlurMaskFilter.Blur.NORMAL));

And draw twice my Path():

@Override
protected void onDraw(Canvas canvas) {
    canvas.drawPath(mPath, _paintBlur);
    canvas.drawPath(mPath, _paintSimple);
}

edited Feb 15 '17 at 18:42

stkent

19,772
14
85
111

answered Jun 10 '11 at 08:37

sharl

1,257
1
12
17

what is **mPath** ?? i did new var. with same name Path mPath = new Path(); no Change ! – Realbitt Jun 22 '13 at 08:15
mPath would be the path object that you use to build the line to draw. You can add points to the path (points where the user has touched) and then draw the path. – Sababado Sep 20 '13 at 14:47
2

Be aware of this: http://stackoverflow.com/questions/11281404/android-blurmaskfilter-has-no-effect-in-canvas-drawoval-while-text-is-blurred – seb Feb 19 '14 at 23:07
3

This works only when hardware acceleration is disabled, use `setLayerType(View.LAYER_TYPE_SOFTWARE, null)` on your view to do so. – Tom Mar 22 '16 at 21:40
As @Tom said, the layerType must be set. This can also be achieved by setting android:layerType="software" in XML. – MisseMask Nov 01 '19 at 10:56
Perfect Answer. – M Shaban Ali Oct 15 '20 at 09:06

Dynamically generated line with glow effective

1 Answers1

Linked