特点

在网格视图中列出图像，封装在列表视图中会导致性能下降（显示优化失败），
因为 ListView 仅优化某些自身组件。它不会费心优化其自身的小部件。
因此，GridView 的元素被排除在此状态之外。

此外，StickyGridView 优化自身及其所有子元素，并防止延迟。

用法

// First, create the header list.
// And then create the Map<String, List<GridImage>> map.

List<String> headers = [
    'Flags 1',
    'Flags 2',
    'Flags 3',
    'Flags 4',
    'Flags 5',
    'Flags 6'
  ];
  Map<String, List<GridImage>> map = {};

Future<void> initMap() async {
  double width = 28;
  double height = 20;
  for (int i = 0; i < headers.length; i++) {
    List<GridImage> gridImages = [];
    double y = i * height;
    int range = 5 + Random().nextInt(11);
    for (int j = 0; j < range; j++) {
      double x = j * width;
      GridImage gridImage = GridImage.fromAssetPart(
          'assets/images/all_flags.png', x, y, width, height);
      await gridImage.initUiImage();
      gridImages.add(gridItem);
    }
    map[headers[i]] = gridImages;
  }
}

Widget build(BuildContext context) {
  return StickyGridView(
      crossAxisCount: 6,
      map: map,
      headers: headers,
      onClick: (section, index) {
        ScaffoldMessenger.of(context).showSnackBar(SnackBar(
          content: Text('Section: $section, index: $index , header: ${headers[section]}'), duration: const Duration(milliseconds: 500),));
      });
}

GitHub 链接

https://github.com/fcenesiz/sticky_grid_view