how to extend BorderSide to make gradient border

I'm trying to add gradient to border by extending "Border Side" class as so:

class GradientBorderSide extends BorderSide {
  const GradientBorderSide(
      {this.color = const Color(0x00000000),
      this.width = 1.0,
      this.style = BorderStyle.solid,
      this.gradient =
          const LinearGradient(colors: [Colors.black, Colors.white])})
      : super(color: color, width: width, style: style);

  final Gradient gradient;
  final Color color;
  final double width;
  final BorderStyle style;

  @override
  Paint toPaint() {
    switch (style) {
      case BorderStyle.solid:
        return Paint()
          ..strokeWidth = width
          ..style = PaintingStyle.stroke
          ..shader = gradient.createShader(Rect.fromCenter(
              center: Offset.zero, width: width, height: width));
      case BorderStyle.none:
        return Paint()
          ..color = const Color(0x00000000)
          ..strokeWidth = 0.0
          ..style = PaintingStyle.stroke;
    }
    return null;
  }
}

then apply it to a button:

SizedBox(
                  width: 75,
                  height: 75,
                  child: RaisedButton(
                    onPressed: () {},
                    shape: CircleBorder(
                      //borderRadius: BorderRadius.circular(5),
                      side: GradientBorderSide(
                          width: 10,
                          gradient: LinearGradient(
                            begin: Alignment.topLeft,
                            end: Alignment(0.5, .05),
                            colors: [Colors.red, Colors.orange],
                            tileMode: TileMode.repeated,
                          )),
                    ),
                  ),
                )

the gradient appears good But when the button is pressed gradient disappears and border color shows if it has a color then gradient reappears.