一个CustomPaint，可以自己在两个颜色之间变化。
import 'package:flutter/material.dart';
void main(List<String> args) {
runApp(
const MaterialApp(
home: HomePage(),
),
);
}
class HomePage extends StatefulWidget {
const HomePage({super.key});
@override
State<HomePage> createState() => _HomePageState();
}
class _HomePageState extends State<HomePage>
with SingleTickerProviderStateMixin {
late AnimationController controller;
@override
void initState() {
controller = AnimationController(
vsync: this,
duration: const Duration(seconds: 3),
);
controller.forward();
super.initState();
}
@override
Widget build(BuildContext context) {
return Scaffold(
body: Padding(
padding: const EdgeInsets.all(20),
child: CustomPaint(
size: const Size(100, 100),
painter: MyColorPainter(Colors.red, Colors.blue, factor: controller),
),
),
);
}
}
class MyColorPainter extends CustomPainter {
Animation<double> factor;
final Color from;
final Color to;
MyColorPainter(this.from, this.to, {required this.factor})
: super(repaint: factor);
@override
void paint(Canvas canvas, Size size) {
Paint paint = Paint()..color = Color.lerp(from, to, factor.value)!;
canvas.drawCircle(
Offset(size.width / 2, size.height / 2),
size.width / 2,
paint,
);
}
@override
bool shouldRepaint(covariant MyColorPainter oldDelegate) {
return oldDelegate.factor != factor;
}
}
