Skip to content

Instantly share code, notes, and snippets.

@RockinPaul
Last active February 1, 2022 03:09
Show Gist options
  • Save RockinPaul/f1b05c37f1ba6d0cd992e5df6379ac90 to your computer and use it in GitHub Desktop.
Save RockinPaul/f1b05c37f1ba6d0cd992e5df6379ac90 to your computer and use it in GitHub Desktop.
import 'package:flutter/material.dart';
class Example extends StatelessWidget {
const Example({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
final colorScheme = Theme.of(context).colorScheme;
return Scaffold(
backgroundColor: colorScheme.primaryContainer,
body: ClipPath(
clipper: CustomPathClipper(),
child: Container(color: colorScheme.surface),
),
);
}
}
class CustomPathClipper extends CustomClipper<Path> {
@override
Path getClip(Size size) {
final roundnessFactor = 50.0;
final path = Path();
path.moveTo(0, size.height * 0.33);
path.lineTo(0, size.height - roundnessFactor);
path.quadraticBezierTo(0, size.height, roundnessFactor, size.height);
path.lineTo(size.width - roundnessFactor, size.height);
path.quadraticBezierTo(
size.width, size.height, size.width, size.height - roundnessFactor);
path.lineTo(size.width, roundnessFactor * 2);
path.quadraticBezierTo(size.width - 10, roundnessFactor,
size.width - roundnessFactor * 1.5, roundnessFactor * 1.5);
path.lineTo(
roundnessFactor * 0.6, size.height * 0.33 - roundnessFactor * 0.3);
path.quadraticBezierTo(
0, size.height * 0.33, 0, size.height * 0.33 + roundnessFactor);
// For sharp corners.
// final heightFactor = 100.0;
// final path = Path();
// path.moveTo(0, size.height);
// path.lineTo(0, heightFactor);
// path.lineTo(size.width, 0);
// path.lineTo(size.width, size.height);
// Mirrored option.
// path.moveTo(0, size.height);
// path.lineTo(0, 0);
// path.lineTo(size.width, heightFactor);
// path.lineTo(size.width, size.height);
return path;
}
@override
bool shouldReclip(covariant CustomClipper oldClipper) => false;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment