flutter 呈现库捕获到异常错误|扑动

z9smfwbn 于 2022-11-30 发布在 Flutter

关注(0)|答案(1)|浏览(178)

我想做的是，第一个列表视图水平滚动，第二个列表视图垂直全屏滚动。（当用户垂直滚动时，第一个列表视图将隐藏）
与Facebook的提要屏幕一样，第一个列表看起来像一个故事行，第二个列表看起来像帖子。
这张图简单地展示了我想做的事情

我试过了，我的代码在这里：

Stack(
              children: [
                SingleChildScrollView(
                  child: Column(
                    mainAxisSize: MainAxisSize.min,
                    children: <Widget>[
                      SizedBox(
                        height: 100.0,
                        child: ListView.builder(
                          shrinkWrap: true,
                          scrollDirection: Axis.horizontal,
                          itemCount: snapshot.data!.docs.length,
                          itemBuilder: (context, index) => PostCard(
                            snap: snapshot.data!.docs[index].data(),
                          ),
                        ),
                      ),
                      Text(
                        'Demo Headline 2',
                        style: TextStyle(fontSize: 18),
                      ),
                      ListView.builder(
                        itemCount: snapshot.data!.docs.length,
                        itemBuilder: (context, index) => PostCard(
                          snap: snapshot.data!.docs[index].data(),
                        ),
                      ),
                    ],
                  ),
                ),
                Align(
                  alignment: Alignment.bottomRight,
                  child: Padding(
                    padding: const EdgeInsets.only(bottom: 80, right: 10),
                    child: FloatingActionButton(
                      elevation: 100,
                      onPressed: () {
                        Navigator.pushNamed(context, '/add');
                      },
                      child: const Icon(
                        Icons.add,
                        size: 32,
                        color: Colors.amber,
                      ),
                      backgroundColor: Colors.black,
                    ),
                  ),
                ),
              ],
            );

我的代码显示此错误
渲染库捕获到异常，RenderBox未布局：渲染重新绘制边界#90e8f重新绘制边界= up 16需要-油漆需要-合成-位-更新'软件包：flutter/src/rendering/box. dart'：包：flutter/.../rendering/box.dart：1Assert失败：第2001行位置12：'具有大小'

flutter

来源：https://stackoverflow.com/questions/74596096/exception-caught-by-rendering-library-flutter

1条答案

按热度按时间

0dxa2lsx1#

在第二个列表视图中尝试以下代码和shrinkWrap: true,
列表视图小部件：

Expanded(child:
     ListView.builder(
        shrinkWrap: true,//add this line
        itemCount: snapshot.data!.docs.length,
        itemBuilder: (context, index) => PostCard(
        snap: snapshot.data!.docs[index].data(),
       ),
     ),
    ),

完整代码：

Scaffold(
  body: Column(
    mainAxisSize: MainAxisSize.min,
    children: <Widget>[
      SizedBox(
        height: 100.0,
        child: ListView.builder(
          shrinkWrap: true,
          scrollDirection: Axis.horizontal,
          itemCount: 5,
          itemBuilder: (context, index) => Container(
            padding: const EdgeInsets.all(12),
            margin: const EdgeInsets.all(12),
            height: 150,
            width: 150,
            color: Colors.pink,
          ),
        ),
      ),
      Text(
        'Demo Headline 2',
        style: TextStyle(fontSize: 18),
      ),
      Expanded(
        child: ListView.builder(
          itemCount: 10,
          shrinkWrap: true,
          itemBuilder: (context, index) => Container(
            padding: const EdgeInsets.all(12),
            margin: const EdgeInsets.all(12),
            height: 150,
            width: 150,
            color: Colors.amber,
          ),
        ),
      ),
    ],
  ),
  floatingActionButton: FloatingActionButton(
    elevation: 100,
    onPressed: () {
      Navigator.pushNamed(context, '/add');
    },
    child: const Icon(
      Icons.add,
      size: 32,
      color: Colors.amber,
    ),
    backgroundColor: Colors.black,
  ),
);

结果-〉x1c 0d1x

赞(0）回复(0）举报 2022-11-30

我来回答

flutter 呈现库捕获到异常错误|扑动

1条答案

相关问题

热门标签

最新问答