flutter - Flutter CustomPaint,如何启用平移?
问题描述
我正在使用 FlutterCustomPaint
绘制散点图,用户可以通过点击添加点。由于整个图表无法放在移动屏幕上,我希望用户能够平移。我该如何启用它?目前,图表没有平移,所以我只能看到它的一部分。这是我的代码:
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;
}
(注意,我还看到了 Google 的Flutter Charts库,但我的理解是交互性仅限于一些事情,比如选择图表上的现有点。)
解决方案
似乎我通过GestureDetector
将SingleChildScrollView
.
推荐阅读
- docker - 关于这种格式的 Dockerfile 命令的问题:RUN --mount=
- node.js - 如何将与 x 匹配的所有行移到文件顶部?
- python - Scrapy 多处理
- c# - 使用 ASP.NET MVC 上传图像
- go - 我如何在 GO paseto v2(public) 中获取发行者或页脚或任何其他数据
- javascript - 事件处理函数
- xml - 如何在 XPath 中引用父级?
- testing - 有没有办法知道 Xunit 在运行时的测试结果状态?
- excel - 使用 Internet Explorer 下载多个文件,重命名它们并保存到文件夹
- javascript - 如何将变量的值用作对象的属性?