如何在Flutter中制作具有渐变背景的ElevatedButton？

在Flutter中制作具有渐变背景的ElevatedButton，可以通过自定义ElevatedButton的style来实现。以下是一个示例代码：

import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('Gradient ElevatedButton Example'),
        ),
        body: Center(
          child: GradientElevatedButton(),
        ),
      ),
    );
  }
}

class GradientElevatedButton extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return ElevatedButton(
      onPressed: () {
        print('Button pressed!');
      },
      child: Text('Gradient Button'),
      style: ElevatedButton.styleFrom(
        primary: Colors.transparent,
        onPrimary: Colors.white,
        shape: RoundedRectangleBorder(
          borderRadius: BorderRadius.circular(10),
        ),
      ),
      padding: EdgeInsets.symmetric(horizontal: 24, vertical: 12),
      visualDensity: VisualDensity.standard,
      elevation: 0,
      backgroundColor: Colors.transparent,
      splashColor: Colors.grey.withOpacity(0.2),
      shape: RoundedRectangleBorder(
        borderRadius: BorderRadius.circular(10),
      ),
      clipBehavior: Clip.antiAlias,
      child: Container(
        decoration: BoxDecoration(
          gradient: LinearGradient(
            colors: [
              Colors.blue.withOpacity(0.7),
              Colors.blue.withOpacity(0.3),
            ],
            begin: Alignment.topLeft,
            end: Alignment.bottomRight,
          ),
        ),
        padding: EdgeInsets.symmetric(horizontal: 20, vertical: 10),
        child: Text(
          'Gradient Button',
          style: TextStyle(
            color: Colors.white,
            fontSize: 16,
          ),
        ),
      ),
    );
  }
}