# List

列表视图相关的组件与包装。

# FLListTile

FLListTile 为 ListTile 增加了点击的高亮颜色。

FLListTile(
    title: Text('账号管理'),
    trailing: Icon(Icons.navigate_next),
    onTap: (){},
)

# FLSliverPersistentHeaderWidgetBuilder

FLSliverPersistentHeaderWidgetBuilder 会将组件包裹起来实现头部悬浮的效果。

FLSliverPersistentHeaderWidgetBuilder(
  overlapsContent: false,
  builder: (context, state) {
    return Container(
      color: themeData.brightness == Brightness.light
          ? Color.fromRGBO(246, 246, 246, 1)
          : themeData.cardColor,
      height: 50,
      child: Row(
        children: <Widget>[
          SizedBox(width: 15),
          Text('Header #$headerIndex')
        ],
      ),
    );
  },
  content: SliverList(
    delegate: SliverChildBuilderDelegate(
        (context, i) => FLListTile(
              leading: CircleAvatar(
                child: Text('${i + 1}'),
              ),
              title: Text('List tile ${i + 1}'),
            ),
        childCount: 15),
  ),
)

# FLStaticListView

FLStaticListView 静态列表视图,可以绑定一些静态的配置数据,通常用于设置页面以及设置的子级菜单中。涉及到的模型有:

  • FLStaticSectionData 为静态列表的区域对象模型,每个分区有一个默认的头部,可以设置高度和标题,也可以通过设置头部高度为 0 来隐藏。
  • FLItemData 为静态列表中每个表格单元绑定的数据对象模型, 可以设置类型(标准,按钮,自定义), 标题, 子标题,附属视图(右侧的箭头,对勾,Switch 组件等),附属视图旁边的文字,或者直接自定义右侧视图。

const List<FLStaticSectionData> listData = [
     FLStaticSectionData(
       headerTitle: '账号',
       itemList: [
         FLStaticItemData(
           title: '账号管理',
           accessoryType: FLStaticListCellAccessoryType.accDetail,
           onTap: handleTap
         ),
         FLStaticItemData(
             title: '账号与安全',
             accessoryType: FLStaticListCellAccessoryType.accDetail,
             onTap: handleTap
         ),
       ]
     ),
     FLStaticSectionData(
       headerTitle: '设置',
       itemList: [
         FLStaticItemData(
             title: '推送通知设置',
             accessoryType: FLStaticListCellAccessoryType.accDetail,
             accessoryString: '全部通知',
             onTap: handleTap
         ),
         FLStaticItemData(
             title: '护眼模式',
             accessoryType: FLStaticListCellAccessoryType.accSwitch,
             onChanged: onChanged,
             switchValue: _switchValue,
         ),
         FLStaticItemData(
             title: '自动清理缓存',
             subtitle: '每 10 天清理一次',
             accessoryType: FLStaticListCellAccessoryType.accCheckmark,
             onTap: handleTap,
             selected: true,
         )
       ]
     ),
     FLStaticSectionData(
       itemList: [
         FLStaticItemData(
             cellType: FLStaticListCellType.button,
             buttonTitle: 'Apply',
             buttonTitleColor: Colors.blue,
             onButtonPressed: () {
               print('button pressed');
             }
         ),
         FLStaticItemData(
             cellType: FLStaticListCellType.button,
             buttonTitle: 'Delete',
             buttonTitleColor: Colors.red,
             onButtonPressed: () {
               print('button pressed');
             }
         )
       ]
     )
];


  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Static List'),
      ),
      body: Container(
        width: double.infinity,
        height: double.infinity,
        color: Colors.white,//Color.fromRGBO(246, 246, 246, 1),
        child: FLStaticListView(
          shrinkWrap: true,
          sections: _buildList(),
        )
      )
    );
  }

# API

# FLListTile

属性 描述 类型 默认值
onTap 点击回调 GestureTapCallback
onLongPress 长按回调 GestureLongPressCallback
backgroundColor 背景颜色 Color

# FLSliverPersistentHeaderWidgetBuilder

属性 描述 类型 默认值
builder 构建组件 FLSliverPersistentHeaderBuilder
content 内容区域 Widget
overlapsContent 头部是否覆盖内容区域 bool false

# FLStaticListView

属性 描述 类型 默认值
headerTitle 头部标题 String
headerTitleStyle 头部标题样式 TextStyle
headerHeight 头部高度 double
headerTitleIntent 头部侧边距 double 20
headerBackgroundColor 头部背景颜色 Color Colors.transparent
itemList 内容区域 item 列表 List<FLStaticItemData>

# FLStaticItemData

属性 描述 类型 默认值
cellType cell 类型 FLStaticListCellType .normal
leading 前部组件 Widget
title 标题 String
titleStyle 标题样式 TextStyle
subtitle 子标题 String
subtitleStyle 子标题样式 TextStyle
accessoryType 辅助样式 FLStaticListCellAccessoryType .accNone
accessoryString 辅助文字 String
customTrailing 自定义尾部组件 Widget
cellColor cell 颜色 Color
onTap 点击回调 VoidCallback
selected 选中与否 bool false
accItemValue 辅助值 bool false
onChanged 辅助值变更回调 ValueChanged<bool>
buttonTitle 按钮标题 String
buttonColor 按钮颜色 Color
buttonTitleColor 按钮标题颜色 Color
onButtonPressed 按钮点击回调 VoidCallback
customizeContent 自定义内容区域 Widget