时间戳

首页 > 解决方案 > Flutter：使用提供程序包在帧错误期间计划构建

flutter - Flutter：使用提供程序包在帧错误期间计划构建

问题描述

嘿伙计们，我需要帮助来调试正在发生的事情。我收到以下错误（如下）。我是新来的颤振，任何帮助将不胜感激。我在这里要做的是，只要有人双击图表（使用十字准线功能），它就会创建一个新的数据点并重新绘制图表。谢谢！

错误：════════基础库捕获的异常═══════════════════════════════以下断言在为 PlotData 发送通知时抛出：在帧期间计划构建。在构建、布局和绘制小部件树的同时，安排了一个新框架来重建小部件树。

我所有的代码：

import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
import 'package:syncfusion_flutter_charts/charts.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
// This tokwidget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MultiProvider(
      providers: [
        ChangeNotifierProvider(create: (_) => PlotData()),
      ],
      child: Consumer<PlotData>(builder: (context, plotData, _) {
        return MaterialApp(
          home: FirstPage(),
        );
      }),
    );
  }
}

class SalesData {
  SalesData(this.year, this.sales);
  final String year;
  final double sales;
}

class PlotData extends ChangeNotifier {
  List<SalesData> data = [
    SalesData('Jan', 35),
    SalesData('Feb', 28),
    SalesData('Mar', 34),
    SalesData('Apr', 32),
    SalesData('May', 40)
  ];
  void addData(List selectedPoint) {
    print("Current Length of data: " + data.length.toString());
    List<SalesData> addPoint = [
      SalesData(selectedPoint[0], double.parse(selectedPoint[1]))
    ];
    data = data + addPoint;
    print("Now Data has Length of: " + data.length.toString());
    notifyListeners();
  }

  List<SalesData> get allData => data;
}

class VolumeChart extends StatelessWidget {
// Holds the selected points by the user
  List selectedPoint = [];
//VolumeChart(this.data);
  @override
  Widget build(BuildContext context) {
    return SfCartesianChart(
      onCrosshairPositionChanging: (CrosshairRenderArgs args) {
// Crosshair calls this function twice, once for the x,y values respectively
// we capture the full data point string in a list that empties itself when new points are selected
        if (selectedPoint.length == 2) {
          selectedPoint = [];
        }
        selectedPoint.add(args.value); // save the coordinates of the point
// @TODO delete this later, used for prinitng coordinates
        if (selectedPoint.length == 2) {
          Provider.of<PlotData>(context, listen: false).addData(selectedPoint);
//print(selectedPoint.toString());
        }
      },
// Enables the tooltip for all the series in chart
      crosshairBehavior: CrosshairBehavior(
          activationMode: ActivationMode.doubleTap, enable: true),
// Initialize category axis
      primaryXAxis: CategoryAxis(),
      series: <ChartSeries>[
// Initialize line series
        LineSeries<SalesData, String>(
// Enables the tooltip for individual series
            enableTooltip: true,
            dataSource: Provider.of<PlotData>(context, listen: true).allData,
            xValueMapper: (SalesData sales, _) => sales.year,
            yValueMapper: (SalesData sales, _) => sales.sales),
      ],
    );
  }
}

class FirstPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Column(
      children: <Widget>[
        VolumeChart(),
      ],
    );
  }
}

标签： flutterdartflutter-dependenciesflutter-provider

解决方案

您不需要使用 调用提供程序的实例listen: true，因为这是默认值。

我会建议您避免使用 aconsumer作为 the 的直接后代， MaterialApp而是这样做；

class MyApp extends StatelessWidget {
// This tokwidget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MultiProvider(
      providers: [
        ChangeNotifierProvider(create: (_) => PlotData()),
      ],
      child:  MaterialApp(
          home: FirstPage.create(context),

      }),
    );
  }
}

然后执行FirstPage如下；

class FirstPage extends StatelessWidget {
   final PlotData plotData; 
   FirstPage({@required this.plotData});

  static Widget create(BuildContext context){
       final plotDataInstant = Provider.of<PlotData>(context, listen: false);
       return FirstPage(plotData: plotDataInstant);
  }

  @override
  Widget build(BuildContext context) {
    return Column(
      children: <Widget>[
        VolumeChart(),
      ],
    );
  }
}

我希望这有帮助！

推荐阅读