main.dart

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


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


//MAIN APP
class App extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: Home(),
    );
  }
}


//HOME
class Home extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    
    return Scaffold(
      
      body: Center(child:Text("My App")),
      bottomSheet: Footer(
        footerHeight: 240,
        child:  Center(
          child: Align( 
            alignment: Alignment.bottomCenter,
            child: Container(
              child: Padding(
              padding: EdgeInsets.symmetric(vertical: 40.0),
              child: RichText(
              text: TextSpan(
              children: <InlineSpan>[
                StyledText.normal("Not a member yet? ", Colors.white),
                StyledText.hyperlink("Register", Colors.white, onPressed: () {
                  ScaffoldMessenger.of(context).showSnackBar(SnackBar(content: Text("Register!!!")));
                }),
                StyledText.normal(" today.", Colors.white)
              ]
              )
              )
            )
            )
          )
        ),
        
      
      ),
    );
  }
}


//FOOTER
class Footer extends StatelessWidget {
   final double footerHeight;
   final double pivot;
   final double margin = 10;
   final double firstBarHeight;
   final Color firstBarColor;
   final Color secondBarColor;
   final Widget child;
  
  Footer({
    this.firstBarColor = const Color(0xffdc1f41), 
    this.secondBarColor = const Color(0xff142c52),
    this.pivot = 60,
    this.footerHeight = 240,
    this.firstBarHeight = 20,
    this.child = const Center()
  });
  
  @override
  Widget build(context) {
    final size = MediaQuery.of(context).size;
    
    return Stack(
    children: [
      ClipPath(
        child: Container(
        width: size.width,
        height: footerHeight,
        color: firstBarColor
      ),
        clipper: FooterClipper(builder: firstBarBuilder)
        ),
      ClipPath(
      child: Container(
        width: size.width,
        height: footerHeight,
        color: secondBarColor,
        child: child
        ),
        clipper: FooterClipper(builder: secondBarBuilder)
      )
    ]
    );
  }
  
   List<Offset> secondBarBuilder(Size size) {
    final topLeft = Offset(0, pivot + firstBarHeight + margin);
    final bottomLeft = Offset(0, footerHeight);
    final bottomRight = Offset(size.width, footerHeight);
    final topRight = Offset(size.width, firstBarHeight + margin);
    
    return [topLeft, bottomLeft, bottomRight, topRight];
  }
  
  List<Offset> firstBarBuilder(Size size) {
    final topLeft = Offset(0, pivot );
    final bottomLeft = Offset(0, pivot + firstBarHeight);
    final bottomRight = Offset(size.width, firstBarHeight);
    final topRight = Offset(size.width, 0);
    
    return [topLeft, bottomLeft, bottomRight, topRight];
  }
}


//CUSTOM CLIPPER FOR FOOTER
class FooterClipper extends CustomClipper<Path> {
  final Function builder;
  
  FooterClipper({required this.builder});
  
  @override
  Path getClip(Size size) {
    Path path = Path();
    path.addPolygon(builder(size), true);
    return path;
  }
  @override bool shouldReclip(CustomClipper<Path> clipper) => false;
}


//TEXT & HYPERLINK
class StyledText {
  static InlineSpan normal(String text, Color color, {TextStyle? style}) {
    late TextStyle _style = _styleFrom(style);
    
    return TextSpan(
      text: text,
      style: TextStyle(
        fontSize: _style.fontSize,
        color: color,
      )
    );
  }
  
  static TextStyle _styleFrom(TextStyle? style) {
    return style != null ? style : TextStyle();
  }
  
  static Function? _onHyperLinkPressed;
  
  static InlineSpan hyperlink(String text, Color color, {TextStyle? style, Function? onPressed}) {
    _onHyperLinkPressed = onPressed;
    late TextStyle _style = _styleFrom(style);
    
    return MouseRegionSpan(
      mouseCursor: SystemMouseCursors.click,
      inlineSpan: TextSpan(
      text: text,
      style: TextStyle(
        fontWeight: FontWeight.bold,
        fontSize: _style.fontSize,
        color: color,
        decoration: TextDecoration.underline
      ),
      recognizer: TapGestureRecognizer()..onTap = () => _onHyperLinkPressed!()                               
    )
    ) ;
  }
}


//MOUSE GESTURES FOR HYPERLINKS
class MouseRegionSpan extends WidgetSpan {
  MouseRegionSpan({
    required MouseCursor mouseCursor,
    required InlineSpan inlineSpan,
  }) : super(
          child: MouseRegion(
            cursor: mouseCursor,
            child: Text.rich(
              inlineSpan,
            ),
          ),
        );
}