Flutter design wave quadraticBezierTo

Question

in this link we have solved design wave quadraticBezierTo, but that's half of wave quadraticBezierTo and i want to have full design like with this screen shot:

and now my question is how can we change this below code to have another half design on right side of that

this below class make this

class WaveClipperTwo extends CustomClipper<Path> {
  bool reverse;

  WaveClipperTwo({this.reverse = false});

  final int _coefficient = 16;
  double get _minStep => 1 / _coefficient;
  double get _preCenter => _minStep * (_coefficient / 2 - 1);
  double get _postCenter => _minStep * (_coefficient / 2 + 1);
  double get _preEnd => _minStep * (_coefficient - 2);

  @override
  Path getClip(Size size) {
    var path = Path();
    path.moveTo(0.0, 0.0);
    if(!reverse) {
      path.lineTo(0.0, size.height - 20.0);
      path.lineTo(size.width * _preCenter, size.height - 20.0);
      path.cubicTo(size.width/2, size.height - 20.0, size.width/2, size.height - 40.0, size.width * _postCenter, size.height - 40.0);
      path.lineTo(size.width * _preEnd, size.height - 40.0);
      path.quadraticBezierTo(size.width, size.height - 40.0, size.width, size.height - 20.0);
      path.lineTo(size.width, 0.0);
      path.close();
    }else{
      path.lineTo(0.0, 20);
      path.lineTo(size.width * _preCenter, 20.0);
      path.cubicTo(size.width/2, 20.0, size.width/2, 40.0, size.width * _postCenter, 40.0);
      path.lineTo(size.width * _preEnd, 40.0);
      path.quadraticBezierTo(size.width, 40, size.width, 20.0);
      path.lineTo(size.width, 0.0);
      path.close();
    }

    return path;
  }

  @override
  bool shouldReclip(CustomClipper<Path> oldClipper) => false;
}

Answer 1

Here you are:

Change innerWidth constant when you want to make middle part wider or narrower.

class TopFeedsWaveCurve extends CustomClipper<Path> {
  final double innerWidth = 100;
  final double innerHeight = 20; 
  final double topOffcet = 60;

  @override
  Path getClip(Size size) {
    var halfW = innerWidth / 2;
    var height = innerHeight + topOffcet;
    var path = Path()
      ..moveTo(0.0, 0.0)
      ..lineTo(0.0, topOffcet)
      ..lineTo(size.width / 2 - halfW - innerHeight, topOffcet)
      ..cubicTo(
        size.width / 2 - halfW,
        topOffcet,
        size.width / 2 - halfW,
        height,
        size.width / 2 - halfW + innerHeight,
        height,
      )
      ..lineTo(size.width / 2 + halfW - innerHeight, height)
      ..cubicTo(
        size.width / 2 + halfW,
        height,
        size.width / 2 + halfW,
        topOffcet,
        size.width / 2 + halfW + innerHeight,
        topOffcet,
      )
      ..lineTo(size.width, topOffcet)
      ..lineTo(size.width, 0);

    return path;
  }

  @override
  bool shouldReclip(CustomClipper<Path> oldClipper) => true;
}