flutter-template icon indicating copy to clipboard operation
flutter-template copied to clipboard

Add `PrimaryButton` and `SecondaryButton`

Open nivisi opened this issue 3 years ago • 0 comments

These are pretty common and we recreate them almost on every project. Would be cool to have them in-place and to design them after we create a project from the template.

The most common parameters would be:

  • String text
  • VoidCallback onPressed
  • bool isEnabled
  • bool isLoading

As most of the time we will use preconfigured button sizes, paddings etc, we could create a named constructor .custom to be able to configure the following parameters:

  • double paddingVertical
  • double paddingHorizontal
  • Color backgroundColor
  • Color foregroundColor
  • TextStyle textStyle

And also a constructor for a custom child, if we ever need to use sth like an icon, e.g. withChild

So the interface is the following. Same for SecondaryButton.

final defaultButton = PrimaryButton(
    String text, {
    VoidCallback? onPressed,
    bool isEnabled = true,
    bool isLoading = false,
  }
);

final defaultButtonWithChild = PrimaryButton.withChild(
  {
    VoidCallback? onPressed,
    bool isEnabled = true,
    bool isLoading = false,
    required Widget child,
  }
);

final customButton = PrimaryButton.custom(
    String text, {
    VoidCallback? onPressed,
    bool isEnabled = true,
    bool isLoading = false,
    TextStyle? textStyle,
    double paddingVertical = 4.0, // or whatever
    double paddingHorizontal = 12.0, // or whatever
    Color? backgroundColor, // in the build method, we will be able to use this custom color
    Color? foregroundColor,  // in the build method, we will be able to use this custom color
  }
);

final customButtonWithChild = PrimaryButton.customWithChild(
  {
    VoidCallback? onPressed,
    bool isEnabled = true,
    bool isLoading = false,
    TextStyle? textStyle,
    double paddingVertical = 4.0, // or whatever
    double paddingHorizontal = 12.0, // or whatever
    Color? backgroundColor, // in the build method, we will be able to use this custom color
    Color? foregroundColor, // in the build method, we will be able to use this custom color
    required Widget child,
  }
);

nivisi avatar Aug 01 '22 13:08 nivisi