Flutter

Question

所以我克隆了这个项目并将所有代码放入一个文件中：https://github.com/JohannesMilke/fl_pie_chart_example

但是，我遇到了一个错误，无法运行我拥有的稳定 Flutter 版本 (2.8.1) 的代码。它抱怨：

The argument type 'void Function(FlTouchEvent)' can't be assigned to the parameter type 'void Function(FlTouchEvent, PieTouchResponse?)?

关于这段代码，错误在touchCallback:

import 'package:fl_chart/fl_chart.dart';
import 'package:flutter/material.dart';

class PieChartPage extends StatefulWidget {
  @override
  State<StatefulWidget> createState() => PieChartPageState();
}

class PieChartPageState extends State {
  int? touchedIndex;

  @override
  Widget build(BuildContext context) => Card(
        child: Column(
          children: <Widget>[
            Expanded(
              child: PieChart(
                PieChartData(
                  pieTouchData: PieTouchData(
                    touchCallback: (pieTouchResponse) {
                      setState(() {
                        if (pieTouchResponse?.touchInput is FlLongPressEnd ||
                            pieTouchResponse.touchInput is FlPanEnd) {
                          touchedIndex = -1;
                        } else {
                          touchedIndex = pieTouchResponse.touchedSectionIndex;
                        }
                      });
                    },
                  ),
                  borderData: FlBorderData(show: false),
                  sectionsSpace: 0,
                  centerSpaceRadius: 80,
                  sections: getSections(touchedIndex!),
                ),
              ),
            ),
            Row(
              mainAxisAlignment: MainAxisAlignment.center,
              children: [
                Padding(
                  padding: const EdgeInsets.all(16),
                  child: IndicatorsWidget(),
                ),
              ],
            ),
          ],
        ),
      );
}

List<PieChartSectionData> getSections(int touchedIndex) => PieData.data
    .asMap()
    .map<int, PieChartSectionData>((index, data) {
      final isTouched = index == touchedIndex;
      final double fontSize = isTouched ? 25 : 16;
      final double radius = isTouched ? 100 : 80;

      final value = PieChartSectionData(
        color: data.color,
        value: data.percent,
        title: '${data.percent}%',
        radius: radius,
        titleStyle: TextStyle(
          fontSize: fontSize,
          fontWeight: FontWeight.bold,
          color: const Color(0xffffffff),
        ),
      );

      return MapEntry(index, value);
    })
    .values
    .toList();

// Data to feed pie chart
class PieData {
  static List<Data> data = [
    Data(name: 'Blue', percent: 20, color: const Color(0xff0293ee)),
    Data(name: 'Yellow', percent: 20, color: const Color(0xFFFFEE00)),
    Data(name: 'Orange', percent: 20, color: Colors.orange),
    Data(name: 'Green', percent: 20, color: const Color(0xff13d38e)),
    Data(name: 'Red', percent: 20, color: const Color(0xFFD81A13))
  ];
}

// Data model for this particular pie chart
class Data {
  final String? name;

  final double? percent;

  final Color? color;

  Data({this.name, this.percent, this.color});
}

class IndicatorsWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) => Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: PieData.data
            .map(
              (data) => Container(
                  padding: EdgeInsets.symmetric(vertical: 2),
                  child: buildIndicator(
                    color: data.color,
                    text: data.name,
                    // isSquare: true,
                  )),
            )
            .toList(),
      );

  // Indicators
  Widget buildIndicator({
    @required Color? color,
    @required String? text,
    bool isSquare = false,
    double size = 16,
    Color textColor = const Color(0xff505050),
  }) =>
      Row(
        children: <Widget>[
          Container(
            width: size,
            height: size,
            decoration: BoxDecoration(
              shape: isSquare ? BoxShape.rectangle : BoxShape.circle,
              color: color,
            ),
          ),
          const SizedBox(width: 8),
          Text(
            text!,
            style: TextStyle(
              fontSize: 16,
              fontWeight: FontWeight.bold,
              color: textColor,
            ),
          )
        ],
      );
}

Answer 1

似乎该函数还有一个您没有使用的第二个参数，您可以将其分配给下划线，如下所示：

touchCallback: (pieTouchResponse, _) {
  setState(() {
    if (pieTouchResponse?.touchInput is FlLongPressEnd ||
        pieTouchResponse.touchInput is FlPanEnd) {
      touchedIndex = -1;
    } else {
      touchedIndex = pieTouchResponse.touchedSectionIndex;
    }
  });
},

并使用主 github 页面上的示例：

https://github.com/imaNNeoFighT/fl_chart/blob/master/example/lib/pie_chart/samples/pie_chart_sample2.dart

Flutter - void Function（FlTouchEvent）无法分配给参数类型void Function

Flutter - void Function(FlTouchEvent) can't be assigned to the parameter type void Function

fl-chart