码迷,mamicode.com
首页 > 其他好文 > 详细

Flutter之ExpansionTile组件

时间:2019-07-22 15:21:41      阅读:183      评论:0      收藏:0      [点我收藏+]

标签:xtend   lis   pac   数组   new   谷歌   unit   ide   dem   

ExpansionTile组件

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

  • title:闭合时显示的标题,这个部分经常使用Text Widget
  • leading:标题左侧图标,多是用来修饰,让界面显得美观。
  • backgroundColor: 展开时的背景颜色,当然也是有过度动画的,效果非常好。
  • children: 子元素,是一个数组,可以放入多个元素。
  • trailing : 右侧的箭头,你可以自行替换但是我觉的很少替换,因为谷歌已经表现的很完美了。
  • initiallyExpanded: 初始状态是否展开,为true时,是展开,默认为false,是不展开。

代码示例如下:

import package:flutter/material.dart;

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title:Flutter Demo,
      theme: new ThemeData.dark(),
      home:ExpansionTileDemo()
    );
  }
}

class ExpansionTileDemo extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text(Expansion Tile Demo)),
      body: Center(
        child: ExpansionTile(
          title: Text(Expansion Tile),
          leading: Icon(Icons.ac_unit),
          backgroundColor: Colors.white12,
          children: <Widget>[
            ListTile(
              title: Text(list tile),
              subtitle: Text(subtitle),
            ),
          ],
          initiallyExpanded: true, //打开状态  不写默认false闭合状态
        ),
      ),
    );
  }
}

 

Flutter之ExpansionTile组件

标签:xtend   lis   pac   数组   new   谷歌   unit   ide   dem   

原文地址:https://www.cnblogs.com/joe235/p/11225861.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!