Row 内的 ListViewBuiler

Posted 2023-02-23

【中文标题】Row 内的 ListViewBuiler

【英文标题】：ListViewBuiler inside Row flutter

【发布时间】：2021-12-06 20:17:29

【问题描述】：

我正在尝试在一行中添加一个列表视图，但我得到了这个错误

我在行中有两个小部件，第一个带有一列，第二个小部件是返回另一个小部件的列表视图构建器。

我正在尝试使该行如下图所示

这是我的代码

body: SingleChildScrollView(
        child: Column(
          children: [
            Row(
              children: [
                Column(
                  children: [
                    Stack(
                      children: [
                        Container(
                          height: 60,
                          width: 60,
                          decoration: const BoxDecoration(
                              color: Colors.red,
                              shape: BoxShape.circle,
                              image: DecorationImage(
                                  image: AssetImage("assets/images/meee.jpg"))),
                        ),
                        Positioned(
                          bottom: 0,
                          right: 0,
                          child: Container(
                            padding: EdgeInsets.all(5),
                            decoration: BoxDecoration(
                                color: Colors.blue, shape: BoxShape.circle),
                            child: Text(
                              "+",
                              style: TextStyle(color: Colors.white),
                            ),
                          ),
                        )
                      ],
                    ),
                    const SizedBox(
                      height: 7,
                    ),
                    const Text(
                      "Your Story",
                      style: TextStyle(color: Colors.white, fontSize: 13),
                    )
                  ],
                ),
                ListView.builder(
                  itemCount: 3,
                  scrollDirection: Axis.horizontal,
                  itemBuilder: (BuildContext context, int index) 
                    return __buildStory();
                  ,
                ),
              ],
            ),
          ],
        ),
      ),
 

【参考方案1】：

您是否尝试更改此行

ListView.builder(

用这条线

ListView.builder(shrinkWrap: true,

如果它不起作用，请考虑将您的 ListView.builder 小部件包装在 Flexible 小部件中

Flexible(child:

【讨论】：

你能在下面看到我的评论吗

您是否尝试过使用“灵活”？

【参考方案2】：

因为ListView 需要Row 中的所有剩余空间，所以用Expanded 包裹ListView.builder。在ListView 中也使用shrinkWrap:true。

将mainAxisSize: MainAxisSize.min 添加到Column。

body: SingleChildScrollView(
        child: Column(
          mainAxisSize: MainAxisSize.min,
          children: [
            Row(
              children: [
                Column(
                  mainAxisSize: MainAxisSize.min,
                  children: [
                    Stack(
                      children: [
                        Container(
                          height: 60,
                          width: 60,
                          decoration: const BoxDecoration(
                              color: Colors.red,
                              shape: BoxShape.circle,
                              image: DecorationImage(
                                  image: AssetImage("assets/images/meee.jpg"))),
                        ),
                        Positioned(
                          bottom: 0,
                          right: 0,
                          child: Container(
                            padding: EdgeInsets.all(5),
                            decoration: BoxDecoration(
                                color: Colors.blue, shape: BoxShape.circle),
                            child: Text(
                              "+",
                              style: TextStyle(color: Colors.white),
                            ),
                          ),
                        )
                      ],
                    ),
                    const SizedBox(
                      height: 7,
                    ),
                    const Text(
                      "Your Story",
                      style: TextStyle(color: Colors.white, fontSize: 13),
                    )
                  ],
                ),
                Expanded(
                child: ListView.builder(
                    shrinkWrap: true,
                    itemCount: 3,
                    scrollDirection: Axis.horizontal,
                    itemBuilder: (BuildContext context, int index) 
                      return __buildStory();
                    ,
                  ),
                ),
              ],
            ),
          ],
        ),
      ),

【讨论】：

with Expanded 我得到错误 constraints.hasBoundedHeight': is not true ，所以我用 SizedBox 替换 Expanded ，并为 sSizedBox 添加了一个高度，它现在可以工作了，但是有什么方法可以让 SizedBox拿孩子的身高？因为没有高度我又得到了这个错误“constraints.hasBoundedHeight': is not true”

尝试更新的解决方案。

仍然收到此错误“'constraints.hasBoundedHeight': is not true”，我需要添加高度

调试并识别导致错误的小部件