Flutter 系统是如何实现ExpansionPanelList的

移动开发 作者: 2024-08-25 11:45:01
老孟导读:Flutter组件有一个很大的特色,那就是很多复杂的组件都是通过一个一个小组件拼装而成的,今天就来说说系统的ExpansionPanelList是如何实现的。 在了解ExpansionPan
SingleChildScrollView(
  child: MergeableMaterial(
    children: [
      MaterialSlice(
          key: ValueKey(1),child: Container(
            height: 45,color: Colors.primaries[1 % Colors.primaries.length],)),MaterialGap(key: ValueKey(2)),MaterialSlice(
          key: ValueKey(3),MaterialGap(key: ValueKey(4)),MaterialSlice(
          key: ValueKey(5),],),)
List<MergeableMaterialItem> items = [];
List.generate(_count,(index) {
  items.add(MaterialSlice(
      key: ValueKey(index * 2),child: Container(
        height: 45,color: Colors.primaries[index % Colors.primaries.length],)));
});

return SingleChildScrollView(
  child: MergeableMaterial(
    children: items,)
MergeableMaterial(
  hasDividers: true,elevation: 24,children: items,)
bool _expand = false;

@override
Widget build(BuildContext context) {
  return Column(
    children: <Widget>[
      Container(
        height: 45,color: Colors.green.withOpacity(.3),alignment: Alignment.centerRight,child: IconButton(
          icon: Icon(Icons.arrow_drop_down),onPressed: () {
            setState(() {
              _expand = !_expand;
            });
          },_expand
          ? MergeableMaterial(
              hasDividers: true,children: [
                MaterialSlice(
                    key: ValueKey(1),child: Container(
                      height: 200,))
              ],)
          : Container(),Container(
        height: 45,color: Colors.red.withOpacity(.3),);
}
原创声明
本站部分文章基于互联网的整理,我们会把真正“有用/优质”的文章整理提供给各位开发者。本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
本文链接:http://www.jiecseo.com/news/show_68376.html