import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';

class ClipLogin20 extends StatefulWidget {
  const ClipLogin20({Key? key}) : super(key: key);

  @override
  State<ClipLogin20> createState() => _ClipLogin20State();
}

class _ClipLogin20State extends State<ClipLogin20> {

  @override
  Widget build(BuildContext context) {
    Size screenSize=MediaQuery.of(context).size;
    const myColor=Colors.deepOrange;
    return Scaffold(
      backgroundColor: myColor,
      body: SingleChildScrollView(
        child: Stack(
            children:
            [
              CustomPaint(
                painter: _ClipShadowPainter(
                  clipper: WaveClipper(),
                  shadow: const Shadow(
                      color: Colors.grey,
                      offset: Offset(0, 0),
                      blurRadius: 5),

                ),
                child: ClipPath(child: Container(width: screenSize.width, height: screenSize.height,color: Colors.black,) ,

                    clipper: WaveClipper()),
              ),

              Container(
                alignment: Alignment.topLeft,
                margin: EdgeInsets.only(top: screenSize.height*.2,left: 40),
                child: const Text('Sign In',style: TextStyle(
                    fontSize: 40,color: myColor,
                ),
                ),
              ),
              Padding(
                padding: EdgeInsets.only(top: screenSize.height*.45,left: 40,right: 60),
                child: Column(
                  children: [

                    TextFormField(
                      style: const TextStyle(color: myColor,fontSize: 25),
                      decoration: const InputDecoration(
                          hintText: "Email",
                        hintStyle: TextStyle(color: Colors.white)
                      ),
                    ),
                    const SizedBox(height: 15,),
                    TextFormField(
                      obscureText: true,
                      style: const TextStyle(color: myColor,fontSize: 25),
                      decoration: const InputDecoration(
                          hintText: "Password",
                          hintStyle: TextStyle(color: Colors.white)
                      ),
                    ),
                    Container(
                      margin: const EdgeInsets.only(top: 20),
                      alignment: Alignment.centerRight,
                      child: const Text('Forgot Password?',style: TextStyle(color: Colors.white,fontSize: 18),),
                    ),
                    const SizedBox(height: 15,),
                    ElevatedButton(
                      onPressed: (){},
                      style: ElevatedButton.styleFrom(
                          padding: const EdgeInsets.symmetric(vertical: 15,horizontal: 60),
                          backgroundColor: Colors.black
                      ),
                      child: const Text("Sign In",style: TextStyle(
                          color: Colors.white,
                          fontSize: 25,
                          fontWeight: FontWeight.bold),),
                    ),
                    const SizedBox(height: 10,),
                    const Text("Don't have an account?",style: TextStyle(color: Colors.white),),
                    const Text('Register',style: TextStyle(
                        color: Colors.white,
                        fontSize: 18,
                        decoration: TextDecoration.underline),)


                  ],
                ),



              )


            ]
        ),
      ),
    );
  }
}

class _ClipShadowPainter extends CustomPainter {
  final Shadow shadow;
  final CustomClipper<Path> clipper;

  _ClipShadowPainter({required this.shadow, required this.clipper});

  @override
  void paint(Canvas canvas, Size size) {
    var paint = shadow.toPaint();
    var clipPath = clipper.getClip(size).shift(shadow.offset);
    canvas.drawPath(clipPath, paint);
  }

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

class WaveClipper extends CustomClipper<Path>{
  @override
  Path getClip(Size size) {
    Path path =Path();
    path.moveTo(0, size.height*.1);
    path.lineTo(0, size.height*0.4);
    path.quadraticBezierTo(size.width*.2, size.height*0.5, size.width*.5, size.height*.32);
    path.quadraticBezierTo(size.width*.7, size.height*.2, size.width, size.height*.3);
    path.lineTo (size.width,size.height*.1);
    path.quadraticBezierTo(size.width*.8, size.height*.2, size.width*.85,0);
    path.lineTo (size.width*.7,0);
    path.quadraticBezierTo(size.width*.6, size.height*.1, size.width*.5,size.height*.05);
    path.quadraticBezierTo(size.width*.4, 0, size.width*.3,size.height*.05);
    path.quadraticBezierTo(size.width*.4, 0, size.width*.3,size.height*.05);
    path.quadraticBezierTo(size.width*.2, size.height*.1, size.width*.1,size.height*.07);
    path.quadraticBezierTo(size.width*.02, size.height*.04, 0,size.height*.1);
    return path;
  }

  @override
  bool shouldReclip(covariant CustomClipper<Path> oldClipper) {

    return true;
  }

}