Android Paint PathEffect ( 路径效果 ) 可以实现画虚线或者将路径的转角变得圆滑等效果

PathEffect 和 MaskFilter(面具) 与 ColorFilter(颜色滤镜) 一样，几乎没有可用的方法

但它定义了六个子类

• ComposePathEffect
• CornerPathEffect
• DashPathEffect
• DiscretePathEffect
• PathDashPathEffect
• SumPathEffect

CornerPathEffect 平滑夹脚效果

将 Path 的各个连接线段之间的夹角用一种更平滑的方式连接，类似于圆弧与切线的效果

CornerPathEffect(float radius)

参数说明

DashPathEffect 虚线效果

将 Path 的线段虚线化

DashPathEffect(float[] intervals, float phase)

参数说明

DiscretePathEffect 打散效果

打散 Path 的线段，使得在原来路径的基础上发生打散效果

DiscretePathEffect(float segmentLength, float deviation)

参数说明

PathDashPathEffect 路径填充

使用 Path 图形来填充当前的路径

PathDashPathEffect(Path shape, float advance, float phase, PathDashPathEffect.Style style)

参数说明

style 值说明

ComposePathEffect 组合效果

组合效果，会首先将 innerpe 变现出来，接着在 innerpe 的基础上来增加 outerpe 效果

ComposePathEffect(PathEffect outerpe, PathEffect innerpe)

SumPathEffect 叠加效果

叠加效果，和 ComposePathEffect 不同，在表现时会将两个参数的效果都独立的表现出来， 接着将两个效果简单的重叠在一起显示出来

SumPathEffect(PathEffect first, PathEffect second)

范例

我们一个 demo 来演示这几个子类各自所起的效果

1. 创建一个 空的 Android 项目 cn.twle.android.PathEffect

2. 自定义一个 View 类 MsView.java

   里面的线移动的效果是 phase 增加造成的，每次 + 2

   package cn.twle.android.patheffect;
   
   import android.content.Context;
   import android.graphics.Canvas;
   import android.graphics.Color;
   import android.graphics.ComposePathEffect;
   import android.graphics.CornerPathEffect;
   import android.graphics.DashPathEffect;
   import android.graphics.DiscretePathEffect;
   import android.graphics.Paint;
   import android.graphics.Path;
   import android.graphics.PathDashPathEffect;
   import android.graphics.PathEffect;
   import android.graphics.SumPathEffect;
   import android.util.AttributeSet;
   import android.view.View;
   
   public class MsView extends View {
   
       private Paint mPaint;
       private Path mPath;
       private float phase = 0;
       private PathEffect[] effects = new PathEffect[7];
       private int[] colors;
   
       public MsView(Context context) {
           this(context, null);
       }
   
       public MsView(Context context, AttributeSet attrs) {
           super(context, attrs);
           init();
       }
   
       public MsView(Context context, AttributeSet attrs, int defStyleAttr) {
           super(context, attrs, defStyleAttr);
       }
   
       //初始化画笔
       private void init() {
           mPaint = new Paint(Paint.ANTI_ALIAS_FLAG); //抗锯齿
           mPaint.setStyle(Paint.Style.STROKE);       //绘画风格:空心
           mPaint.setStrokeWidth(5);                  //笔触粗细
           mPath = new Path();
           mPath.moveTo(0, 0);
           for (int i = 1; i <= 15; i++) {
               // 生成15个点，随机生成它们的坐标，并将它们连成一条Path
               mPath.lineTo(i * 40, (float) Math.random() * 100);
           }
           // 初始化7个颜色
           colors = new int[] { Color.RED, Color.BLUE, Color.GREEN,
                   Color.YELLOW, Color.BLACK, Color.MAGENTA, Color.CYAN };
       }
   
       @Override
       protected void onDraw(Canvas canvas) {
           canvas.drawColor(Color.WHITE);
           //初始化其中路径效果：
           effects[0] = null;                                    //无效果
           effects[1] = new CornerPathEffect(10);                //CornerPathEffect
           effects[2] = new DiscretePathEffect(3.0f, 5.0f);      //DiscretePathEffect
           effects[3] = new DashPathEffect(new float[] { 20, 10, 5, 10 },phase);   //DashPathEffect
           Path p = new Path();
           p.addRect(0, 0, 8, 8, Path.Direction.CCW);
           effects[4] = new PathDashPathEffect(p, 12, phase,
                   PathDashPathEffect.Style.ROTATE);             //PathDashPathEffect
           effects[5] = new ComposePathEffect(effects[2], effects[4]);    //ComposePathEffect
           effects[6] = new SumPathEffect(effects[2], effects[4]);   //SumPathEffect
           // 将画布移动到(10,10)处开始绘制
           canvas.translate(10, 10);
           // 依次使用7中不同的路径效果、7中不同的颜色来绘制路径
           for (int i = 0; i < effects.length; i++) {
               mPaint.setPathEffect(effects[i]);
               mPaint.setColor(colors[i]);
               canvas.drawPath(mPath, mPaint);
               canvas.translate(0, 60);
           }
           // 改变phase值，形成动画效果
           phase += 2;
           invalidate();
       }
   }
   

3. 修改 MainActivity.java 设置 setContentView(new MsView(MainActivity.this))

   package cn.twle.android.patheffect;
   
   import android.support.v7.app.AppCompatActivity;
   import android.os.Bundle;
   
   public class MainActivity extends AppCompatActivity {
   
       @Override
       protected void onCreate(Bundle savedInstanceState) {
           super.onCreate(savedInstanceState);
           setContentView(new MsView(MainActivity.this));
       }
   }
   

参考文档

1. 官方 API 文档： PathEffect