title: Flutter button with gradient when pressed for it's highlight colour
body: <p>I have a button with a gradient colour so I want the gradient to reverse when it's pressed and then when the press is released for the gradient colour to go back to how it was when it started.</p>
  
  <p>I have the gradient colours in an array so can be easily swapped but not sure how this can be done. I did this effect with React Native previously so am wondering how to do it with Flutter.</p>
  
  <p>At the moment it's just using one colour with <code>highlightColor</code> when pressed but this looks too basic.</p>
  
  <pre><code> const gradientcolours = [
    [Color(0xFF00000), Color(0xFFFFFFF)],
    [Color(0xFFFFFFF), Color(0xFF00000)]
  ];
  
      return Container(
        padding: EdgeInsets.all(20),
        decoration: BoxDecoration(
          borderRadius: BorderRadius.circular(60),
        ),
        child: Container(
          padding: EdgeInsets.all(2),
          decoration: BoxDecoration(
            borderRadius: BorderRadius.circular(60),
            gradient: LinearGradient(
                begin: Alignment.topCenter, end: Alignment.bottomCenter, colors: gradientcolours[0]),
          ),
          child: RawMaterialButton(
            splashColor: Color(0xFF030303),
            highlightColor: Color(0xFF030303),
            child: Text('Press'),
              child: Container(
                height: 40,
                width: 40,
              ),
            ),
            onPressed: onPressed,
            constraints: BoxConstraints.tightFor(
              width: 80,
              height: 80,
            ),
            shape: CircleBorder(),
          ),
        ),
      );
  </code></pre>