代码之家  ›  专栏  ›  技术社区  ›  key Austin HLYO

调用颤振中的多个不同图表-图表颤振0.5.0包

  •  1
  • key Austin HLYO  · 技术社区  · 5 年前

    我有一个简单的条形图,来自包装图,我想在另一个页面这样叫它,或者我的目标是,让更多的图表像饼图和其他一些图表一样进入它。

     Widget build(BuildContext context) {
    
        List<Series> seriesList;
    
        return Scaffold(
          appBar: AppBar(
            elevation: 0,
            title: Text(
              "Charts",
              style: TextStyle(color: Colors.blueGrey),
              textAlign: TextAlign.center,
            ),
            backgroundColor: Colors.transparent,
            iconTheme: IconThemeData(color: Colors.blueGrey),
          ),
          body: ListView(
            children: <Widget>[
              SimpleBarChart(seriesList), //<-- I've added this line
            ],
          ),
        );
      }
    

    图表的代码如下:在此处查找更多信息: https://google.github.io/charts/flutter/gallery.html

    /// Bar chart example
    import 'package:charts_flutter/flutter.dart' as charts;
    import 'package:flutter/material.dart';
    
    class SimpleBarChart extends StatelessWidget {
      final List<charts.Series> seriesList;
      final bool animate;
    
      SimpleBarChart(this.seriesList, {this.animate});
    
      /// Creates a [BarChart] with sample data and no transition.
      factory SimpleBarChart.withSampleData() {
        return new SimpleBarChart(
          _createSampleData(),
          // Disable animations for image tests.
          animate: false,
        );
      }
    
    
      @override
      Widget build(BuildContext context) {
        return new charts.BarChart(
          seriesList,
          animate: animate,
        );
      }
    
      /// Create one series with sample hard coded data.
      static List<charts.Series<OrdinalSales, String>> _createSampleData() {
        final data = [
          new OrdinalSales('2014', 5),
          new OrdinalSales('2015', 25),
          new OrdinalSales('2016', 100),
          new OrdinalSales('2017', 75),
        ];
    
        return [
          new charts.Series<OrdinalSales, String>(
            id: 'Sales',
            colorFn: (_, __) => charts.MaterialPalette.blue.shadeDefault,
            domainFn: (OrdinalSales sales, _) => sales.year,
            measureFn: (OrdinalSales sales, _) => sales.sales,
            data: data,
          )
        ];
      }
    }
    
    /// Sample ordinal data type.
    class OrdinalSales {
      final String year;
      final int sales;
    
      OrdinalSales(this.year, this.sales);
    }
    

    目前我收到一个白页,有这个错误

    e/flutter(14450):[错误:flutter/shell/common/shell.cc(184)]dart错误:未处理的异常:

    e/flutter(14450):无法对从未布置的渲染框进行测试。

    e/flutter(14450):在此renderbox上调用了hitest()方法:

    e/flutter(14450):渲染器rorbox 20CD4需求-布局需求-油漆

    e/flutter(14450):不幸的是,目前还不知道这个物体的几何结构,可能是因为它从未被布置好。这意味着它不能被准确的命中测试。如果试图在布局阶段本身执行命中测试,请确保只命中已完成布局的测试节点(例如,在调用了节点的layout()方法之后,节点的子节点)。

    这是包装: https://pub.dartlang.org/packages/charts_flutter#-readme-tab-

    2 回复  |  直到 5 年前
        1
  •  1
  •   Jordan Davies    5 年前

    问题是因为您传递的是一个空对象( seriesList 进入你的 BarChart 构造函数。

    试试这个:

    Widget build(BuildContext context) {
      List<Series> seriesList;
    
      return Scaffold(
        appBar: AppBar(
          elevation: 0,
          title: Text(
            "Charts",
            style: TextStyle(color: Colors.blueGrey),
            textAlign: TextAlign.center,
          ),
          backgroundColor: Colors.transparent,
          iconTheme: IconThemeData(color: Colors.blueGrey),
        ),
        body: SimpleBarChart.withSampleData(), //<-- I've added this line
      );
    }
    
        2
  •  2
  •   key Austin HLYO    5 年前

    仅适用于将来看到此问题并希望添加多个不同图表的其他人:

    body: ListView(
            children: <Widget>[
                  Column(
                    children: <Widget>[
                      Container(
                          width: 200.0,
                          height: 200.0,
                          child: SimpleBarChart.withSampleData()
                      ),
                      Container(
                        height: 200.0,
                        width: 200.0,
                        child: PieOutsideLabelChart.withSampleData(),
                      ),
                    ],
                  ),
            ],
          )