如何使包含多个sliverlist和slivergid的页面变得扑朔迷离?

时间:2019-05-27 15:49:16

标签: flutter flutter-sliver customscrollview

How to create a gridview within a listview by flutter with json API

我浏览了上面的链接及其正确的解释,但是当我用此代码添加一个新的条子列表时,如果尝试快速滚动,则条子出现了问题,条子中只有一件会出现,请帮助我扑朔迷离。

1 个答案:

答案 0 :(得分:0)

对于main.dart

import 'package:flutter/material.dart';
import './pages/fetch.dart';

void main() {
  runApp(new MaterialApp(
      home: new fetchPost(),

  ));

}

对于fetch.dart

class fetch extends StatefulWidget{
  fetchPost createState()=> fetchPost();
}

class fetchPost extends State<fetch>{

    //Add your own Json fetch function

       @override
          Widget build(BuildContext context) {
            return CustomScrollView(
                slivers: <Widget>[
                  SliverPadding(
                    padding: EdgeInsets.all(0.0),
                    sliver :SliverList(
                    delegate: SliverChildListDelegate([
                      Column(
                        children: <Widget>[
                          //your widgets
                          firstWidget(),
                          yourNextWidget(),  
                        ],
                      )
                    ]),
                  )
                  )
                ],
            );
          }
    Widget firstWidget(){
        return Column( GridView.builder(
                  gridDelegate: new SliverGridDelegateWithFixedCrossAxisCount(crossAxisCount:2,crossAxisSpacing: 0.0, childAspectRatio: 1/1),
                  itemCount: recent == null ? 0 : list.length,
                  itemBuilder: (BuildContext context, int index, ) {
                  return Column(
                   children: <Widget>[
                      Card(
                        child: Column(
                          children: <Widget>[
                            new Image.network('asset/image']),
                            new ListTile(                         
                                title: new Text(''),
                                    subtitle: Text("",),
                                    onTap: () {Navigator.push(
                                      context, new MaterialPageRoute(
                                      builder: (context) => new nextclass(),
                                      ),
                                    );
                                    },
                                dense: true,
                              ),  
                            ],
                         ),
                       )
                     ],
                   );
                 },shrinkWrap: true,
                physics: ClampingScrollPhysics(),
              ) );
           }


     Widget nextWidget(){
           return Column(
         //your custom widget
          );
        }
    }