繁体   English   中英

ListView 小部件不滚动

[英]ListView widget is not scrolling

我正在制作一个简单的应用程序。帖子小部件没有滚动。我使用了ListView小部件,并且还将shrinkWrap属性设置为 true。 只有帖子上方的小部件是滚动的,但帖子小部件不滚动。

postbar.dart

  Widget build(BuildContext context) {
    return Row(
      mainAxisAlignment: MainAxisAlignment.spaceEvenly,
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        
          ],
        )
      ],
    );
  }

主页.dart

class _homeState extends State<home> {
  @override
  Widget build(BuildContext context) {
    return Container(
      margin: EdgeInsets.only(top: 8),
      child: ListView(
        
        children: [
          postbar(),
          Divider(thickness: 2,),
         storybar(),
         Divider(thickness: 2,),
      SingleChildScrollView(
        scrollDirection: Axis.vertical,
           child: post()
      ),
        ],
      ),
    );
  }
}

帖子.dart

 Widget build(BuildContext context) {
        return FutureBuilder<List<Posts>>(
            future: fetchPost(),
            builder: ((context, snapshot) {
              if (snapshot.hasData) {
                return ListView.builder(itemCount: snapshot.data!.length, shrinkWrap: true, itemBuilder: (context,i){
                // for (var i = 0; i < snapshot.data!.length; i++) {
                  bool a=false;
                  return Container(
                      child: Column(
                    children: [ childrens]
                       )
                      )
                   })
                }
             })
            }
       


     The only postbar and storybar is scrolling but not post.

如果您希望主列表视图只是滚动,您可以将帖子的列表视图物理设置为 NeverScrollableScrollPhysics,如下所示:

Widget build(BuildContext context) {
    return FutureBuilder<List<Posts>>(
        future: fetchPost(),
        builder: ((context, snapshot) {
          if (snapshot.hasData) {
            return ListView.builder(
                physics: NeverScrollableScrollPhysics(), //<----- add this
                itemCount: 10,
                shrinkWrap: true,
                itemBuilder: (context, i) {
                  // for (var i = 0; i < snapshot.data!.length; i++) {
                  bool a = false;
                  return Container(
                    child: Column(children: [childrens]),
                  );
                });
          }
        }));
  }

有几件事可能会导致这种情况:

  1. 确保您的 ListView 位于 SingleChildScrollView 内。 这将允许 ListView 滚动。

  2. 确保您使用的是 ListView.builder() 而不是 ListView() 小部件。 这将允许 ListView 滚动。

  3. 确保您已将 shrinkWrap 属性设置为 true。 这将允许 ListView 滚动。

  4. 确保您使用的是 ListView.separated() 小部件而不是 ListView() 小部件。 这将允许 ListView 滚动。

  5. 最后,确保您使用了正确的约束。 如果您使用的是 Column 小部件,请确保将主轴设置为垂直。 如果您使用的是 Row 小部件,请确保将主轴设置为水平。

当父控件处理滚动事件时,您可以使用Column控件来返回子控件,而不是使用 ListView,

builder: ((context, snapshot) {
  if (snapshot.hasData) {
    return Column(children: [
      for (var i = 0; i < snapshot.data!.length; i++)
        Container(
          child: Column(
            children: [],
          ),
        )
    ]);
  }

似乎您正在尝试使用带有额外变量的循环,您可以创建内联 function 之类的

if (snapshot.hasData) {
  return Column(
    children: [
      ...() {
        List<Widget> items = [];
        for (var i = 0; i < snapshot.data!.length; i++) {
          items.add(Container(
            child: Column(
              children: [],
            ),
          ));
        }
        return items;
      }()
    ],
  );
}

还映射列表

if (snapshot.hasData) {
  return Column(
    children: snapshot.data!.map(
      (e) {
        return Container(
          child: Column(
            children: [],
          ),
        );
      },
    ).toList(),
  );
}

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM