Flutter中制作多级列表的方法:

  1. 创建一个包含多个层级的数据结构,例如:
class Category {
  final String name;
  final List<Category> subcategories;

  Category({required this.name, required this.subcategories});
}

final List<Category> categories = [
  Category(
    name: 'Electronics',
    subcategories: [
      Category(name: 'Phones', subcategories: []),
      Category(name: 'Computers', subcategories: [
        Category(name: 'Laptops', subcategories: []),
        Category(name: 'Desktops', subcategories: []),
      ]),
      Category(name: 'TVs', subcategories: []),
    ],
  ),
  Category(
    name: 'Clothing',
    subcategories: [
      Category(name: 'Men', subcategories: []),
      Category(name: 'Women', subcategories: []),
      Category(name: 'Kids', subcategories: []),
    ],
  ),
  Category(name: 'Books', subcategories: []),
];
  1. 创建一个Widget用于渲染每个层级的数据,例如:
class CategoryItem extends StatelessWidget {
  final Category category;

  const CategoryItem({Key? key, required this.category}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return ExpansionTile(
      title: Text(category.name),
      children: category.subcategories
          .map((subcategory) => CategoryItem(category: subcategory))
          .toList(),
    );
  }
}
  1. 在Widget树中使用这个Widget来渲染多级列表:
class MyHomePage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text('Categories')),
      body: ListView.builder(
        itemCount: categories.length,
        itemBuilder: (context, index) {
          return CategoryItem(category: categories[index]);
        },
      ),
    );
  }
}

这样就可以创建一个多级列表了。每个层级都可以展开和折叠,同时也可以使用其他Widget来自定义每个层级的样式。

Flutter如何制作多级列表

原文地址: https://www.cveoy.top/t/topic/bfAM 著作权归作者所有。请勿转载和采集!

免费AI点我,无需注册和登录