CustomClipper - Exemplo

custom_clipper_example.dart

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.deepPurple,
      ),
      home: HomePage(),
    );
  }
}


final String url = "https://mondrian.mashable.com/uploads%252Fstory%252Fthumbnail%252F96118%252F32ae32a7-787a-4b10-8e51-4cf9354fcab0.png%252F950x534.png?signature=cEaHVhzq8ibhhgolP1s0bBZQP4c=&source=https%3A%2F%2Fblueprint-api-production.s3.amazonaws.com";

class HomePage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("Clipper"),
      ),
      body: ClipPath(
        clipper: MyClipper(),
        child: Container(
          height: 400,
          decoration: BoxDecoration(
            color: Colors.red,
            image: DecorationImage(
              colorFilter: ColorFilter.mode(
                Colors.red.withOpacity(0.5),
                BlendMode.color
              ),
              fit: BoxFit.fitHeight,
              image: NetworkImage(url),
            )
          ),
        ),
      ),
    );
  }
}


class MyClipper extends CustomClipper<Path>{

  @override
  Path getClip(Size size) {
    Path p = Path();

    p.lineTo(0, size.height);
    p.lineTo(size.width, size.height-150);

    p.lineTo(size.width, 0);


    return p;
  }

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