用getOuterPath和ShapeBorder实现卡片周围的颤动裁剪

import 'package:flutter/material.dart';

class ShimmerClipper extends ShapeBorder {
  @override
  Path getOuterPath(Rect rect, {TextDirection? textDirection}) {
    final path = Path();
    final r = rect.deflate(20.0);

    // 实现颤动效果的路径绘制
    // ...

    return path;
  }

  @override
  EdgeInsetsGeometry get dimensions => EdgeInsets.zero;

  @override
  ShapeBorder? scale(double t) {
    return null;
  }

  @override
  void paint(Canvas canvas, Rect rect, {TextDirection? textDirection}) {
    // 绘制边框样式
    // ...
  }
}

class MyCard extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Container(
      width: 200,
      height: 200,
      decoration: BoxDecoration(
        color: Colors.white,
        border: Border.all(color: Colors.grey),
        shape: BoxShape.rectangle,
        borderRadius: BorderRadius.circular(10),
        boxShadow: [
          BoxShadow(
            color: Colors.grey.withOpacity(0.5),
            spreadRadius: 3,
            blurRadius: 7,
            offset: Offset(0, 3),
          ),
        ],
      ),
      child: Center(
        child: Text(
          'Card Content',
          style: TextStyle(fontSize: 16),
        ),
      ),
    );
  }
}

void main() {
  runApp(MaterialApp(
    home: Scaffold(
      appBar: AppBar(
        title: Text('Flutter Card'),
      ),
      body: Center(
        child: Container(
          width: 200,
          height: 200,
          child: ClipPath(
            clipper: ShimmerClipper(),
            child: MyCard(),
          ),
        ),
      ),
    ),
  ));
}