flutter - SliverGrid 未在 Flutter 的 CustomScrollView 中显示

Question

我想从 REST api 获取数据，使用未来的 SliverGrid 应该构建。但它没有显示，只显示白色，而且我不知道如何在 SliverGrid 中指定总网格项目数。因此，如果它显示它必须生成超过实际计数。

SliverGrid(
              gridDelegate:
                  SliverGridDelegateWithFixedCrossAxisCount(crossAxisCount: 2),
              delegate: SliverChildBuilderDelegate(
                (BuildContext context, int index)
                {
                  return FutureBuilder(
                    future: _items,
                    builder: (context, snapshot) {
                      return snapshot.connectionState == ConnectionState.done
                          ? snapshot.hasData
                              ? GridItem()
                              : Text('Retry')
                          : Text('progress');
                    },

                  );

                },

              ),)

Answer 1

演示片段

未来

  Future<List<int>> _f() async {
     return await Future.delayed(Duration(seconds: 3))
        .then((value) => [1, 3, 5, 56, 65]);
  }

并在里面使用CustomScrollView

        FutureBuilder<List<int>>(
            future: _f(),
            builder: (context, snapshot) => !snapshot.hasData //handle more situation here  
                ? SliverToBoxAdapter(child: Text("loading"))
                : SliverGrid(
                    gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
                      crossAxisCount: 2,
                    ),
                    delegate: SliverChildBuilderDelegate(
                      (BuildContext context, int index) {
                        return Text(snapshot.data![index].toString());
                      },
                      childCount: snapshot.data!.length,
                    ),
                  ),
          ),

完整的小部件

class HomeScreen extends StatefulWidget {
  @override
  State<HomeScreen> createState() => _HomeScreenState();
}

class _HomeScreenState extends State<HomeScreen> {
  Future<List<int>> _f() async {
    return await Future.delayed(Duration(seconds: 3))
        .then((value) => [1, 3, 5, 56, 65]);
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: CustomScrollView(
        slivers: [ 
          FutureBuilder<List<int>>(
            future: _f(),
            builder: (context, snapshot) => !snapshot.hasData
                ? SliverToBoxAdapter(child: Text("loading"))
                : SliverGrid(
                    gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
                      crossAxisCount: 2,
                    ),
                    delegate: SliverChildBuilderDelegate(
                      (BuildContext context, int index) {
                        return Text(snapshot.data![index].toString());
                      },
                      childCount: snapshot.data!.length,
                    ),
                  ),
          ),
        ],
      ),
    );
  }
}

它解决了你的问题吗？