Flutter ExpansionTile自定义动画

main.dart:

import 'package:flutter/material.dart';

//import 'MyHomePage.dart';
import 'expansion_tile.dart';

void main()=>runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
        title: 'Flutter Demo',
        theme:ThemeData.dark(),
        home: ExpansionTileDemo()
    );
  }
}
expansion_tile.dart:
import 'package:flutter/material.dart';

class ExpansionTileDemo extends StatefulWidget {
  @override
  _ExpansionTileDemoState createState() => _ExpansionTileDemoState();
}

class _ExpansionTileDemoState extends State<ExpansionTileDemo>
    with SingleTickerProviderStateMixin {
  Animation animation;
  AnimationController animationController;

  @override
  void initState() {
    super.initState();
    animationController = new AnimationController(
        vsync: this, duration: Duration(microseconds: 200));
    animation = new Tween(begin: 0.0, end: 0.5).animate(animationController);
  }

  _changeOpacity(bool expand) {
    setState(() {
      if (expand) {
        animationController.forward();
      } else {
        animationController.reverse();
      }
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text('expansion title demo')),
      body: ListView(
        children: <Widget>[
          ExpansionTile(
              title: const Text('更多精彩'),
              leading: Icon(Icons.ac_unit),
              trailing: RotationTransition(turns: animation,child: Icon(Icons.chevron_right)),
              backgroundColor: Colors.white12,
              onExpansionChanged: (bool){
                _changeOpacity(bool);
              },
              children: <Widget>[
                Container(
                  decoration: BoxDecoration(
                    borderRadius: BorderRadius.circular(3.0),
                    color: Colors.blueAccent,
                  ),
                  height: 100.0,
                  margin: EdgeInsets.all(5.0),
                ),
              ]),
        ],
      ),
    );
  }
}
发布了189 篇原创文章 · 获赞 81 · 访问量 21万+

猜你喜欢

转载自blog.csdn.net/cpcpcp123/article/details/90484300