title: Flutter - How to make a reusable button change its image and color?
body: <p>I have a button that I can use on multiple different pages. I want to be able to change the image and fill the OutlineButton with a color when it's pressed. How can this be accomplished?</p>
  
  <pre><code>class BackArrowButton extends StatelessWidget {
    final Widget child;
    final GestureTapCallback onPressed;
    BackArrowButton({@required this.onPressed, this.child});
  
    @override
    Widget build(BuildContext context) {
      return OutlineButton(
        padding: const EdgeInsets.all(15.0),
        child: child,
        borderSide: BorderSide(width: 1.0, color: Color(0xff1A1A1A)),
        highlightElevation: 0.0,
        highlightedBorderColor: Color(0xFF1A1A1A),
        splashColor: Color(0x1F1A1A1A),
        shape: CircleBorder(),
        onPressed: onPressed,
      );
    }
  </code></pre>
  
  <p>This is what I call on multiple pages to show the button. </p>
  
  <pre><code>BackArrowButton(
    child: ClipOval(
      child: Container(
        child: Image.asset(
          'assets/images/icons/arrow_back.png',
        ),
      ),
    ),
    onPressed: () {
      Navigator.pop(context, '/home');
    },
  ),
  </code></pre>