背景半弧形界面绘制

效果图：

screen.png

利用flutter canvas绘制

class FindCarOwnerPage extends BaseStatefulView<FindCarOwnerPage, FindCarOwnerPageViewModel> {
  @override
  FindCarOwnerPageViewModel createVM() => FindCarOwnerPageViewModel(this, FindCarOwnerPageModel());

  @override
  Widget createView(BuildContext context) {
    return Scaffold(
      appBar: NormalAppBar.create2(context, "找车主"),
      body: ChangeNotifierProvider.value(
        value: vm,
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Stack(
              children: [
                Container(
                  height: 35.w,
                  width: double.infinity,
                  child: CustomPaint(painter: TopArcBackground()),
                )
              ],
            )
          ],
        ),
      ),
    );
  }
}

///绘制部分代码
class TopArcBackground extends CustomPainter {
  @override
  void paint(Canvas canvas, Size size) {
    var paint = Paint()
      ..isAntiAlias = true
      ..strokeWidth = 0.0
      ..color = AppColor.primary
      ..invertColors = false;

    Path _path = Path();
    _path.moveTo(0, size.height - 25.w);
    _path.quadraticBezierTo(size.width / 2, size.height, size.width, size.height -  25.w);
    canvas.drawPath(_path, paint);
  }

  @override
  bool shouldRepaint(covariant CustomPainter oldDelegate) {
    return null;
  }
}