I am trying to get more into Flutter.

I have a button class that either builds a FlatButton or an OutlineButton depending on a parameter

import 'package:flutter/material.dart';

class Button extends StatelessWidget {
  final String text;
  final VoidCallback onPressed;
  final Color backgroundColor;
  final Color textColor;
  final bool isOutline;

  Button(
      {@required this.text,
      @required this.onPressed,
      this.backgroundColor = Colors.deepOrange,
      this.textColor = Colors.white,
      this.isOutline = false});

  @override
  Widget build(BuildContext context) {
    return this.isOutline
        ? _buildOutlineButton(context)
        : _buildFlatButton(context);
  }

  FlatButton _buildFlatButton(BuildContext context) {
    return FlatButton(
      shape: RoundedRectangleBorder(
        borderRadius: BorderRadius.circular(30.0),
      ),
      color: this.backgroundColor,
      onPressed: this.onPressed,
      child: Container(
        padding: const EdgeInsets.symmetric(
          vertical: 20.0,
          horizontal: 20.0,
        ),
        child: Row(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Expanded(
              child: Text(
                this.text,
                textAlign: TextAlign.center,
                style:
                    TextStyle(color: this.textColor, fontWeight: FontWeight.bold),
              ),
            ),
          ],
        ),
      ),
    );
  }

  OutlineButton _buildOutlineButton(BuildContext context) {
    return OutlineButton(
      shape: RoundedRectangleBorder(
        borderRadius: BorderRadius.circular(30.0),
      ),
      color: this.backgroundColor,
      onPressed: this.onPressed,
      child: Container(
        padding: const EdgeInsets.symmetric(
          vertical: 20.0,
          horizontal: 20.0,
        ),
        child: Row(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Expanded(
              child: Text(
                this.text,
                textAlign: TextAlign.center,
                style:
                    TextStyle(color: this.textColor, fontWeight: FontWeight.bold),
              ),
            ),
          ],
        ),
      ),
    );
  }
}

As you can see, both _build*Button functions look similar. Is there a way to simply the code? Something like that (pseudo-code ahead):

final type = this.isOutline ? OutlineButton : FlatButton;
return type(shape: ..., color: ..., ...);


Solution 1: Richard Heap

You can share much of the common code like this:

  MaterialButton _buildButton(bool flat, BuildContext context) {
    Container container = Container(
      padding: const EdgeInsets.symmetric(
        vertical: 20.0,
        horizontal: 20.0,
      ),
      child: Row(
        mainAxisAlignment: MainAxisAlignment.center,
        children: <Widget>[
          Expanded(
            child: Text(
              text,
              textAlign: TextAlign.center,
              style: TextStyle(color: textColor, fontWeight: FontWeight.bold),
            ),
          ),
        ],
      ),
    );
    RoundedRectangleBorder border = RoundedRectangleBorder(
      borderRadius: BorderRadius.circular(30.0),
    );
    return flat
        ? FlatButton(
            shape: border,
            color: backgroundColor,
            onPressed: onPressed,
            child: container,
          )
        : RaisedButton(
            shape: border,
            color: backgroundColor,
            onPressed: onPressed,
            child: container,
          );
  }