Google Android PathEffect
始于初见
PathEffect is the base class for objects in the Paint that affect the geometry of a drawing primitive before it is transformed by the canvas' matrix and drawn.
PathEffect是绘画中的对象的基类，这些对象在通过画布的矩阵进行变换和绘制之前会影响图形图元的几何图形。这大致就是官方文档中给出的解释。PathEffect 是一个基类，它的子类如下图：
1. DashPathEffect
构造方法
/**
* The intervals array must contain an even number of entries (>=2), with
* the even indices specifying the "on" intervals, and the odd indices
* specifying the "off" intervals. phase is an offset into the intervals
* array (mod the sum of all of the intervals). The intervals array
* controls the length of the dashes. The paint's strokeWidth controls the
* thickness of the dashes.
* Note: this patheffect only affects drawing with the paint's style is set
* to STROKE or FILL_AND_STROKE. It is ignored if the drawing is done with
* style == FILL.
* @param intervals array of ON and OFF distances
* @param phase offset into the intervals array
*/
public DashPathEffect(float intervals[], float phase)
注意事项
“ this patheffect only affects drawing with the paint's style is set ”
DashPathEffect 的效果只在画笔的 style 设置为 STROKE 或者 FILL_AND_STROKE 时生效。
参数说明
- intervals
数组长度必须是偶数并且大于等于2，偶数下标对应值控制虚线路径中实线线段的长度，奇数下标对应值控制实线与实线之间的间隔长度。
- phase
相位，控制虚线起始位置。UI呈现上分析 phase > 0 是将虚线路径向左或者向上移。反之 phase < 0，则向右或者向下移。
使用示例
DashPathEffect dashPathEffect = new DashPathEffect(new float[]{60, 60}, 0);
mPaint.setPathEffect(dashPathEffect);
mPath.moveTo(0, mHeight / 10f);
mPath.lineTo(mWidth, mHeight / 10f);
canvas.drawPath(mPath, mPaint);
图例
2. PathDashPathEffect
构造方法
/**
* Dash the drawn path by stamping it with the specified shape. This only
* applies to drawings when the paint's style is STROKE or STROKE_AND_FILL.
* If the paint's style is FILL, then this effect is ignored. The paint's
* strokeWidth does not affect the results.
* @param shape The path to stamp along
* @param advance spacing between each stamp of shape
* @param phase amount to offset before the first shape is stamped
* @param style how to transform the shape at each position as it is stamped
*/
public PathDashPathEffect(Path shape, float advance, float phase, Style style)
注意事项
“ applies to drawings when the paint's style is STROKE or STROKE_AND_FILL. ”
PathDashPathEffect 的效果只在画笔的 style 设置为 STROKE 或者 FILL_AND_STROKE 时生效。
参数说明
- shape
DashPathEffect 绘制的是虚线，是线段。PathDashPathEffect 绘制的几何图形，是一个 path 。
- advance
步长，几何图形 shape 的间隔距离。
- phase
和 DashPathEffect 中的概念一致。
- style
几何图形shape的环绕方式
- TRANSLATE 平移，shape 环绕是只是平移。
- ROTATE 旋转，环绕时会有旋转。
- MORPH 变形，环绕时shape 会发生变形。
使用示例
PathDashPathEffect dashPathEffect8 = new PathDashPathEffect(path8, 80, 0, PathDashPathEffect.Style.TRANSLATE);
mPaint.setPathEffect(dashPathEffect8);
mPath.addRoundRect(0f, mHeight * 8.2f / 10f, mWidth, mHeight * 9.8f / 10f,40f,40f, Path.Direction.CW);
canvas.drawPath(mPath, mPaint);
图例
3. CornerPathEffectView
将几何图形的尖角处理成圆角
构造方法
/**
* Transforms geometries that are drawn (either STROKE or FILL styles) by
* replacing any sharp angles between line segments into rounded angles of
* the specified radius.
* @param radius Amount to round sharp angles between line segments.
*/
public CornerPathEffect(float radius)
注意事项
“ either STROKE or FILL styles. ”
CornerPathEffectView 的效果在画笔的 style 设置为 STROKE 或者 FILL 都会生效。
参数说明
- radius
尖角变成圆角时圆角的半径。
使用示例
CornerPathEffect cornerPathEffect4 = new CornerPathEffect(80);
mPaint.setPathEffect(cornerPathEffect4);
mPath.reset();
mPath.moveTo(mWidth / 8f, mHeight / 1.5f + 200);
mPath.lineTo(mWidth / 3f, mHeight / 1.3f + 200);
mPath.lineTo(mWidth - 40, mHeight / 1.8f + 200);
canvas.drawPath(mPath, mPaint);
图例
4. DiscretePathEffect
把规则图形的周边切成一定长度的线段，然后让它们随机离散拼接起来，变成不规则图形。
构造方法
/**
* Chop the path into lines of segmentLength, randomly deviating from the
* original path by deviation.
*/
public DiscretePathEffect(float segmentLength, float deviation)
参数说明
- segmentLength
切割的线段长度
- deviation
离散的程度，值越大越不规则。
使用示例
DiscretePathEffect discretePathEffect = new DiscretePathEffect(20f,10f);
mPaint.setPathEffect(discretePathEffect);
mPath.addRect(20f, 10f, mWidth - 20, mHeight / 10f, Path.Direction.CW);
canvas.drawPath(mPath, mPaint);
图例
5. SumPathEffect
将两种 PathEffect 效果，按顺序依次应用到一个几何图像上。
构造方法
/**
* Construct a PathEffect whose effect is to apply two effects, in sequence.
* (e.g. first(path) + second(path))
*/
public SumPathEffect(PathEffect first, PathEffect second)
图示
6. ComposePathEffectView
两个PathEffect，一个 outerpe，一个 innerpe，将 outerpe 和 innerpe 组成一个 PathEffect 应用到一个图像上。
构造方法
/**
* Construct a PathEffect whose effect is to apply first the inner effect
* and the the outer pathEffect (e.g. outer(inner(path))).
*/
public ComposePathEffect(PathEffect outerpe, PathEffect innerpe)
图示