How to set Gradient Background on ElevetedButton in Flutter

DecoratedBox(
    decoration: BoxDecoration(
          gradient: LinearGradient(
            colors: [
              Colors.blueAccent, 
              Colors.redAccent,
              Colors.purpleAccent
              //add more colors
            ]),
          borderRadius: BorderRadius.circular(5),
          boxShadow: <BoxShadow>[
            BoxShadow(
                color: Color.fromRGBO(0, 0, 0, 0.57), //shadow for button
                blurRadius: 5) //blur radius of shadow
          ]
      ),
    child:ElevatedButton(
      style: ElevatedButton.styleFrom(
          primary: Colors.transparent,
          onSurface: Colors.transparent,
          shadowColor: Colors.transparent,
          //make color or elevated button transparent
      ),

      onPressed: (){
          print("You pressed Elevated Button");
      }, 
      child: Padding(
        padding:EdgeInsets.only(
          top: 18,
          bottom: 18,
        ),
        child:Text("Press This Button"),
      )
    )  
)

import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget{
  @override
  Widget build(BuildContext context) {
     return MaterialApp(
         home: Home()
      );
  }
}

class Home extends  StatefulWidget {
  @override
  State<Home> createState() => _HomeState();
}

class _HomeState extends State<Home> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
         appBar: AppBar(
            title: Text("Gradient Background on ElevatedButton"),
            backgroundColor: Colors.redAccent
         ),
          body: Container(
            alignment: Alignment.center,
            padding: EdgeInsets.all(50),
             child: Column(
                children: [ 

                    DecoratedBox(
                        decoration: BoxDecoration(
                             gradient: LinearGradient(
                               colors: [
                                  Colors.blueAccent, 
                                  Colors.redAccent,
                                  Colors.purpleAccent
                                  //add more colors
                                ]),
                              borderRadius: BorderRadius.circular(5),
                              boxShadow: <BoxShadow>[
                                BoxShadow(
                                    color: Color.fromRGBO(0, 0, 0, 0.57), //shadow for button
                                    blurRadius: 5) //blur radius of shadow
                              ]
                         ),
                        child:ElevatedButton(
                          style: ElevatedButton.styleFrom(
                             primary: Colors.transparent,
                             onSurface: Colors.transparent,
                             shadowColor: Colors.transparent,
                             //make color or elevated button transparent
                          ),

                          onPressed: (){
                              print("You pressed Elevated Button");
                          }, 
                          child: Padding(
                            padding:EdgeInsets.only(
                              top: 18,
                              bottom: 18,
                            ),
                            child:Text("Press This Button"),
                          )
                        )  
                    )  

                ]
              )
          )
    );
  } 
}