Flutter 画板实现

2023-11-19

import 'package:flutter/material.dart';

class DrawingBoard extends StatefulWidget {
  @override
  _DrawingBoardState createState() => _DrawingBoardState();
}

class _DrawingBoardState extends State<DrawingBoard> {
  List<List<Offset>> _path = [];

  @override
  Widget build(BuildContext context) {
    return Listener(
      onPointerDown: (PointerDownEvent pointerDownEvent){
        setState(() { _path.add([pointerDownEvent.localPosition]); });
      },
      onPointerMove: (PointerMoveEvent pointerMoveEvent){
        setState(() { _path[_path.length-1].add(pointerMoveEvent.localPosition); });
      },
      onPointerUp: (PointerUpEvent pointerUpEvent){
        setState(() { _path[_path.length-1].add(pointerUpEvent.localPosition); });
      },
      onPointerCancel: (PointerCancelEvent pointerCancelEvent){
        setState(() { _path[_path.length-1].add(pointerCancelEvent.localPosition); });
      },
      child: Container( width: double.infinity, height: double.infinity,
        child: CustomPaint( painter: DrawingBoardPainter(_path), )),
    );
  }
}

class DrawingBoardPainter extends CustomPainter {
  final List<List<Offset>> path;
  DrawingBoardPainter(this.path);
  Paint _paint = Paint() ..color = Colors.red ..style = PaintingStyle.stroke ..strokeWidth = 3;

  @override
  void paint(Canvas canvas, Size size) {
    // TODO: implement paint
    path.forEach((list) { Path _path = Path();
    for (int i = 0; i < list.length; i++) {
      if (i == 0)
        { _path.moveTo(list[i].dx, list[i].dy); }
      else
        { _path.lineTo(list[i].dx, list[i].dy); } }
    canvas.drawPath( _path, _paint); });
  }

  @override
  bool shouldRepaint(covariant CustomPainter oldDelegate) {
    // TODO: implement shouldRepaint
    return true;
  }
  
}
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Flutter 画板实现 的相关文章

  • 如何在 Flutter 中恢复上次路由

    我正在开发 Flutter 应用程序 但遇到了问题 在我的 main dart 中 我设置了一个名为 FirstScreen 的主路由 然后用户可以转到 LoginScreen 登录帐户 因此 如果我按主页按钮 然后尝试重新打开应用程序 出
  • library_private_types_in_public_api 和 StatefulWidget

    将 linter 升级到新版本后 flutter lints 2 0 1 在我的 pubspec 中 linter 启用此规则 公共 API 中的库私有类型 https dart dev tools linter rules library
  • 查找文本的确切边界

    我需要知道一段文本的确切边界 相当于获取文本边界 https developer android com reference android graphics Paint html对于安卓 我意识到这在某种程度上与 Flutter 的设计背
  • Flutter 中的自动关闭对话框

    我想在打开后几秒钟自动关闭对话框 我找到的解决方案是调用Navigator of context pop 延迟并且有效 但如果我在执行 Navigator pop 命令之前手动关闭它 通过单击外部 就会出现问题 然后 Navigator p
  • 使用 Firestore 和 Flutter 填充数据表(使用 StreamBuilder)

    如何使用 StreamBuilder 填充数据表 下面是我的代码 new StreamBuilder stream widget returnStreamWithActiveKeysOnly builder BuildContext con
  • 扩展运算符可以用来提供函数参数吗?

    我正在编写扩展 statelessWidget 的类 它的 build 方法返回Text 小部件 我需要将来自构造函数的文本选项 对齐 阶梯等 传递给它Map
  • Sliver Appbar [折叠工具栏] 在 Flutter 中从左到中心动画标题

    这是我的折叠工具栏的构建方法 override Widget build BuildContext context return SafeArea child CustomScrollView controller controller s
  • Flutter - 如何将用户数据传递到所有视图

    我是 Flutter 世界和移动应用程序开发的新手 并且正在努力解决如何在整个应用程序中传递用户数据的问题 我已经尝试了几件事 但似乎没有一个很好 我确信我应该遵循一些最佳实践模式 因为它使示例更容易 所以我使用 firebase 进行身份
  • 期待活页夹但得到空

    尽管一切正常 但我在日志中收到此消息 W Parcel Expecting binder but got null 有人遇到过这样的问题吗 如何解决 重现步骤 只需创建一个新的 Flutter 项目并在模拟器 仿真器上运行它 查看日志 您将
  • Flutter包读取自己的资产

    我有一个带有 assets 文件夹的模块 该文件夹与我的 pubspec yaml 文件位于同一目录中 在我的资产文件夹中 有 test txt 和 simpleObject json flutter assets assets test
  • Flutter ListView 未更新

    我想在 Flutter 中创建一个 ListView 当新数据到达时它会更新 我正在使用 RefreshIndicator 来触发列表加载以进行测试 对于我的列表 我使用 ListBuilder 将对象映射到视图对象 据我了解 setSta
  • 测试奖励广告未显示 - 广告加载失败:LoadAdError(代码:3,域:com.google.android.gms.ads,消息:无广告配置。)

    我目前无法展示测试奖励广告 我正在使用激励广告Sample ad unit ID中提供的doc https developers google com admob android test ads ca app pub 3940256099
  • Flutter 屏幕变化回调

    我想在屏幕更改时收到回调 这样我就可以停止在该特定屏幕上运行的重复请求 dispose 仅在使用 Navigator pop 时调用 而在调用 Navigator push 时不调用 有没有办法检测到屏幕已更改且当前未显示 在您的 Mate
  • Flutter:设置AppBar的高度

    我怎样才能简单地设置高度AppBar在颤振中 栏的标题应保持垂直居中 即AppBar 您可以使用首选尺寸 https api flutter dev flutter widgets PreferredSize class html clas
  • 避免在 Flutter Web 插件包之外使用纯 Web 库

    我正在构建一个 Flutter 应用程序 并尝试在网络上运行 其中一部分包含一些特定于网络的代码 import dart html as html import package flutter foundation dart class D
  • “@required”注释作为错误而不是警告

    现在在我的 Flutter 项目中 当我用注释构造函数参数时 required当实例化构造函数时忘记它 我从 IDE 收到一条轻微警告 表明该参数是必需的 我希望这在 IDE 中显示为实际错误 有办法进去吗analysis options
  • Flutter:列表已弃用? [复制]

    这个问题在这里已经有答案了 升级到最新版本的 flutter 后 我的所有列表都收到弃用警告 List
  • Flutter:“UIAlertView”已弃用:首先在 iOS 9.0 中弃用

    我收到以下错误 Users flo pub cache hosted pub dartlang org image picker 0 6 7 12 ios Classes FLTImagePickerPlugin m 1 49 20 war
  • 在flutter中从cloud_firestore删除文档

    我正在返回一个streamBuilder在streamBuider内部 它返回一个小部件 现在我已经用可忽略的方式包装了一个小部件 以便我可以从 cloud firestore 的集合中删除该文档 showingTheSelectedDat
  • Android minSdkVersion 与 Flutter(v2.8.1)

    我已经安装了 firebase 包 据我们所知minSdkVersion 19被推荐 所以 我想做这个过程 但是 我看到这一行包含在android app build gradle file minSdkVersion flutter mi

随机推荐

  • mysql 5.6 安装流程

    一 首先解压安装包到指定路径 解压路径不可为中文 二 配置环境变量 我是windows11 1 1 2 3 4 5 6 6 全部点击确定 三 更改my ini 这两条路径更改为与环境变量相同路径 四 运行cmd 1 2 输入mysqld i
  • 2021-08-06软考网工的一个简单的综合实验

    拓扑 PC1和PC2都设置成dhcp获取ip PC1属于10网段 标记为教学区 PC2属于20网段 标记为宿舍区 LSW1作为接入交换机 LSW2作为核心交换机 AR1作为外网入口 AR2表示电信运营商的路由器 AR3表示联通运营商的路由器
  • oracle tcp空包请求,再谈 TCP 的 CLOSE_WAIT

    背景 某日集群告警 hbase regionserver 因 fd 不足导致进程主动退出 简单排查后发现regionserver 到 datanode 的TCP 连接存在大量 CLOSE WAIT 单机总数有10万之多 众所周知 CLOSE
  • HTML表格

    目录 实例 表格 表格和边框属性 表格的表头 表格中的空单元格 更多实例 表格标签 一个完整的实例 本例涉及到的资源 eg background jpg eg cute gif 可以使用 HTML 创建表格 实例 表格 这个例子演示如何在
  • 一台电脑上安装两个Tomcat服务器

    在排查问题来源的时候 由于不想卸载之前下载的Tomcat 需要再安装一个Tomcat服务器 下载压缩版的Tomcat之后 第一个Tomcat配置不变 需要修改第二个Tomcat的配置 1 CATALINA HOME 8081 新的地址 2
  • flex:1可以撑满剩余空间

    flex 1 的妙用 首先 flex 是 flex grow flex shrink flex basis的缩写 当 flex 取值为一个非负数字 则该数字为 flex grow 值 flex shrink 取 1 flex basis 取
  • MySql中left join、right join、inner join实例分析,union与union all的区别,Mybatis中CDATA []的用法

    inner join select from user a inner join grade b on a gid b id 只返回两个表中联结字段相等的行 left join select from user a left join gr
  • bokeh python_Python Bokeh数据可视化教程

    bokeh python Bokeh is an interactive Python data visualization library which targets modern web browsers for presentatio
  • cad隐藏图层命令快捷键_教你学会天正CAD局部隐藏对象技巧

    天正局部隐藏命令 JBYC 即局部隐藏的拼音首字母 其命令全称为TMKHIDE 适用于所有天正软件 建筑 电气 给排水 暖通 天正建筑的工具界面中是有此菜单的 且默认快捷键4为局部隐藏 6为恢复可见 其他软件并未显示 需要通过命令输入使用
  • 基于conda的相关命令

    conda 查看python版本环境 打开Anaconda Prompt的命令输入框 查看自己的python版本 conda env list 激活相应的python版本 环境 conda avtivate python 3 9 若输入以下
  • 我在工作中是如何使用【Linux】的

    目录 前言 一 常用命令 二 文件和目录处理 三 用户与组管理命令 四 进程管理命令 五 网络管理命令 六 帮助命令 七 磁盘管理 前言 大家好 这是我首篇博客 内容是linux工作需用到的内容 在这里我给大家总结出来了 希望多支持支持 感
  • 【Hello mysql】 mysql的事务

    Mysql专栏 Mysql 本篇博客简介 介绍mysql的事务 mysql的事务 事务的概念 事务功能测试 事务的隔离级别 如何理解隔离性 粗浅理解 隔离级别 查看和设置隔离级别 四种隔离级别详解 读 未提交 读 提交 可重复读 串行化 一
  • 6月17日实验课之“H.264文件解析”

    文章目录 1 实验要求 2 实验结果 2 1 SPS 2 1 1 profile idc 2 1 2 level idc 2 1 3 seq parameter set id 2 1 4 log2 max frame num minus4
  • jmeter+接口测试练习+接口关联+Json提取

    1 测试用例设计 2 因为要执行多条用例 所以在Jmeter添加了http信息头管理器和http请求默认值 3 查询用户信息接口需要用到登录的token 但要先登录再把token拿出来传到查询的信息头里 会出现登录信息已过期的提示 考虑用j
  • 从0开始写Vue项目-Vue页面主体布局和登录、注册页面

    1 从0开始写Vue项目 环境和项目搭建 慕言要努力的博客 CSDN博客 2 从0开始写Vue项目 Vue2集成Element ui和后台主体框架搭建 慕言要努力的博客 CSDN博客 一 主体布局 关于主体布局 我们刚开始肯定是做的死数据的
  • 考研数二第三讲 极限存在准则和两个重要极限和极限运算准则

    根据前面介绍的内容 具体推理数列以及函数的极限推理过程 在实际应用中极限的两大准则使用还是比较广泛的 大家需要多多关注 极限存在准则和两个重要极限 准则 I 夹逼准则 如果数列 xn yn zn 满足下列条件 证明 此函数分母的极限为 0
  • 稿费一般多少钱一千字_编写教材的稿费一般是多少

    我们知道编写教材是会受到一定的稿酬的 除了编写教材 还有图书 报纸 个人公开发表等等 公费出书都有可能获取一定的稿酬 那么稿酬是如何计算的呢 编写教材的稿费一般是多少 以下是根据 出版文字作品报酬规定 介绍了基本稿酬的标准 供大家参考 19
  • VUE项目中的全局格式化时间过滤器

    自定义格式化时间 一 问题 这是一个后台管理系统中的商品列表页 其中的时间这一项在调用接口后会发现是以毫秒来计算的 这样当然是不行的啦 要换算成我们日常使用的2020 04 07 17 13 这样的时间格式 二 解决办法 1 打开项目中的m
  • html5 比例尺,高德地图API之缩放比例尺控件+3D转换

    缩放比例尺控件 首先引入控件 amap scale 然后使用 map addcontrol 添加控件map margin 0 padding 0 list style none container width 100 height 100
  • Flutter 画板实现

    import package flutter material dart class DrawingBoard extends StatefulWidget override DrawingBoardState createState gt