【Flutter学习笔记】9.6 动画切换组件（AnimatedSwitcher）

import 'package:flutter/material.dart';
 
void main() => runApp(MyApp());
 
class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: AnimatedSwitcherHome(),
    );
  }
}
 
class AnimatedSwitcherHome extends StatefulWidget {
  @override
  _AnimatedSwitcherHomeState createState() => _AnimatedSwitcherHomeState();
}
 
class _AnimatedSwitcherHomeState extends State<AnimatedSwitcherHome> {
  int _count = 0;
 
  void _incrementCounter() {
    setState(() {
      _count++;
    });
  }
 
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: AnimatedSwitcher(
          duration: const Duration(milliseconds: 300),
          child: Text(
            '$_count',
            key: ValueKey<int>(_count),
            style: Theme.of(context).textTheme.display1,
          ),
        ),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: _incrementCounter,
        tooltip: 'Increment',
        child: Icon(Icons.add),
      ),
    );
  }
}

这段代码演示了如何使用AnimatedSwitcher组件在点击按钮时平滑地切换显示的数字。每次点击按钮，计数器增加，并使用AnimatedSwitcher组件平滑过渡到新的数字。