rCustomMultiChildLayoutBox对象在布局过

rCustomMultiChildLayoutBox对象在布局过

本文介绍了RenderCustomMultiChildLayoutBox对象在布局过程中被赋予了无限大小.颤动误差的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我对flutter陌生,正在尝试在flutter中实现自定义列表视图.在布局错误期间,将其给定的RenderCustomMultiChildLayoutBox对象赋予无限大小

I am new to flutter and am trying to implement custom list view in flutter.Its giving be RenderCustomMultiChildLayoutBox object was given an infinite size during layout error

  1. 我无法为哪个小部件获取其抛出错误

2还请建议如何调试这些布局错误,因为错误跟踪没有针对其引发错误的特定窗口小部件信息

2 Also please suggest how to debug these layout errors as the error trace doesn't have specific widget info for which error is thrown

请找到以下相同的代码:

please find the below code for the same:

      class ChatItemSreen extends StatelessWidget {
      var leftSection;
      var middleSection;
      var rightSection;
      ChatModel _chartObj;

      ChatItemSreen(ChatModel _chartObj) {
        this._chartObj = _chartObj;
        //.........the left section ...........................
        CircleAvatar image = new CircleAvatar(
          backgroundColor: Colors.lightGreen,
          backgroundImage: new NetworkImage(this._chartObj.geturl()),
          radius: 24.0,
        );

        leftSection = new Container(child: image);

        //.........the middle section ...........................
        middleSection = new Expanded(
            child: new Container(
          padding: new EdgeInsets.only(left: 8.0),
          child: new Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            mainAxisAlignment: MainAxisAlignment.spaceAround,
            children: <Widget>[
              new Text(this._chartObj.getuserName(),
                  style: new TextStyle(
                      color: Colors.black,
                      fontWeight: FontWeight.w300,
                      fontSize: 16.0)),
              new Text(this._chartObj.getmessage(),
                  style: new TextStyle(color: Colors.grey))
            ],
          ),
        ));

        //.........the right section ...........................

        rightSection = new Container(
          child: new Column(
            mainAxisAlignment: MainAxisAlignment.spaceAround,
            children: <Widget>[
              new Text(this._chartObj.gettimeStamp()),
              new CircleAvatar(
                  backgroundColor: Colors.lightGreen,
                  radius: 12.0,
                  child: new Text(
                    this._chartObj.getunreadMsgNo(),
                    style: new TextStyle(color: Colors.white, fontSize: 12.0),
                  ))
            ],
          ),
        );
      }

      @override
      Widget build(BuildContext context) {
        return new Scaffold(
          body: new Container(
              margin: new EdgeInsets.all(2.0),
              child: new Row(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: <Widget>[leftSection, middleSection, rightSection],
              )),
        );
      }
    }

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(title: "Shashank List", home: RandomWords());
  }
}

class RowItemState extends State<RandomWords>
{
  final List<ChatModel> items = new List();

  @override
  void initState()
  {
    super.initState();
    setState(()
    {
      items.add(new ChatModel("http://img2.thejournal.ie/inline/2470754/original?width=428&version=2470754", "9:35", "2", "Shashank", "Missed vedio call!!"));
      items.add(new ChatModel("http://img2.thejournal.ie/inline/2470754/original?width=428&version=2470754", "10:35", "3", "Kakroo", "Missed vedio call!!"));
      items.add(new ChatModel("http://img2.thejournal.ie/inline/2470754/original?width=428&version=2470754", "02:45", "4", "Alpha 1", "Missed vedio call!!"));
      items.add(new ChatModel("http://img2.thejournal.ie/inline/2470754/original?width=428&version=2470754", "12:30", "6", "Beta 2", "Missed vedio call!!"));

    });
  }

  @override
  Widget build(BuildContext context)
  {
    return MaterialApp(
        home: ListView.builder(
          itemCount: items.length,
          itemBuilder: (context,position)
            {
              ChatModel obj = items.elementAt(position);
              return new ChatItemSreen(obj);
            }
        ),
    );
  }
}

给我下面的错误:

XCEPTION CAUGHT BY RENDERING LIBRARY ╞═════════════════════════════════════════════════════════
I/flutter (15078): The following assertion was thrown during performLayout():
I/flutter (15078): RenderCustomMultiChildLayoutBox object was given an infinite size during layout.
I/flutter (15078): This probably means that it is a render object that tries to be as big as possible, but it was put
I/flutter (15078): inside another render object that allows its children to pick their own size.
I/flutter (15078): The nearest ancestor providing an unbounded height constraint is:
I/flutter (15078):   RenderIndexedSemantics#a9825 relayoutBoundary=up3 NEEDS-LAYOUT NEEDS-PAINT
I/flutter (15078):   creator: IndexedSemantics ← NotificationListener<KeepAliveNotification> ← KeepAlive ←
I/flutter (15078):   AutomaticKeepAlive ← SliverList ← MediaQuery ← SliverPadding ← Viewport ← _ScrollableScope ←
I/flutter (15078):   IgnorePointer-[GlobalKey#e8d9b] ← Semantics ← Listener ← ⋯
I/flutter (15078):   parentData: index=0; layoutOffset=0.0 (can use size)
I/flutter (15078):   constraints: BoxConstraints(w=411.4, 0.0<=h<=Infinity)
I/flutter (15078):   semantic boundary
I/flutter (15078):   size: MISSING
I/flutter (15078):   index: 0
I/flutter (15078): The constraints that applied to the RenderCustomMultiChildLayoutBox were:
I/flutter (15078):   BoxConstraints(w=411.4, 0.0<=h<=Infinity)
I/flutter (15078): The exact size it was given was:
I/flutter (15078):   Size(411.4, Infinity)
I/flutter (15078): See https://flutter.io/layout/ for more information.

推荐答案

在尝试在文本的各个段落之间包含可缩放的 PhotoView 小部件时,我遇到了这个确切的问题.

I had this exact problem while trying to include a pinch-and-zoomable PhotoView widget among separate paragraphs of text.

编译并运行该应用程序时,您可能会注意到,应该让您的问题小部件所在的地方是一个无限长的黑色区域.

When you compile and run the app, you probably noticed that where your offending widget is supposed to be is an infinitely long black area instead.

错误的第二行显示为

这意味着需要限制小部件的大小.

which implies that the widget's size needs to be constrained.

我的解决方案是将 PhotoView 包装在 SizedBox 小部件中.

My solution was to wrap the PhotoView in a SizedBox widget.

...
   Text("Here's some text.\nAnd then there's this image:\n"),
   SizedBox(
      width: 200.0,
      height: 300.0,
      child: PhotoView(
            imageProvider: NetworkImage("http://image/url/here.jpg"),
            heroTag: "Lauren Mayberry",
            ),
   ),
   Text("And now more text"),
...

在此示例中,我使用了固定的宽度和高度,但是您始终可以根据其中包含的内容来动态调整窗口小部件的大小.

In this example, I used a fixed width and height but you could always dynamically size your widget based on whatever content belongs therein.

关于如何更好地调试布局错误:我唯一的建议是一次删除一个小部件,直到错误消失.当然肯定不理想,但是可以.

As for how to better debug layout errors: my only suggestion is to remove widgets one at a time until the error goes away. It's certainly less than ideal but it works.

这篇关于RenderCustomMultiChildLayoutBox对象在布局过程中被赋予了无限大小.颤动误差的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

09-03 01:02