oval shape flutter

main.dart

//import 'package:flutter/gestures.dart';
import 'package:flutter/material.dart';
import 'dart:math';

import 'package:flutter/physics.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
        title: 'StackOverflow',
        theme: ThemeData(
          primarySwatch: Colors.blue,
        ),
        home: Scaffold(body: Home()));
  }
}

class Home extends StatefulWidget {
  @override
  _SwipeButtonState createState() => _SwipeButtonState();
}

class _SwipeButtonState extends State<Home>
    with SingleTickerProviderStateMixin {
  late AnimationController _ac;

  //VelocityTracker _vt = VelocityTracker.withKind(PointerDeviceKind.touch);
  double minHeight = 0.0;
  double maxHeight = 1.0;
  double position = 2;
  double currentIndex = 2;
  List<int> items = [0, 1, 2, 3, 4, 5];
  double stepHeight = 100;
  final double fullSize = 300;

  @override
  void initState() {
    super.initState();
    _ac = AnimationController(
        vsync: this,
        duration: const Duration(milliseconds: 300),
        value: 0 //set the default panel state (i.e. set initial value of _ac)
        )
      ..addListener(() {
        currentIndex = position + _ac.value;
        setState(() {});
      });
  }

  @override
  Widget build(BuildContext context) {
    final mediaQuery = MediaQuery.of(context);
    maxHeight = mediaQuery.size.height - 100;
    final width = mediaQuery.size.width;

    //stepHeight = maxHeight / items.length;

//     return Stack(children: <Widget>[
//       ...items.asMap().entries.map((entry) {
//         double i = entry.key.toDouble();
//         int val = entry.value;

//         return Positioned(
//             left: (_ac.value * stepHeight) +
//                 ((position + i) * stepHeight) +
//                 (i > position ? _ac.value * fullSize : 0),
//             height: 100,
//             width: i == position ? ((_ac.value * (fullSize - 100)) + 100) : 100,
//             bottom: 0,
//             child: _gestureHandler(
//               child: Container(
//                   child: Center(child: Text("$val")),
//                   width: double.infinity,
//                   height: double.infinity,
//                   color: i % 2 == 0 ? Colors.blue : Colors.pink),
//             ));
//       }).toList()
//     ]);

    return Center(
        child: ClipPath(
            clipper: ClipPathClass(),
            child: Container(
                width: double.infinity, height: 100, color: Colors.black)));
  }
}

class ClipPathClass extends CustomClipper<Path> {
  @override
  Path getClip(Size size) {
    var path = Path();

    path.moveTo(0, size.height / 2);

    path.quadraticBezierTo(0, size.height, size.width / 2, size.height);

    path.quadraticBezierTo(
        size.width, size.height, size.width, size.height / 2);

    path.quadraticBezierTo(size.width, 0, size.width / 2, 0);

    path.quadraticBezierTo(0, size.height, 0, size.height / 2);

    path.close();

    return path;
  }

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