我没有解决RenderBox的问题:ChartContainerRenderObject <num>#84b56 NEEDS-PAINT

时间:2019-09-12 04:47:09

标签: flutter dart

我正在开发一个带有菜单选项卡的应用程序,该菜单选项卡使用Charts_flutter:^ 0.8.0显示3种类型的图表,每个图都有其自己的类来生成其值和特征,条形图效果很好,该图薪水工作正常,但折线图会向我抛出一个与尺寸有关的错误

我试图将LineChart添加到sizebox和容器中,但是它不起作用,或者我做错了


[38;5;248m════════ Exception caught by rendering library ═════════════════════════════════[39;49m
[38;5;244mThe following RangeError was thrown during performLayout():[39;49m
RangeError (end): Invalid value: Not in range 0..6, inclusive: 7

[38;5;244mUser-created ancestor of the error-causing widget was[39;49m
    [38;5;248mLineChart[39;49m
[38;5;244mWhen the exception was thrown, this was the stack[39;49m
[38;5;244m#0      RangeError.checkValidRange  (dart:core/errors.dart:333:9)[39;49m
[38;5;244m#1      List.sublist  (dart:core-patch/growable_array.dart:81:22)[39;49m
[38;5;248m#2      LineRenderer._createAreaSegment[39;49m
[38;5;248m#3      LineRenderer._createLineAndAreaSegmentsForSeries[39;49m
[38;5;248m#4      LineRenderer._createLineAndAreaElements[39;49m
[38;5;244m...[39;49m
[38;5;244mThe following RenderObject was being processed when the exception was fired: ChartContainerRenderObject<num>#e88cb NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE[39;49m
[38;5;244mRenderObject: ChartContainerRenderObject<num>#e88cb NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE[39;49m
    [38;5;244mparentData: <none> (can use size)[39;49m
    [38;5;244mconstraints: BoxConstraints(w=344.0, h=420.0)[39;49m
    [38;5;244msemantic boundary[39;49m
    [38;5;244msize: MISSING[39;49m
[38;5;248m════════════════════════════════════════════════════════════════════════════════[39;49m

[38;5;248m════════ Exception caught by rendering library ═════════════════════════════════[39;49m
RenderBox was not laid out: ChartContainerRenderObject<num>#e88cb NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1681 pos 12: 'hasSize'
[38;5;244mUser-created ancestor of the error-causing widget was[39;49m
    [38;5;248mLineChart[39;49m
[38;5;244mThe following RenderObject was being processed when the exception was fired: RenderPointerListener#4f055 NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE[39;49m
[38;5;244mRenderObject: RenderPointerListener#4f055 NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE[39;49m
    [38;5;244mparentData: <none> (can use size)[39;49m
    [38;5;244mconstraints: BoxConstraints(w=344.0, h=420.0)[39;49m
    [38;5;244msize: MISSING[39;49m
    [38;5;244mbehavior: deferToChild[39;49m
    [38;5;244mlisteners: down[39;49m
    [38;5;244mchild: ChartContainerRenderObject<num>#e88cb NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE[39;49m
        [38;5;244mparentData: <none> (can use size)[39;49m
        [38;5;244mconstraints: BoxConstraints(w=344.0, h=420.0)[39;49m
        [38;5;244msemantic boundary[39;49m
        [38;5;244msize: MISSING[39;49m
[38;5;248m════════════════════════════════════════════════════════════════════════════════[39;49m

[38;5;248m════════ Exception caught by rendering library ═════════════════════════════════[39;49m
RenderBox was not laid out: RenderPointerListener#4f055 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1681 pos 12: 'hasSize'
[38;5;244mUser-created ancestor of the error-causing widget was[39;49m
    [38;5;248mLineChart[39;49m
[38;5;248m════════════════════════════════════════════════════════════════════════════════[39;49m

[38;5;248m════════ Exception caught by rendering library ═════════════════════════════════[39;49m
RenderBox was not laid out: RenderSemanticsGestureHandler#379af NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1681 pos 12: 'hasSize'
[38;5;244mUser-created ancestor of the error-causing widget was[39;49m
    [38;5;248mLineChart[39;49m
[38;5;248m════════════════════════════════════════════════════════════════════════════════[39;49m

[38;5;248m════════ Exception caught by rendering library ═════════════════════════════════[39;49m
RenderBox was not laid out: ChartContainerRenderObject<num>#e88cb
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1681 pos 12: 'hasSize'
[38;5;244mUser-created ancestor of the error-causing widget was[39;49m
    [38;5;248mLineChart[39;49m
[38;5;248m════════════════════════════════════════════════════════════════════════════════

折线图的类别为:


import 'package:flutter/material.dart';
import 'package:charts_flutter/flutter.dart' as charts;

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

class LineChart extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MyHomePage();
  }
}

class MyHomePage extends StatefulWidget {

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

class _MyHomePageState extends State<MyHomePage> {
  List<charts.Series<Sales, int>> _seriesLineData;

    _generarData(){

    var linesalesdata = [
      Sales(0, 45),
      Sales(1, 56),
      Sales(2, 55),
      Sales(3, 60),
      Sales(4, 61),
      Sales(5, 70),
    ];

    var linesalesdata1 = [
      Sales(0, 35),
      Sales(1, 46),
      Sales(2, 45),
      Sales(3, 50),
      Sales(4, 51),
      Sales(5, 60),
    ];

    var linesalesdata2 = [
      Sales(0, 20),
      Sales(1, 24),
      Sales(2, 25),
      Sales(3, 40),
      Sales(4, 45),
      Sales(5, 60),
      Sales(5, 60),
    ];

    _seriesLineData.add(
      charts.Series(
        colorFn: (__, _) => charts.ColorUtil.fromDartColor(Color(0xff990099)),
        id: 'Air Pollution',
        data: linesalesdata,
        domainFn: (Sales sales, _) => sales.yearval,
        measureFn: (Sales sales, _) => sales.salesval,
      ),
    );
    _seriesLineData.add(
      charts.Series(
        colorFn: (__, _) => charts.ColorUtil.fromDartColor(Color(0xff109618)),
        id: 'Air Pollution',
        data: linesalesdata1,
        domainFn: (Sales sales, _) => sales.yearval,
        measureFn: (Sales sales, _) => sales.salesval,
      ),
    );
    _seriesLineData.add(
      charts.Series(
        colorFn: (__, _) => charts.ColorUtil.fromDartColor(Color(0xffff9900)),
        id: 'Air Pollution',
        data: linesalesdata2,
        domainFn: (Sales sales, _) => sales.yearval,
        measureFn: (Sales sales, _) => sales.salesval,
      ),
    );
  }

  @override
  void initState(){
    super.initState();
    _seriesLineData = List<charts.Series<Sales, int>>();
    _generarData();
  }

  @override
  Widget build(BuildContext context) {
    return Padding(
      padding: EdgeInsets.all(8.0),
      child: Container(
        child: Center(
          child: Column(
            children: <Widget>[
              Text('Ventas en los ultimos 5 años',style: TextStyle(fontSize: 24.0,fontWeight: FontWeight.bold),),
              Expanded(
                child: charts.LineChart(
                  _seriesLineData,
                  defaultRenderer: charts.LineRendererConfig(includeArea: true, stacked: true),
                  animate: true,
                  animationDuration: Duration(seconds: 5),
                  behaviors: [
                    charts.ChartTitle('Años',
                    behaviorPosition: charts.BehaviorPosition.bottom,
                    titleOutsideJustification:charts.OutsideJustification.middleDrawArea),
                    charts.ChartTitle('Ventas',
                    behaviorPosition: charts.BehaviorPosition.start,
                    titleOutsideJustification: charts.OutsideJustification.middleDrawArea),
                    charts.ChartTitle('Departamentos',
                    behaviorPosition: charts.BehaviorPosition.end,
                    titleOutsideJustification:charts.OutsideJustification.middleDrawArea)
                  ]
                ),
              ),
            ],
          ),
        ),
      ),
    );
  }
}

class Sales {
  int yearval;
  int salesval;

  Sales(this.yearval, this.salesval);
}

2 个答案:

答案 0 :(得分:0)

查看您的变量linesalesdata2Sales(5, 60),重复了两次。只需将最后一项更正为Sales(6, 60),它就可以解决您的问题。

答案 1 :(得分:0)

第1步:丢失了MaterialApp
步骤2:linesalesdata2具有重复的Sales(5,60)
第3步:将重复的空气污染ID更改为1或2,如果您使用相同的ID,则在单击行时,只有一个点将显示,另外两个点将不显示
步骤4:使用容器

包装填充物

完整代码,没有错误消息

import 'package:flutter/material.dart';
import 'package:charts_flutter/flutter.dart' as charts;

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

class LineChart extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(home: MyHomePage());
  }
}

class MyHomePage extends StatefulWidget {

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

class _MyHomePageState extends State<MyHomePage> {
  List<charts.Series<Sales, int>> _seriesLineData;

  _generarData(){

    var linesalesdata = [
      Sales(0, 45),
      Sales(1, 56),
      Sales(2, 55),
      Sales(3, 60),
      Sales(4, 61),
      Sales(5, 70),
    ];

    var linesalesdata1 = [
      Sales(0, 35),
      Sales(1, 46),
      Sales(2, 45),
      Sales(3, 50),
      Sales(4, 51),
      Sales(5, 60),
    ];

    var linesalesdata2 = [
      Sales(0, 20),
      Sales(1, 24),
      Sales(2, 25),
      Sales(3, 40),
      Sales(4, 45),
      Sales(5, 60),
      //Sales(5, 60),
    ];

    _seriesLineData.add(
      charts.Series(
        colorFn: (__, _) => charts.ColorUtil.fromDartColor(Color(0xff990099)),
        id: 'Air Pollution',
        data: linesalesdata,
        domainFn: (Sales sales, _) => sales.yearval,
        measureFn: (Sales sales, _) => sales.salesval,
      ),
    );
    _seriesLineData.add(
      charts.Series(
        colorFn: (__, _) => charts.ColorUtil.fromDartColor(Color(0xff109618)),
        id: 'Air Pollution1',
        data: linesalesdata1,
        domainFn: (Sales sales, _) => sales.yearval,
        measureFn: (Sales sales, _) => sales.salesval,
      ),
    );
    _seriesLineData.add(
      charts.Series(
        colorFn: (__, _) => charts.ColorUtil.fromDartColor(Color(0xffff9900)),
        id: 'Air Pollution2',
        data: linesalesdata2,
        domainFn: (Sales sales, _) => sales.yearval,
        measureFn: (Sales sales, _) => sales.salesval,
      ),
    );
  }

  @override
  void initState(){
    super.initState();
    _seriesLineData = List<charts.Series<Sales, int>>();
    _generarData();
  }

  @override
  Widget build(BuildContext context) {
    return Container(
      child: Padding(
        padding: EdgeInsets.all(8.0),
        child: Container(
          child: Center(
            child: Column(
              children: <Widget>[
                Text('Ventas en los ultimos 5 años',style: TextStyle(fontSize: 24.0,fontWeight: FontWeight.bold),),
                Expanded(
                  child: charts.LineChart(
                      _seriesLineData,
                      defaultRenderer: charts.LineRendererConfig(includeArea: true, stacked: true),
                      animate: true,
                      animationDuration: Duration(seconds: 5),
                      behaviors: [
                        charts.ChartTitle('Años',
                            behaviorPosition: charts.BehaviorPosition.bottom,
                            titleOutsideJustification:charts.OutsideJustification.middleDrawArea),
                        charts.ChartTitle('Ventas',
                            behaviorPosition: charts.BehaviorPosition.start,
                            titleOutsideJustification: charts.OutsideJustification.middleDrawArea),
                        charts.ChartTitle('Departamentos',
                            behaviorPosition: charts.BehaviorPosition.end,
                            titleOutsideJustification:charts.OutsideJustification.middleDrawArea)
                      ]
                  ),
                ),
              ],
            ),
          ),
        ),
      ),
    );
  }
}

class Sales {
  int yearval;
  int salesval;

  Sales(this.yearval, this.salesval);
}

enter image description here