listview - 水平视口(viewport)被赋予了无限的高度

Question

我想在“正文:”部分的列下查看轮播，但收到此错误:
在 performResize() 期间抛出了以下断言:
水平视口(viewport)被赋予了无限的高度。
视口(viewport)在横轴上扩展以填充其容器并约束其子级以匹配其在横轴上的范围。在这种情况下，水平视口(viewport)被赋予了无限量的垂直空间来扩展。
相关的导致错误的小部件是:

ListView file:///Users/ahmed/AndroidStudioProjects/flutter_app_service2/lib/screens/home/profile_list.dart:27:21
When the exception was thrown, this was the stack: 
#0      RenderViewport.performResize.<anonymous closure> (package:flutter/src/rendering/viewport.dart:1289:15)
#1      RenderViewport.performResize (package:flutter/src/rendering/viewport.dart:1301:6)
#2      RenderObject.layout (package:flutter/src/rendering/object.dart:1746:9)
#3      RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:110:13)
#4      RenderObject.layout (package:flutter/src/rendering/object.dart:1767:7)
...
The following RenderObject was being processed when the exception was fired: RenderViewport#d699b NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
...  needs compositing
...  parentData: <none> (can use size)
...  constraints: BoxConstraints(0.0<=w<=414.0, 0.0<=h<=Infinity)
...  size: MISSING
...  axisDirection: right
...  crossAxisDirection: down
...  offset: ScrollPositionWithSingleContext#209bd(offset: 0.0, range: null..null, viewport: null, ScrollableState, BouncingScrollPhysics, IdleScrollActivity#ac774, ScrollDirection.idle)
...  anchor: 0.0
RenderObject: RenderViewport#d699b NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
  needs compositing
  parentData: <none> (can use size)
  constraints: BoxConstraints(0.0<=w<=414.0, 0.0<=h<=Infinity)
  size: MISSING
  axisDirection: right
  crossAxisDirection: down
  offset: ScrollPositionWithSingleContext#209bd(offset: 0.0, range: null..null, viewport: null, ScrollableState, BouncingScrollPhysics, IdleScrollActivity#ac774, ScrollDirection.idle)
  anchor: 0.0
...  center child: RenderSliverPadding#201ae NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
...    parentData: paintOffset=Offset(0.0, 0.0)
...    constraints: MISSING
...    geometry: null
...    padding: EdgeInsets.zero
...    textDirection: ltr
...    child: RenderSliverList#b683f NEEDS-LAYOUT NEEDS-PAINT
...      parentData: paintOffset=Offset(0.0, 0.0)
...      constraints: MISSING
...      geometry: null
...      no children current live

这是我在家里的代码:

body: Column(
      children: <Widget>[
        ProfileList(),
      ],
    ),

这是指向 ProfileCarousel 的 ProfileList:

class _ProfileListState extends State<ProfileList> {
@override
Widget build(BuildContext context) {
final profiles = Provider.of<List<Profile>>(context);

profiles.forEach((profile) {
  print(profile.firstName);
  print(profile.lastName);
  print(profile.country);
  print(profile.city);
  print(profile.imgUrl);
});

return ListView.builder(
  scrollDirection: Axis.horizontal,
  itemBuilder: (context, index) {

  },
  itemCount: profiles.length,
);
}
}

这是 ProfileCarousel:

class ProfileCarousel extends StatelessWidget {
final Profile profile;
ProfileCarousel({this.profile});
@override
Widget build(BuildContext context) {
return Container(
  margin: EdgeInsets.all(10.0),
  width: 210.0,
  child: Stack(
    alignment: Alignment.topCenter,
    children: <Widget>[
      Container(
        decoration: BoxDecoration(
          color: Colors.white,
          borderRadius: BorderRadius.circular(10.0),
          boxShadow: [
            BoxShadow(
              color: Colors.black26,
              offset: Offset(0.0, 2.0),
              blurRadius: 6.0,
            ),
          ],
        ),
        child: Stack(
          children: <Widget>[
            Hero(
              tag: profile.imgUrl,
              child: ClipRRect(
                borderRadius: BorderRadius.circular(10.0),
                child: Image(
                  height: 180.0,
                  width: 180.0,
                  image: NetworkImage(profile.imgUrl),

                ),
              ),
            ),
            Positioned(
              left: 10.0,
              bottom: 10.0,
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: <Widget>[
                  Text(
                    profile.firstName,
                    style: TextStyle(
                        fontWeight: FontWeight.w600,
                        fontSize: 24.0,
                        letterSpacing: 1.2,
                        color: Colors.white),
                  ),
                  Row(
                    children: <Widget>[
                      Icon(
                        Icons.arrow_upward,
                        size: 10.0,
                        color: Colors.white,
                      ),
                      SizedBox(width: 5.0),
                      Text(
                        profile.city,
                        style: TextStyle(color: Colors.white),
                      ),
                    ],
                  )
                ],
              ),
            )
          ],
        ),
      )
    ],
  ),
);
}
}

Answer 1

我设法通过用 SizedBox 小部件包装 ProfileList 并给它一个适当的高度来找到它的解决方案:

body: Column(
      children: <Widget>[
        SizedBox(height: 500, child: ProfileList()),
      ],
    ),