實(shí)現(xiàn)思路：
使用AnimationBuilder配合Transform.translate組件，實(shí)現(xiàn)顯式動畫止潘。
代碼：
import 'dart:math';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
const shakeCount = 4;
const shakeDuration = Duration(milliseconds: 500);
class ShakeAnimationPage extends StatefulWidget {
const ShakeAnimationPage({Key? key}) : super(key: key);
@override
_ShakeAnimationPageState createState() => _ShakeAnimationPageState();
}
class _ShakeAnimationPageState extends State<ShakeAnimationPage>
with TickerProviderStateMixin {
late final AnimationController _shakeController =
AnimationController(vsync: this, duration: shakeDuration);
shake() {
_shakeController.forward();
}
@override
void initState() {
_shakeController.addListener(() {
if (_shakeController.status == AnimationStatus.completed) {
_shakeController.reset();
}
});
super.initState();
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: const Text("抖動效果"),
),
body: Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
mainAxisAlignment: MainAxisAlignment.center,
children: [
AnimatedBuilder(
animation: _shakeController,
builder: (context, child) {
final sineValue =
sin(shakeCount * 2 * pi * _shakeController.value);
return Transform.translate(
offset: Offset(sineValue * 10, 0),
child: child,
);
},
child: const Text(
"我是抖動文字",
textAlign: TextAlign.center,
style: TextStyle(color: Colors.orange),
),
),
CupertinoButton(child: const Text("抖動"), onPressed: shake),
],
),
);
}
}
