ExpansionTile Widget就是一个可以展开闭合的组件,常用的属性有如下几个。

  • title:闭合时显示的标题,这个部分经常使用Text Widget。
  • leading:标题左侧图标,多是用来修饰,让界面显得美观。
  • backgroundColor: 展开时的背景颜色,当然也是有过度动画的,效果非常好。
  • children: 子元素,是一个数组,可以放入多个元素。
  • trailing : 右侧的箭头,你可以自行替换但是我觉的很少替换,因为谷歌已经表现的很完美了。
  • initiallyExpanded: 初始状态是否展开,为true时,是展开,默认为false,是不展开。
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    import 'package:flutter/material.dart';
    void main() => runApp(MyApp());
    class MyApp extends StatelessWidget {
    @override
    Widget build(BuildContext context) {
    // TODO: implement build
    return new MaterialApp(
    title: "flutter demo",
    theme: new ThemeData.dark(),
    home: _home(),
    );
    }
    }
    class _home extends StatefulWidget {
    @override
    State<StatefulWidget> createState() {
    // TODO: implement createState
    return _homeState();
    }
    }
    class _homeState extends State<_home> {
    @override
    Widget build(BuildContext context) {
    // TODO: implement build
    return new Scaffold(
    appBar: new AppBar(
    title: new Text("title"),
    ),
    body: new Center(
    child: ExpansionTile(
    title: Text("title"),
    leading: Icon(Icons.favorite,color: Colors.white,),
    backgroundColor: Colors.lightBlue,
    initiallyExpanded: false,//默认是否展开
    children: <Widget>[
    ListTile(
    title: Text("ListTile"),
    leading: Icon(Icons.favorite_border,color: Colors.white,),
    ),
    ],
    ),
    ),
    );
    }
    }