【问题标题】:RenderListWheelViewport object was given an infinite size during layoutRenderListWheelViewport 对象在布局期间被赋予无限大小
【发布时间】:2020-08-13 04:39:39
【问题描述】:

我正在使用ListWheelScrollView 小部件为我的列表项提供滚动效果,但出现上述错误。我只想在单个列表项中显示带有一些图像和文本的堆叠项,并为它们提供 3D Wheeling 效果。

下面是我的代码->

class ExploreWidget extends StatefulWidget {
  @override
  State<StatefulWidget> createState() => _ExploreState();
}

class _ExploreState extends State<ExploreWidget> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: null,
      body: Column(
        children: <Widget>[
          _header(),
          _exploreList()
        ],
      )
    );

  }

  Widget _header(){
    return SizedBox(
      height: 200,
      width: 800,
    );

  }

  Widget _exploreList(){
    return ListWheelScrollView.useDelegate(
      itemExtent: 75,
      childDelegate: ListWheelChildBuilderDelegate(
        builder:(context,index){
          return Container(
            height: 500,
            width: 800,
            child: Stack(
              children: <Widget>[
                Image(image: AssetImage(
                  _products[index].image
                )),
                Text(_products[index].name,style: Style.sectionTitleWhite,),
                Text('70% off',style: Style.cardListTitleWhite,),
              ],
            ),
          );
        }
      ),
    );
  }

}

【问题讨论】:

    标签: flutter dart delegates flutter-layout infinite


    【解决方案1】:

    由于_exploreList() 小部件的实现方式而发生错误。这个小部件被包裹在 Column 中,它本身不会滚动。此外,您将返回一个具有无限大小的ScrollView。因此它抛出了上述错误。要解决此问题,请将 _exploreList() 小部件包装在 Flexible 内,它只占用最少的可用空间来呈现和滚动。下面的工作示例代码:

    body: Column(
              children: <Widget>[
                _header(),
                Flexible(
                  child: _exploreList()
                )
              ],
            )
    

    现在你应该可以正确使用WheelScrollView了。

    【讨论】:

    • 感谢@darshan 的回答:)
    猜你喜欢
    • 2021-08-06
    • 2020-05-20
    • 2021-09-06
    • 2018-03-31
    • 1970-01-01
    • 2019-05-13
    • 1970-01-01
    • 2020-04-15
    • 2021-05-13
    相关资源
    最近更新 更多