RenderBox 未布置:RenderFlex#4a60a 需要-油漆需要-合成-位-更新

Posted

技术标签:

【中文标题】RenderBox 未布置:RenderFlex#4a60a 需要-油漆需要-合成-位-更新【英文标题】:RenderBox was not laid out: RenderFlex#4a60a NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE 【发布时间】:2020-09-23 23:06:56 【问题描述】:

当我运行代码时,我在DEBUG Console 中发现了这个错误,如下所示:

Restarted application in 2,804ms.

[38;5;248m════════ Exception caught by rendering library ═════════════════════════════════[39;49m
[38;5;244mThe following assertion was thrown during performLayout():[39;49m
Leading widget consumes entire tile width. Please use a sized widget.
'package:flutter/src/material/list_tile.dart':
Failed assertion: line 1353 pos 7: 'tileWidth != leadingSize.width'


[38;5;248mEither the assertion indicates an error in the framework itself, or we should provide substantially more information in this error message to help you determine and fix the underlying cause.
In either case, please report this assertion by filing a bug on GitHub:
  https://github.com/flutter/flutter/issues/new?template=BUG.md
[39;49m

[38;5;244mThe relevant error-causing widget was[39;49m
    [38;5;248mListTile[39;49m
[38;5;244mWhen the exception was thrown, this was the stack[39;49m
[38;5;244m#2      _RenderListTile.performLayout[39;49m
[38;5;244m#3      RenderObject.layout[39;49m
[38;5;244m#4      RenderPadding.performLayout[39;49m
[38;5;244m#5      RenderObject.layout[39;49m
[38;5;244m#6      RenderProxyBoxMixin.performLayout[39;49m
[38;5;244m...[39;49m
[38;5;244mThe following RenderObject was being processed when the exception was fired: _RenderListTile#a7a4d relayoutBoundary=up9 NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE[39;49m
[38;5;244mRenderObject: _RenderListTile#a7a4d relayoutBoundary=up9 NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE[39;49m
    [38;5;244mparentData: offset=Offset(0.0, 0.0) (can use size)[39;49m
    [38;5;244mconstraints: BoxConstraints(w=0.0, 0.0<=h<=Infinity)[39;49m
    [38;5;244msize: MISSING[39;49m
    [38;5;244mtitle: RenderParagraph#47706 NEEDS-LAYOUT NEEDS-PAINT[39;49m
        [38;5;244mparentData: offset=Offset(0.0, 0.0)[39;49m
        [38;5;244mconstraints: MISSING[39;49m
        [38;5;244msize: MISSING[39;49m
        [38;5;244mtextAlign: left[39;49m
        [38;5;244mtextDirection: ltr[39;49m
        [38;5;244msoftWrap: wrapping at box width[39;49m
        [38;5;244moverflow: clip[39;49m
        [38;5;244mlocale: en_US[39;49m
        [38;5;244mmaxLines: unlimited[39;49m
        [38;5;244mtext: TextSpan[39;49m
            [38;5;244mdebugLabel: (((englishLike subhead 2014).merge(blackCupertino subtitle1)).copyWith).merge(unknown)[39;49m
            [38;5;244minherit: false[39;49m
            [38;5;244mcolor: MaterialColor(primary value: Color(0xff03a9f4))[39;49m
            [38;5;244mfamily: WorkSans[39;49m
            [38;5;244msize: 16.0[39;49m
            [38;5;244mweight: 600[39;49m
            [38;5;244mbaseline: alphabetic[39;49m
            [38;5;244mdecoration: TextDecoration.none[39;49m
            [38;5;244m"Sign Out"[39;49m
    [38;5;244mtrailing: RenderSemanticsAnnotations#705a3 relayoutBoundary=up10 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE[39;49m
        [38;5;244mparentData: offset=Offset(0.0, 0.0) (can use size)[39;49m
        [38;5;244mconstraints: BoxConstraints(w=0.0, 0.0<=h<=56.0)[39;49m
        [38;5;244msize: Size(0.0, 24.0)[39;49m
        [38;5;244mchild: RenderExcludeSemantics#60a3d relayoutBoundary=up11 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE[39;49m
            [38;5;244mparentData: <none> (can use size)[39;49m
            [38;5;244mconstraints: BoxConstraints(w=0.0, 0.0<=h<=56.0)[39;49m
            [38;5;244msize: Size(0.0, 24.0)[39;49m
            [38;5;244mexcluding: true[39;49m
            [38;5;244mchild: RenderConstrainedBox#bc3b1 relayoutBoundary=up12 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE[39;49m
                [38;5;244mparentData: <none> (can use size)[39;49m
                [38;5;244mconstraints: BoxConstraints(w=0.0, 0.0<=h<=56.0)[39;49m
                [38;5;244msize: Size(0.0, 24.0)[39;49m
                [38;5;244madditionalConstraints: BoxConstraints(w=24.0, h=24.0)[39;49m
                [38;5;244mchild: RenderPositionedBox#c7d80 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE[39;49m
                    [38;5;244mparentData: <none> (can use size)[39;49m
                    [38;5;244mconstraints: BoxConstraints(w=0.0, h=24.0)[39;49m
                    [38;5;244msize: Size(0.0, 24.0)[39;49m
                    [38;5;244malignment: center[39;49m
                    [38;5;244mtextDirection: ltr[39;49m
                    [38;5;244mwidthFactor: expand[39;49m
                    [38;5;244mheightFactor: expand[39;49m
[38;5;248m════════════════════════════════════════════════════════════════════════════════[39;49m

[38;5;248m════════ Exception caught by rendering library ═════════════════════════════════[39;49m
RenderBox was not laid out: _RenderListTile#a7a4d relayoutBoundary=up9 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1694 pos 12: 'hasSize'
[38;5;244mThe relevant error-causing widget was[39;49m
    [38;5;248mListTile[39;49m
[38;5;248m════════════════════════════════════════════════════════════════════════════════[39;49m

[38;5;248m════════ Exception caught by rendering library ═════════════════════════════════[39;49m
RenderBox was not laid out: RenderPadding#0b562 relayoutBoundary=up8 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1694 pos 12: 'hasSize'
[38;5;244mThe relevant error-causing widget was[39;49m
    [38;5;248mListTile[39;49m
[38;5;248m════════════════════════════════════════════════════════════════════════════════[39;49m

[38;5;248m════════ Exception caught by rendering library ═════════════════════════════════[39;49m
RenderBox was not laid out: RenderSemanticsAnnotations#7c546 relayoutBoundary=up7 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1694 pos 12: 'hasSize'
[38;5;244mThe relevant error-causing widget was[39;49m
    [38;5;248mListTile[39;49m
[38;5;248m════════════════════════════════════════════════════════════════════════════════[39;49m

[38;5;248m════════ Exception caught by rendering library ═════════════════════════════════[39;49m
RenderBox was not laid out: RenderPointerListener#6507d relayoutBoundary=up6 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1694 pos 12: 'hasSize'
[38;5;244mThe relevant error-causing widget was[39;49m
    [38;5;248mListTile[39;49m
[38;5;248m════════════════════════════════════════════════════════════════════════════════[39;49m

[38;5;248m════════ Exception caught by rendering library ═════════════════════════════════[39;49m
RenderBox was not laid out: RenderSemanticsGestureHandler#d89dc relayoutBoundary=up5 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1694 pos 12: 'hasSize'
[38;5;244mThe relevant error-causing widget was[39;49m
    [38;5;248mListTile[39;49m
[38;5;248m════════════════════════════════════════════════════════════════════════════════[39;49m

[38;5;248m════════ Exception caught by rendering library ═════════════════════════════════[39;49m
RenderBox was not laid out: RenderMouseRegion#b5666 relayoutBoundary=up4 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1694 pos 12: 'hasSize'
[38;5;244mThe relevant error-causing widget was[39;49m
    [38;5;248mListTile[39;49m
[38;5;248m════════════════════════════════════════════════════════════════════════════════[39;49m

[38;5;248m════════ Exception caught by rendering library ═════════════════════════════════[39;49m
RenderBox was not laid out: RenderSemanticsAnnotations#ace43 relayoutBoundary=up3 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1694 pos 12: 'hasSize'
[38;5;244mThe relevant error-causing widget was[39;49m
    [38;5;248mColumn[39;49m
[38;5;248m════════════════════════════════════════════════════════════════════════════════[39;49m

[38;5;248m════════ Exception caught by rendering library ═════════════════════════════════[39;49m
RenderBox was not laid out: RenderFlex#4e86c relayoutBoundary=up2 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1694 pos 12: 'hasSize'
[38;5;244mThe relevant error-causing widget was[39;49m
    [38;5;248mContainer[39;49m
[38;5;248m════════════════════════════════════════════════════════════════════════════════[39;49m

[38;5;248m════════ Exception caught by rendering library ═════════════════════════════════[39;49m
RenderBox was not laid out: _RenderColoredBox#3fe26 relayoutBoundary=up1 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1694 pos 12: 'hasSize'
[38;5;244mThe relevant error-causing widget was[39;49m
    [38;5;248mColumn[39;49m
[38;5;248m════════════════════════════════════════════════════════════════════════════════[39;49m

[38;5;248m════════ Exception caught by rendering library ═════════════════════════════════[39;49m
RenderBox was not laid out: RenderFlex#48686 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1694 pos 12: 'hasSize'
[38;5;244mThe relevant error-causing widget was[39;49m
    [38;5;248mScaffold[39;49m
[38;5;248m════════════════════════════════════════════════════════════════════════════════[39;49m

这是我的完整代码:

import 'package:flutter/rendering.dart';

import '../providers/properties.dart';
import '../providers/cities.dart';
import '../providers/property.dart';
import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
import '../widgets/properties_grid.dart';
import '../app_theme.dart';

class MyHomePage extends StatefulWidget 
  const MyHomePage(Key key) : super(key: key);

  @override
  _MyHomePageState createState() => _MyHomePageState();


class _MyHomePageState extends State<MyHomePage> with TickerProviderStateMixin 
  int currentTab = 0;
  ScrollController _scrollController = ScrollController();
  bool _showBottomBar = true;

  _scrollListener() 
    if (_scrollController.position.userScrollDirection ==
        ScrollDirection.reverse) 
      setState(() 
        _showBottomBar = false;
      );
     else if (_scrollController.position.userScrollDirection ==
        ScrollDirection.forward) 
      setState(() 
        _showBottomBar = true;
      );
    
  
  var _showOnlyFavorites = false;
  AnimationController animationController;
  bool multiple = true;

  @override
  void initState() 
    animationController = AnimationController(
        duration: const Duration(milliseconds: 2000), vsync: this);
    _scrollController.addListener(_scrollListener);
    super.initState();
  

  Future<bool> getData() async 
    await Future<dynamic>.delayed(const Duration(milliseconds: 0));
    return true;
  

  @override
  void dispose() 
    animationController.dispose();
    super.dispose();
  

  @override
  Widget build(BuildContext context) 
    // final properties = Provider.of<Properties>(context, listen: false);
    return Scaffold(
      resizeToAvoidBottomPadding: false,
      extendBody: true,
      floatingActionButton: FloatingActionButton(
        child: Icon(Icons.add),
        onPressed: () ,
      ),
      floatingActionButtonLocation: FloatingActionButtonLocation.centerDocked,
      bottomNavigationBar: AnimatedContainer(
        duration: Duration(milliseconds: 500),
        child: _showBottomBar
            ? BottomAppBar(
                elevation: 0,
                shape: CircularNotchedRectangle(),
                notchMargin: 10,
                child: Container(
                  height: 60,
                  child: Row(
                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                    children: <Widget>[
                      Row(
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: <Widget>[
                          MaterialButton(
                            padding: EdgeInsets.all(0),
                            minWidth: 155,
                            onPressed: () 
                              setState(() 
                                // currentScreen =
                                //     Chat(); // if user taps on this dashboard tab will be active
                                currentTab = 1;
                              );
                            ,
                            child: Column(
                              mainAxisAlignment: MainAxisAlignment.center,
                              children: <Widget>[
                                Icon(
                                  Icons.home,
                                  color: currentTab == 1
                                      ? Colors.blue
                                      : Colors.grey,
                                ),
                                Text(
                                  'Home',
                                  style: TextStyle(
                                    color: currentTab == 1
                                        ? Colors.blue
                                        : Colors.grey,
                                  ),
                                ),
                              ],
                            ),
                          )
                        ],
                      ),

                      // Right Tab bar icons

                      Row(
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: <Widget>[
                          MaterialButton(
                            padding: EdgeInsets.all(0),
                            minWidth: 60,
                            onPressed: () 
                              setState(() 
                                // currentScreen =
                                //     Settings(); // if user taps on this dashboard tab will be active
                                currentTab = 3;
                              );
                            ,
                            child: Column(
                              mainAxisAlignment: MainAxisAlignment.center,
                              children: <Widget>[
                                Icon(
                                  Icons.view_list,
                                  color: currentTab == 3
                                      ? Colors.blue
                                      : Colors.grey,
                                ),
                                Text(
                                  'Property List',
                                  style: TextStyle(
                                    color: currentTab == 3
                                        ? Colors.blue
                                        : Colors.grey,
                                  ),
                                ),
                              ],
                            ),
                          ),
                          MaterialButton(
                            padding: EdgeInsets.all(0),
                            minWidth: 77,
                            onPressed: () 
                              setState(() 
                                // currentScreen =
                                //     Settings(); // if user taps on this dashboard tab will be active
                                currentTab = 4;
                              );
                            ,
                            child: Column(
                              mainAxisAlignment: MainAxisAlignment.center,
                              children: <Widget>[
                                Icon(
                                  Icons.location_searching,
                                  color: currentTab == 4
                                      ? Colors.blue
                                      : Colors.grey,
                                ),
                                Text(
                                  'Map',
                                  style: TextStyle(
                                    color: currentTab == 4
                                        ? Colors.blue
                                        : Colors.grey,
                                  ),
                                ),
                              ],
                            ),
                          ),
                        ],
                      )
                    ],
                  ),
                ),
              )
            : Container(
                color: Colors.white,
                width: MediaQuery.of(context).size.width,
              ),
      ),
      backgroundColor: AppTheme.white,
      body: Stack(
        children: <Widget>[
          FutureBuilder<bool>(
            future: getData(),
            builder: (BuildContext context, AsyncSnapshot<bool> snapshot) 
              if (!snapshot.hasData) 
                return const SizedBox();
               else 
                return Padding(
                  padding:
                      EdgeInsets.only(top: MediaQuery.of(context).padding.top),
                  child: Column(
                    mainAxisAlignment: MainAxisAlignment.center,
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: <Widget>[
                      appBar(),
                      Expanded(
                        child: FutureBuilder<bool>(
                          future: getData(),
                          builder: (BuildContext context,
                              AsyncSnapshot<bool> snapshot) 
                            if (!snapshot.hasData) 
                              return const SizedBox();
                             else 
                              return ChangeNotifierProvider(
                                create: (context) => Properties(),
                                child: PropertiesGrid(_showOnlyFavorites),
                              );
                            
                          ,
                        ),
                      ),
                    ],
                  ),
                );
              
            ,
          ),
        ],
      ),
    );
  

  Widget appBar() 
    return SizedBox(
      height: AppBar().preferredSize.height,
      child: Row(
        mainAxisAlignment: MainAxisAlignment.center,
        children: <Widget>[
          Padding(
            padding: const EdgeInsets.only(top: 8, left: 8),
            child: Container(
              width: AppBar().preferredSize.height - 8,
              height: AppBar().preferredSize.height - 8,
            ),
          ),
          Expanded(
            child: Center(
              child: Padding(
                padding: const EdgeInsets.only(top: 4),
                child:
                    Image.asset('assets/images/logo.png', fit: BoxFit.contain),
              ),
            ),
          ),
          Padding(
            padding: const EdgeInsets.only(top: 8, right: 8),
            child: Container(
              width: AppBar().preferredSize.height - 8,
              height: AppBar().preferredSize.height - 8,
              color: Colors.white,
              child: Material(
                color: Colors.transparent,
                child: InkWell(
                  borderRadius:
                      BorderRadius.circular(AppBar().preferredSize.height),
                  child: Icon(
                    Icons.location_on,
                    color: AppTheme.dark_grey,
                  ),
                  onTap: () 
                    setState(() 
                      multiple = !multiple;
                    );
                  ,
                ),
              ),
            ),
          ),
        ],
      ),
    );
  


我希望有人能和我一起解决这个问题以及如何解决它:)...

可能我认为SizedBox 的高度有问题,就像这个问题Flutter: RenderBox was not laid out 一样,但我尝试添加高度我发现同样的问题...

【问题讨论】:

【参考方案1】:

看起来您将 appBar() 放在了一个列中。这应该在 Scaffold 小部件的 appBar 属性中。 您需要在 Scaffold 中使用 AppBar() Widget。

Scaffold(
  appBar: AppBar(
    title: Text('Put Screen title here'),
    actions: <Widget>[IconButton(
      icon: Icons.location_on,
      onPressed: () 
        setState(() 
           multiple = !multiple;
        );
      ),
    ],
   ),
),

您正在手动设置 appBar 的高度和宽度,但这样做是在对抗 Flutter 框架。

【讨论】:

是的,因为应用栏是列的一部分

以上是关于RenderBox 未布置:RenderFlex#4a60a 需要-油漆需要-合成-位-更新的主要内容,如果未能解决你的问题,请参考以下文章

Flutter:RenderBox 未布置:RenderRepaintBoundary#58c65 relayoutBoundary=up1 NEEDS-PAINT

引发了另一个异常: RenderBox 未布置:CustomRenderShrinkWrappingViewport#f6727 relayoutBoundary=up17 NEEDS-PAINT N

Flutter:未布置RenderBox:RenderRepaintBoundary#58c65 relayoutBoundary = up1 NEEDS-PAINT

垂直视口被赋予了无限的高度。 RenderBox 未布置:RenderViewport#34d12 NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UP

RenderBox 未布局,Flutter Listview Builder 未显示

例外:-尽管删除了扩展的小部件,但没有布置 RenderBox