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;

  CancelButton({
    @required this.callback,
    @required this.content,
    this.width = double.infinity,
    this.height = 44,
    this.fontSize = 28,
  });

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

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),
          ),
        ),
      ),
    );
  }
}