[英]Flutter CustomPaint, how to enable panning?
I am using Flutter's CustomPaint
to draw a scatter plot the user can add points to by tapping.我正在使用 Flutter 的CustomPaint
绘制一个散点图,用户可以通过点击向其添加点。 Since the whole chart cannot fit on a mobile screen, I want the user to be able to pan.由于整个图表无法适应移动屏幕,我希望用户能够平移。 How can I enable this?我怎样才能启用它? Currently, the chart is not panning, so I can only see a section of it.目前,图表没有平移,所以我只能看到它的一部分。 Here is my code:这是我的代码:
import 'dart:io';
import 'dart:ui';
import 'package:flutter/material.dart';
class Draw extends StatefulWidget {
String eventName;
Draw({this.eventName});
@override
_DrawState createState() => _DrawState();
}
class _DrawState extends State<Draw> {
List<Offset> points = List();
@override
Widget build(BuildContext context) {
return Scaffold(
body: GestureDetector(
child: CustomPaint(
size: Size.infinite,
painter: DrawingPainter(),
),
),
);
}
}
class DrawingPainter extends CustomPainter {
DrawingPainter();
Paint tickSettings = Paint()
..strokeCap = (Platform.isAndroid) ? StrokeCap.butt : StrokeCap.round
..isAntiAlias = true
..color = Colors.grey
..strokeWidth = 5.0;
static double axisXCoord = 60;
static double axisHt = 1000;
var ticks = List<Offset>.generate(10, (i) => Offset(axisXCoord, i * (axisHt / 10) + 30));
@override
void paint(Canvas canvas, Size size) {
canvas.drawPoints(PointMode.points, ticks, tickSettings);
}
@override
bool shouldRepaint(DrawingPainter oldDelegate) => true;
}
(Note, I also saw Google's Flutter Charts library, but my understanding is that interactivity is limited to a few things like selecting existing points on the chart.) (注意,我也看到了 Google 的Flutter Charts库,但我的理解是交互性仅限于选择图表上的现有点等一些事情。)
似乎我通过将GestureDetector
包装在SingleChildScrollView
解决了它。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.