flutter - 如何修复此错误：偏移参数包含 NaN 值。'dart：ui/painting.dart'：断言失败：第 43 行：''

Question

我正在尝试创建一个带有颤振工具提示的时间序列图表，但我无法克服此错误消息。“偏移量参数包含一个 NaN 值。'dart:ui/painting.dart'：断言失败：第 43 行：''”。https://github.com/google/charts/issues/58是我从中获得此代码的地方，但似乎没有其他人有这个问题。尝试在该 github 页面上找到的其他类型的图表和不同的代码块时，总是会出现相同的错误消息。以下是相关代码：

import 'package:charts_flutter/flutter.dart' as charts;
import 'package:flutter/material.dart';
import 'dart:math';
import 'package:charts_flutter/flutter.dart';
import 'package:charts_flutter/src/text_element.dart' as text;
import 'package:charts_flutter/src/text_style.dart' as style;

class CustomMeasureTickCount extends StatelessWidget {
  final List<charts.Series> seriesList;
  final bool animate;
  static String pointerValue;
  CustomMeasureTickCount(this.seriesList, {this.animate});

  factory CustomMeasureTickCount.withSampleData() {
    return new CustomMeasureTickCount(
      _createSampleData(),
      animate: false,
    );
  }

  @override
  Widget build(BuildContext context) {
    return new charts.TimeSeriesChart(seriesList,
        animate: animate,
        behaviors: [
          LinePointHighlighter(symbolRenderer: CustomCircleSymbolRenderer())
        ],
        selectionModels: [
          SelectionModelConfig(changedListener: (SelectionModel model) {
            if (model.hasDatumSelection)
              pointerValue = model.selectedSeries[0]
                  .measureFn(model.selectedDatum[0].index)
                  .toString();
          })
        ],

        /// Customize the measure axis to have 10 ticks
        primaryMeasureAxis: new charts.NumericAxisSpec(
            tickProviderSpec:
                new charts.BasicNumericTickProviderSpec(desiredTickCount: 10)));
  }

  /// Create one series with sample hard coded data.
  static List<charts.Series<MyRow, DateTime>> _createSampleData() {
    final data = [
      new MyRow(new DateTime(2017, 9, 25), 6),
      new MyRow(new DateTime(2017, 9, 26), 8),
      new MyRow(new DateTime(2017, 9, 27), 6),
      new MyRow(new DateTime(2017, 9, 28), 9),
      new MyRow(new DateTime(2017, 9, 29), 11),
      new MyRow(new DateTime(2017, 9, 30), 15),
      new MyRow(new DateTime(2017, 10, 01), 25),
      new MyRow(new DateTime(2017, 10, 02), 33),
      new MyRow(new DateTime(2017, 10, 03), 27),
      new MyRow(new DateTime(2017, 10, 04), 31),
      new MyRow(new DateTime(2017, 10, 05), 23),
    ];

    return [
      new charts.Series<MyRow, DateTime>(
        id: 'Cost',
        domainFn: (MyRow row, _) => row.timeStamp,
        measureFn: (MyRow row, _) => row.cost,
        data: data,
        colorFn: (_, __) => charts.MaterialPalette.indigo.shadeDefault,
      )
    ];
  }
}

/// Sample time series data type.
class MyRow {
  final DateTime timeStamp;
  final int cost;
  MyRow(this.timeStamp, this.cost);
}

class CustomCircleSymbolRenderer extends CircleSymbolRenderer {
  @override
  void paint(ChartCanvas canvas, Rectangle bounds,
      {List dashPattern,
      Color fillColor,
      FillPatternType fillPattern,
      Color strokeColor,
      double strokeWidthPx}) {
    super.paint(canvas, bounds,
        dashPattern: dashPattern,
        fillColor: fillColor,
        fillPattern: fillPattern,
        strokeColor: strokeColor,
        strokeWidthPx: strokeWidthPx);
    canvas.drawRect(
        Rectangle(bounds.left - 5, bounds.top - 30, bounds.width + 10,
            bounds.height + 10),
        fill: Color.white);
    var textStyle = style.TextStyle();
    textStyle.color = Color.black;
    textStyle.fontSize = 15;
    canvas.drawText(
        text.TextElement(CustomMeasureTickCount.pointerValue, style: textStyle),
        (bounds.left).round(),
        (bounds.top - 28).round());
  }
}

标签： flutterdartflutter-layoutflutter-webflutter-animation

Answer 1

发生错误是因为在文本字段处于焦点时发生了新事件，例如导航到新页面。要解决此问题，只需从文本字段中删除焦点即可。

例如 FocusScope.of(context).requestFocus(new FocusNode());