Pinch zoom in fl_charts

Viewed 705

I am just new to Flutter and mobile dev overall, so I've tried to create some Line Chart using fl_chart and there is a problem, which I don't understand why it doesn't work.

So, here is a simple widget, which has a chart and I want to add some interactions to it like a horizontal scroll (it works), reset the state with a double-tap (works as well), and the ability to zoom in to the chart (doesn't work).

Gesture Detector has onScaleUpdate, which I thought it's what I need, but when I try to pinch-zoom in or out, the callback is not being called and I can't change the chart. A lot of things were tried, in order to make it work, but it was unsuccessful.

import 'package:fl_chart/fl_chart.dart';
import 'package:flutter/material.dart';
// ...
class FlChartState extends State<FlChart> {
  List<LineChartBarData> mainChartData = [];
  double minX = 0;
  double maxX = 0;
  double resultsLength = 60;

  @override
  void initState() {
    _mainBarDataCalculation(); // Method that prepares the data for the chart
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      onDoubleTap: () {
        setState(() {
          minX = 0;
          maxX = resultsLength;
        });
      },
      onScaleUpdate: (scaleUpd) {
        // doesn't trigger
      },
      onHorizontalDragUpdate: (dragUpdDet) {
        setState(() {
          double primDelta = dragUpdDet.primaryDelta ?? 0.0;
          if (primDelta != 0) {
            if (primDelta.isNegative) {
              if (maxX < resultsLength) {
                minX += maxX * 0.005;
                maxX += maxX * 0.005;
              }
            } else {
              if (minX > 0) {
                minX -= maxX * 0.005;
                maxX -= maxX * 0.005;
              }
            }
          }
        });
      },
      child: LineChart(_createLineChartDataWidget()),
    );
  }

  // ...
}

Is there something wrong?

0 Answers
Related