3d2b7dd9-7e56-4a6b-b48d-2991be48644d.gif
本來是使用第三方CarouselSlider 就能簡單完成需求，但是他無法實現(xiàn)寬度自適應(yīng)，類似多語言的時候苏遥，可能有問題，所以自己寫了一個赡模。
class TitleSwitcher extends StatefulWidget {
final List<String> titles;
final Duration duration;
final TextStyle? style;
const TitleSwitcher(
{super.key, required this.titles, required this.duration, this.style});
@override
_TitleSwitcherState createState() => _TitleSwitcherState();
}
class _TitleSwitcherState extends State<TitleSwitcher> {
int _currentIndex = 0;
late Timer _timer;
@override
void initState() {
super.initState();
_startTimer();
}
@override
void dispose() {
_timer.cancel();
super.dispose();
}
void _startTimer() {
_timer = Timer.periodic(widget.duration, (Timer timer) {
setState(() {
_currentIndex = (_currentIndex + 1) % widget.titles.length;
});
});
}
@override
Widget build(BuildContext context) {
return AnimatedSwitcher(
duration: Duration(seconds: 1),
transitionBuilder: (Widget child, Animation<double> animation) {
final slideInAnimation = Tween<Offset>(
begin: Offset(0, 1),
end: Offset(0, 0),
).animate(animation);
final slideOutAnimation = Tween<Offset>(
begin: Offset(0, -1),
end: Offset(0, 0),
).animate(animation);
if (child.key == ValueKey(_currentIndex)) {
return ClipRect(
child: SlideTransition(
position: slideInAnimation,
child: child,
),
);
} else {
return ClipRect(
child: SlideTransition(
position: slideOutAnimation,
child: child,
),
);
}
},
child: Text(
widget.titles[_currentIndex],
key: ValueKey<int>(_currentIndex),
style: widget.style ?? TextStyle(fontSize: 24),
),
);
}
}
