如何解决ListView生成的错误?

时间:2020-04-03 13:58:54

标签: listview user-interface flutter dart flutter-pageview

伙计们,我有一个问题要问您: 我已经建立了一个PageView。在此PageView中是一个ListView,在此ListView中是一个小部件列表。 但是不幸的是我的代码由于某种原因而无法工作……而且我也不知道为什么。我对Flutter还是很陌生。我将衷心感谢您的帮助。 生成错误的代码如下:

Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.white,
      body: ListView(
        children: createHomePage(
            controller: _controller,
            content: widget.content,
            title: widget.title,
            menuButtonAction: widget.menuButton,
            showShadow: widget.showShadow,
            context: context),
      ),
    );
  }
}

如果您能帮助我,我将不胜感激。当我用Colum替换ListView时,代码可以正常工作,但是不幸的是我无法滚动...但是它必须是可滚动的! 我不断收到以下错误:

I/flutter ( 4539): ══╡ EXCEPTION CAUGHT BY WIDGETS LIBRARY ╞═══════════════════════════════════════════════════════════

I/flutter ( 4539): The following assertion was thrown building NotificationListener<KeepAliveNotification>:

I/flutter ( 4539): Incorrect use of ParentDataWidget.

I/flutter ( 4539): Expanded widgets must be placed inside Flex widgets.

I/flutter ( 4539): Expanded(no depth, flex: 1, dirty) has no Flex ancestor at all.

I/flutter ( 4539): The ownership chain for the parent of the offending Expanded was:

I/flutter ( 4539):   RepaintBoundary ← IndexedSemantics ← 
NotificationListener<KeepAliveNotification> ← KeepAlive ←

I/flutter ( 4539): AutomaticKeepAlive ← KeyedSubtree ← SliverList ← MediaQuery ← SliverPadding ← ShrinkWrappingViewport

I/flutter ( 4539): ← ⋯

I/flutter ( 4539): 

I/flutter ( 4539): The relevant error-causing widget was:

I/flutter ( 4539):   ListView

如何解决此问题?我已经尝试了很多。例如,我将小部件列表放在一列中,并将ListView更改为SingleChildListView,但这也无济于事。但是,我又收到一条错误消息。这是:

══╡ EXCEPTION CAUGHT BY RENDERING LIBRARY ╞═════════════════════════════════════════════════════════

I/flutter ( 4539): The following assertion was thrown during performLayout():

I/flutter ( 4539): RenderFlex children have non-zero flex but incoming height constraints are unbounded.

I/flutter ( 4539): When a column is in a parent that does not provide a finite height constraint, for example if it is

I/flutter ( 4539): in a vertical scrollable, it will try to shrink-wrap its children along the vertical axis. Setting a

I/flutter ( 4539): flex on a child (e.g. using Expanded) indicates that the child is to expand to fill the remaining

I/flutter ( 4539): space in the vertical direction.

I/flutter ( 4539): These two directives are mutually exclusive. If a parent is to shrink-wrap its child, the child

I/flutter ( 4539): cannot simultaneously expand to fit its parent.
I/flutter ( 4539): Consider setting mainAxisSize to MainAxisSize.min and using FlexFit.loose fits for the flexible

I/flutter ( 4539): children (using Flexible rather than Expanded). This will allow the flexible children to size

I/flutter ( 4539): themselves to less than the infinite remaining space they would otherwise be forced to take, and

I/flutter ( 4539): then will cause the RenderFlex to shrink-wrap the children rather than expanding to fit the maximum

I/flutter ( 4539): constraints provided by the parent.

I/flutter ( 4539): If this message did not help you determine the problem, consider using debugDumpRenderTree():

I/flutter ( 4539):   https://flutter.dev/debugging/#rendering-layer

I/flutter ( 4539):   http://api.flutter.dev/flutter/rendering/debugDumpRenderTree.html

I/flutter ( 4539): The affected RenderFlex is:

I/flutter ( 4539):   RenderFlex#bfee3 relayoutBoundary=up15 NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE(creator: Column ← RepaintBoundary ← IndexedSemantics ← NotificationListener<KeepAliveNotification> ← KeepAlive ← AutomaticKeepAlive ← KeyedSubtree ← SliverList ← MediaQuery ← SliverPadding ← ShrinkWrappingViewport ← IgnorePointer-[GlobalKey#665ae] ← ⋯, parentData: <none> (can use size), constraints: BoxConstraints(w=411.4, 0.0<=h<=Infinity), size: MISSING, direction: vertical, mainAxisAlignment: start, mainAxisSize: max, crossAxisAlignment: center, verticalDirection: down)

I/flutter ( 4539): The creator information is set to:

I/flutter ( 4539):   Column ← RepaintBoundary ← IndexedSemantics ← NotificationListener<KeepAliveNotification> ←

I/flutter ( 4539):   KeepAlive ← AutomaticKeepAlive ← KeyedSubtree ← SliverList ← MediaQuery ← SliverPadding ←

I/flutter ( 4539):   ShrinkWrappingViewport ← IgnorePointer-[GlobalKey#665ae] ← ⋯

I/flutter ( 4539): See also: https://flutter.dev/layout/

I/flutter ( 4539): If none of the above helps enough to fix this problem, please don't hesitate to file a bug:

I/flutter ( 4539):   https://github.com/flutter/flutter/issues/new?template=BUG.md

I/flutter ( 4539): 

I/flutter ( 4539): The relevant error-causing widget was:

I/flutter ( 4539):   Column

在第二个示例中,屏幕变为白色,但是什么也没有发生并且没有任何效果。出现第一个错误时,屏幕将变为红色,并且我收到您可以在图片中看到的错误!

Red Error on the Screen

2 个答案:

答案 0 :(得分:1)

在列表视图中使用扩展窗口小部件无效,因为扩展窗口小部件无法展开任何高度,因此删除扩展窗口小部件可以解决您的问题。

答案 1 :(得分:0)

I/flutter ( 4539): RenderFlex children have non-zero flex but incoming height constraints are unbounded.

I/flutter ( 4539): When a column is in a parent that does not provide a finite height constraint, for example if it is

我暂时看不到完整的代码,但这对您来说意味着,列表视图需要一种高度,例如,将其包装在容器中时,这种高度是可以给出的。

您可以做的第二件事是将shrinkwrap: true放入列表视图

import 'package:flutter/material.dart';

void main() => runApp(App());

class App extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(),
        body: Center(
          child: Container(
            margin: EdgeInsets.all(32),
            decoration: BoxDecoration(border: Border.all(color: Colors.red)),
            child: ListView(
              shrinkWrap: true,
              children: <Widget>[
                ListTile(title: Text('Item 1')),
                ListTile(title: Text('Item 2')),
                ListTile(title: Text('Item 3')),
              ],
            ),
          ),
        ),
      ),
    );
  }
}

然后,您的列表视图仅占据列表视图自身内部所有小部件或项目的高度。

希望有帮助。