ClipPath 路径裁剪

可容纳一个子组件，并将其按指定路径进行裁剪。可以自定义路径形状，是一个很灵活的裁剪组件。

相关组件

ClipOval ClipRect ClipRRect

ClipPath基本使用

   <br />【child】 : 子组件   【Widget】<br />【clipBehavior】 : 裁剪行为   【Clip】<br />【clipper】 : 裁剪器   【CustomClipper<Path>】<br />![image.png](https://cdn.nlark.com/yuque/0/2020/png/326147/1589461393066-bda6d7f0-0761-4c4f-a212-21eda22839f8.png#align=left&display=inline&height=136&margin=%5Bobject%20Object%5D&name=image.png&originHeight=272&originWidth=772&size=73820&status=done&style=none&width=386)

import 'dart:math';
import 'package:flutter/material.dart';
class CustomClipPath extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return ClipPath(
      clipper: ShapeBorderClipper(shape: _StarShapeBorder()),
      child: Image.asset(
        "assets/images/wy_300x200.jpg",
        width: 150,
        height: 100,
        fit: BoxFit.cover,
      ),
    );
  }
}

class _StarShapeBorder extends ShapeBorder {
  final Path _path = Path();

  @override
  EdgeInsetsGeometry get dimensions => null;

  @override
  Path getInnerPath(Rect rect, {TextDirection textDirection}) {
    return null;
  }

  @override
  Path getOuterPath(Rect rect, {TextDirection textDirection}) =>
      nStarPath(20, rect.height / 2, rect.height / 2 * 0.85,
          dx: rect.width / 2, dy: rect.height / 2);

  @override
  void paint(Canvas canvas, Rect rect, {TextDirection textDirection}) {}

  Path nStarPath(int num, double R, double r, {dx = 0, dy = 0}) {
    double perRad = 2 * pi / num;
    double radA = perRad / 2 / 2;
    double radB = 2 * pi / (num - 1) / 2 - radA / 2 + radA;
    _path.moveTo(cos(radA) * R + dx, -sin(radA) * R + dy);
    for (int i = 0; i < num; i++) {
      _path.lineTo(
          cos(radA + perRad * i) * R + dx, -sin(radA + perRad * i) * R + dy);
      _path.lineTo(
          cos(radB + perRad * i) * r + dx, -sin(radB + perRad * i) * r + dy);
    }
    _path.close();
    return _path;
  }

  @override
  ShapeBorder scale(double t) {
    return null;
  }
}