如何将在标签栏视图中制作的三个图形转换为可滚动视图?

时间:2019-09-02 04:54:45

标签: flutter

return MaterialApp(
  home: DefaultTabController(
    length: 3,
    child: Scaffold(
      appBar: AppBar(
        backgroundColor: Color(0xff1976d2),
        //backgroundColor: Color(0xff308e1c),
        bottom: TabBar(
          indicatorColor: Color(0xff9962D0),
          tabs: [
            Tab(
              icon: Icon(FontAwesomeIcons.solidChartBar),
            ),
            Tab(icon: Icon(FontAwesomeIcons.chartPie)),
            Tab(icon: Icon(FontAwesomeIcons.chartLine)),
          ],
        ),
        title: Text('Flutter Charts'),
      ),
      body: TabBarView(
        children: <Widget>[
          Padding(
            padding: EdgeInsets.all(8.0),
            child: Container(
              child: Center(
                child: Column(
                  children: <Widget>[
                    Text(
                      'Direct Emissions by lpg-cooking, lpg-lab  and diesel (in kg)',style: TextStyle(fontSize: 24.0,fontWeight: FontWeight.bold),),
                    Expanded(
                      child: charts.BarChart(
                        _seriesData,
                        animate: true,
                        barGroupingType: charts.BarGroupingType.stacked,
                        behaviors: [new charts.SeriesLegend()],
                        animationDuration: Duration(seconds: 1),
                      ),
                    ),
                  ],
                ),
              ),
            ),
          ),
          SafeArea(
            child: Padding(
              padding: EdgeInsets.all(5.0),
              child: Container(
                child: Center(
                  child: Column(
                    children: <Widget>[
                      Text(
                        'CO2 produced by electricity',style: TextStyle(fontSize: 24.0,fontWeight: FontWeight.bold),),
                      SizedBox(height: 10.0),
                      Expanded(
                         child:Stack(
                          children:<Widget>[
                           Container(
                           //color: Colors.blue,
                           height: 300.0,
                           width: 300.0,
                           child: dpc,
                         ),
                        Container(
                          // color: Colors.blue,
                          height: 300.0,
                          width: 300.0,
                          child: PieChart(dataMap: dataMap, showLegends: false,),
                        )
                        ],
                           ),
                      ),
                  ],
                      ),
                      ),
                ),
              ),
            ),

          Padding(
            padding: EdgeInsets.all(8.0),
            child: Container(
              child: Center(
                child:Column(
                  children: <Widget>[
                    Text(
                      'CO2 in kg produced by vehicles',style: TextStyle(fontSize: 24.0,fontWeight: FontWeight.bold),),
                    Expanded(
                      child: charts.LineChart(
                          _seriesLineData,
                          defaultRenderer: new charts.LineRendererConfig(
                              includeArea: true, stacked: true),
                          animate: true,
                          animationDuration: Duration(seconds: 1),
                          behaviors: [
                            new charts.SeriesLegend(),
                            new charts.ChartTitle('Months',
                                behaviorPosition: charts.BehaviorPosition.bottom,
                                titleOutsideJustification:charts.OutsideJustification.middleDrawArea),
                          ]
                      ),
                    ),
                  ],
                ),
              ),
            ),
          ),
        ],
      ),
    ),
    ),
  );

1 个答案:

答案 0 :(得分:-1)

根据您的问题,我认为您需要包装您的Container,该容器包含SingleChildScrollView中的几个小部件。记住您正在屏幕中构建的小部件,并希望它们滚动。将SinglechildScrollView用作顶级父项,然后将包装在一起的其余子窗口小部件添加到一个容器中,并将其作为子对象添加到SinglechildScrollView中。

如果我的解决方案解决了您的问题,请接受它的帮助或仅添加您对问题的评论。我一定会设法解决这个问题。下次,请添加您的应用的屏幕截图,以详细说明该问题。谢谢。...学习愉快