- mongodb - 在 MongoDB mapreduce 中,如何展平值对象?
- javascript - 对象传播与 Object.assign
- html - 输入类型 ="submit"Vs 按钮标签它们可以互换吗?
- sql - 使用 MongoDB 而不是 MS SQL Server 的优缺点
我正在尝试创建一个简单的小部件,以便当用户按下屏幕时,该位置会出现一个圆圈。我有一个由 Listener 小部件包装的 CustomPaint 小部件,如下所示:
new Listener(
onPointerDown: down,
child: new CustomPaint(
painter: painter,
size: Size.infinite,
),
)
问题在于指针向下事件是在全局坐标中提供的,而绘画是在 CustomPaint 小部件的本地坐标中完成的。应该如何转换这两个坐标系?
This page说我可以使用 RenderBox.globalToLocal 方法,但是如何获得 CustomPaint 小部件的 RenderBox?
最佳答案
您不一定必须将监听器包装在小部件中。您还可以使用 GlobalKey
来获取 RenderObject
。
import 'package:flutter/material.dart';
void main() {
runApp(new MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return new MaterialApp(
home: new MyHomePage(),
);
}
}
class MyHomePage extends StatefulWidget {
@override
State createState() => new MyHomePageState();
}
class MyHomePageState extends State<MyHomePage> {
GlobalKey _paintKey = new GlobalKey();
Offset _offset;
@override
Widget build(BuildContext context) {
return new Scaffold(
appBar: new AppBar(
title: new Text('CustomPaint example'),
),
body: new Listener(
onPointerDown: (PointerDownEvent event) {
RenderBox referenceBox = _paintKey.currentContext.findRenderObject();
Offset offset = referenceBox.globalToLocal(event.position);
setState(() {
_offset = offset;
});
},
child: new CustomPaint(
key: _paintKey,
painter: new MyCustomPainter(_offset),
child: new ConstrainedBox(
constraints: new BoxConstraints.expand(),
),
),
),
);
}
}
class MyCustomPainter extends CustomPainter {
final Offset _offset;
MyCustomPainter(this._offset);
@override
void paint(Canvas canvas, Size size) {
if (_offset == null) return;
canvas.drawCircle(_offset, 10.0, new Paint()..color = Colors.blue);
}
@override
bool shouldRepaint(MyCustomPainter other) => other._offset != _offset;
}
关于flutter - 如何在指针向下事件的位置绘制 CustomPaint 小部件?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46589633/
我有一个绘制椭圆形的 CustomPaint。 我想在一个特定的位置切出一个洞,我还不知道它是如何工作的。 我试过: canvas.drawPath( Path.combine(PathO
我有一个简单的应用程序,它通过 CustomPainter 进行绘制 Canvas 上的红色或绿色圆圈,取决于在 AppBar 中按下了哪个按钮: 类(class)ColorCircle扩展 Cust
Column 的子 CustomPainter 的大小变为 (0, 0)。 1) 当我们刚刚使用 CustomPaint 和 CustomPainter 时,我们期望的大小被传递给 CustomPai
我正在渲染一组图 block 网格,其中每个图 block 都是从图像中提取的。为了渲染它,我在我自己的 CustomPainter 实现中渲染所有内容(因为网格可能会变得非常大)。为了支持平移和缩放
我有一个使用自定义涂料绘画的应用程序,我想在背景中添加一个图像,以便可以在其上绘画,但不幸的是我似乎无法弄清楚如何做到这一点,我尝试使用堆栈但每次我做的自定义油漆只会在容器上油漆,但出于某种原因永远不
我试图使用 alpha channel 通过 CustomPaint 对线条颜色应用透明度的Canvas.drawLine() . 问题 但是,alpha channel 上的颜色调整对结果没有影响,
介绍 我使用 Flutter 的 CustomPaint Widget 绘制了一个自定义标签栏,它看起来像这样: 此外,这是我用来绘制小部件的代码: class TabBarPainter exten
我想在页面的右下角画一个三角形。 我已经成功地在左上角创建了一个这样做: void paint(Canvas canvas, Size size) { // top left
我不能让自定义画家重新粉刷。 我尝试使用 Listenable、回调、setState 并没有重绘屏幕。 文档是这样说的: The most efficient way to trigger a re
我正在尝试在 custompainter 上绘制图像。我正在使用 flutter custompainter video 上的示例这是我到目前为止所拥有的。我可以在图像中绘制,但无法缩放图像。如何在手
我需要使用自定义画家在 ListTile 内呈现我的自定义对象,以便绘制一些自定义文本。 ListTile( title: CustomPaint( painter: RowPainter
我想知道是否有人对如何开始使用 CustomPainter 在 flutter 中绘制心形有任何指示。我已经设法画了三角形和正方形,或者一个基本的圆,但心当然有直线和曲线。 我有这个画一个三角形,看起
这就是我想要构建的: (只看 appBar 的形状而不是内容) 这是我的: 我希望边缘是弯曲的,而不是那么尖锐。 这是我的 CustomPaint 代码: class LogoPainter exte
我有以下小部件: class OutsiderButton extends StatelessWidget { final Function onPressed; final Icon ico
我实现了一个 CustomPainter。在 shouldRepaint 方法中,我必须比较 6 组深度相等性。我现在正在使用 setsEqual 来做这件事。如果它们非常相等,则无需重新绘制,但真的
我正在尝试在 CustomPainter 中创建一个动画,其中动画从底部开始向上,但它是从顶部开始的。 当点击 FloatActionButton 时,矩形应该上升到屏幕的最大高度,当再次点击时返回到
这个问题在这里已经有了答案: How to touch paint a canvas? (2 个答案) 关闭 4 年前。 我有一个大小为 300、300 的 CustomPaoint。在这个下方我还
因此,我正在尝试按照“签名 Canvas ”方法使用 Flutter 创建一个绘图应用程序。但是,我无法更改 CustomPaint 对象的颜色,而它在更改之前已经更改了每条线条绘制的颜色,如下所示:
我正在尝试在 Flutter 中的相机预览上显示 CustomPaint 元素。现在,CustomPaint 元素显示在相机预览下方。我正在使用 Flutter camera plugin显示相机预览
我正在尝试创建一个简单的小部件,以便当用户按下屏幕时,该位置会出现一个圆圈。我有一个由 Listener 小部件包装的 CustomPaint 小部件,如下所示: new
我是一名优秀的程序员,十分优秀!