flutter-sport/lib/widgets/button_cancel.dart

import 'package:flutter/material.dart';

class CancelButton extends StatelessWidget {
  final VoidCallback callback;
  final String content;
  final double width;
  final double height;
  final double fontSize;
  final Color backgroundColor;
  final Color textColor;
  final Key? key;

  CancelButton({
    required this.callback,
    required this.content,
    this.backgroundColor = const Color(0xffF1F1F1),
    this.textColor = const Color(0xff666666),
    this.width = double.infinity,
    this.height = 35,
    this.fontSize = 28, this.key,
  });

  @override
  Widget build(BuildContext context) {
    return Container(
      width: width,
      height: height,
      child: TextButton(
        onPressed: this.callback,
        style: ButtonStyle(
            padding: MaterialStateProperty.all(EdgeInsets.zero),
            backgroundColor: MaterialStateProperty.all(backgroundColor),
            overlayColor: MaterialStateProperty.all(const Color(0xffD1D1D1)),
            shape: MaterialStateProperty.all(StadiumBorder())),
        child: Text(
          "$content",
          style: Theme.of(context).textTheme.bodyText2?.copyWith(color: textColor),
        ),
      ),
    );
  }
}

class FeelCancelButton extends StatelessWidget {
  final VoidCallback callback;
  final String content;
  final double width;
  final double height;
  final double fontSize;
  final Color color;
  final Color borderColor;
  final Color textColor;

  static const finalColor = Color(0xffffffff);
  static const finalBorderColor = Color(0xFFFFC400);
  static const finalTextColor = Color(0xFFFFC400);

  FeelCancelButton({required this.callback, required this.content, this.width = double.infinity, this.height = 44, this.fontSize = 28, this.color = finalColor, this.textColor = finalTextColor, this.borderColor = finalBorderColor});

  @override
  Widget build(BuildContext context) {
    return InkWell(
      onTap: this.callback,
      child: Container(
        width: width,
        height: height,
        decoration: BoxDecoration(
          color: color,
          borderRadius: BorderRadius.all(Radius.circular(100)),
          border: Border.all(
            color: finalBorderColor,
            width: .5,
          ),
        ),
        child: Container(
          alignment: Alignment.center,
          child: Text(
            content,
            style: TextStyle(color: textColor, fontSize: 14),
          ),
        ),
      ),
    );
  }
}