Flutter中关于angle的踩坑记录

这个问题是我最近做业务开发和业余开发都遇到的，这里的 angle 指的是旋转弧度。不是旋转角度。

先看一下我使用 angle 的场景吧：

图一中使用了 canvas.drawArc，传入了 startAngle 和 sweepAngle。图二也是如此。图三是 Flutter ConstraintLayout 中圆形定位的 example，我没有使用 Flutter ConstraintLayout 自带的旋转能力，而是用了 Transform.rotate，传入了 angle。Flutter ConstraintLayout 自带的对 Widget 的旋转能力用了 canvas.rotate，也传入了 angle。

我现在还没搞明白弧度和角度的对应关系，官网文档中也没有详细说明。但对于我来说，我根本就不想去关心弧度是多少，我只关心角度，这个角度的范围是 [0.0, 360.0]。以图三中的时钟为例，旋转 0.0 或 360.0 度时，指针应该指向 12，旋转 90.0 度时，指针应该指向 3，旋转 180.0 度时，指针应该指向 6，旋转 270.0 度时，指针应该指向 9。

于是我们需要将旋转弧度转换成旋转角度，我研究出的转换公式如下：

Transform.rotate：

pi + pi * (angle / 180)

canvas.rotate：

angle * pi / 180

canvas.drawArc：

startAngle = -pi / 2
sweepAngle = angle * pi / 180

看见没有，这三类旋转的转换公式都不一样。我不明白 Flutter 官方为什么要这么设计，为啥这么优秀的 Flutter 引入了这么糟糕的 API。于是我带着气愤给官方提了个 Issue，想喷一喷设计这几个 API 的哥们：

结果我被反杀了。

冷静下来之后，我决定提交一个 Pull Request 来修正这个 API。但这需要时间，因为提交 Pull Request 的周期很长，上次我提了个 bug，Oppo 的一个哥们修复了它，Pull Request 等了将近两个月才合并。

总结

到此这篇关于Flutter中关于angle踩坑的文章就介绍到这了,更多相关Flutter中angle坑内容请搜索我们以前的文章或继续浏览下面的相关文章希望大家以后多多支持我们！

赞 (0)

相关推荐

  • Flutter中关于angle的踩坑记录

    Flutter中关于angle的踩坑记录

    这个问题是我最近做业务开发和业余开发都遇到的,这里的 angle 指的是旋转弧度.不是旋转角度. 先看一下我使用 angle 的场景吧: 图一中使用了 canvas.drawArc,传入了 startAngle 和 sweepAngle.图二也是如此.图三是 Flutter ConstraintLayout 中圆形定位的 example,我没有使用 Flutter ConstraintLayout 自带的旋转能力,而是用了 Transform.rotate,传入了 angle.Flutter C

  • python中remove函数的踩坑记录

    摘要: 在python的使用过程中,难免会遇到要移除列表中对象的要求.这时可以使用remove函数. 对于python中的remove()函数,官方文档的解释是:Remove first occurrence of value.大意也就是移除列表中等于指定值的第一个匹配的元素. 语法 list.remove() 参数 obj 参数:从列表中删除的对象的索引 返回值 删除后不会返回值 常见用法: a = [1,2,3,4],a.remove(1),然后a就是[2,3,4]:对于a = [1,1,1

  • react中使用useEffect及踩坑记录

    目录 使用useEffect及踩坑记录 useEffect 介绍 useEffect常见跳坑 hooks中useEffect()使用总结 常见使用 useEffect() 的第二个参数说明 useEffect() 第一个函数参数的返回值 useEffect() 的注意点 使用useEffect及踩坑记录 useEffect 介绍 useEffect时reactHook中最重要,最常用的hook之一. useEffect相当于react中的什么生命周期呢? 这个问题在react官网中有过介绍,在使

  • Linux/Docker 中使用 System.Drawing.Common 踩坑记录分享

    前言 在项目迁移到 .net core 上面后,我们可以使用 System.Drawing.Common 组件来操作 Image,Bitmap 类型,实现生成验证码.二维码,图片操作等功能.System.Drawing.Common 组件它是依赖于 GDI+ 的,然后在 Linux 上并没有 GDI+,面向谷歌编程之后发现,Mono 团队使用 C语言 实现了GDI+ 接口,提供对非Windows系统的 GDI+ 接口访问能力,这个应该就是libgdiplus.所以想让代码在 linux 上稳定运

  • 关于python scrapy中添加cookie踩坑记录

    问题发现: 前段时间项目中,为了防止被封号(提供的可用账号太少),对于能不登录就可以抓取的内容采用不带cookie的策略,只有必要的内容才带上cookie去访问. 本来想着很简单:在每个抛出来的Request的meta中带上一个标志位,通过在CookieMiddleware中查看这个标志位,决定是否是给这个Request是否装上Cookie. 实现的代码大致如下: class CookieMiddleware(object): """ 每次请求都随机从账号池中选择一个账号去访

  • Echarts在Taro微信小程序开发中的踩坑记录

    Echarts在Taro微信小程序开发中的踩坑记录

    背景 近期笔者在使用Taro进行微信小程序开发,当引入Echarts图表库时,微信检测单包超限2M的一系列优化措施的踩坑记录,期望能指导读者少走一些弯路. 为什么选择Echarts? 微信小程序目录市面上使用最多的两款图表库,如下: echarts-for-weixin--echarts微信小程序版本 wx-charts--基于微信小程序的图表库 对比两款图表库优缺点刚好相反. echarts-for-weixin:功能强大,但体积非常大 wx-charts:功能相对简单,但体积小 由于笔者对e

  • Java中Objects.equals踩坑记录

    Java中Objects.equals踩坑记录

    目录 前言 1. 案发现场 2. 判断相等的方法 2.1 使用==号 2.2 使用equals方法 3. 空指针异常 4. Objects.equals的作用 5. Objects.equals的坑 总结 前言 最近review别人代码的时候,发现有个同事,在某个业务场景下,使用Objects.equals方法判断两个值相等时,返回了跟预期不一致的结果,引起了我的兴趣. 原本以为判断结果会返回true的,但实际上返回了false. 记得很早之前,我使用Objects.equals方法也踩过类似的

  • sql语句中union的用法与踩坑记录

    sql语句中union的用法与踩坑记录

    目录 sql语句union的用法 补充:SQLUNION踩过的坑 总结 sql语句union的用法 union联合的结果集不会有重复值,如果要有重复值,则使用union all union会自动压缩多个结果集合中重复的结果,使结果不会有重复行,union all 会将所有的结果共全部显示出来,不管是不是重复. union:会对两个结果集进行并集操作,不包括重复行,同时进行默认规则的排序. union all:对两个结果集进行并集操作,包括重复行,不会对结果进行排序. 1.sql Union用法

  • Java踩坑记录之BigDecimal类

    前言 在java.math包中提供了对大数字的操作类,用于进行高精确计算,如BigInteger,BigDecimal类.而平常我们开发中使用最多的float和double只能适用于一般的科学和工程计算,如果要在比较精确的计算方面如货币,那么使用float和double会相应的丢失精度,因此用于精密计算大数字的类BigDecimal就必不可少了.所以BigDecimal适合商业计算场景,用来对超过16位有效位的数进行精确的运算.但是BigDecimal的使用并不像float和double那样,使

  • 微信小程序开发篇之踩坑记录

    微信小程序开发篇之踩坑记录

    最近参与开发了公司的第一款小程序,开发体验基本类似于基于webview的混合式开发,可以调用官方强大的api,但也有一些坑或者说不习惯的地方.这篇文章从实用性出发,记录了开发过程中的一些问题: 1. 样式优先级混乱 在使用button组件时,发现在class中设置width不生效,下面贴上代码: .my-button{ width: 140rpx; height: 60rpx; line-height: 60rpx; padding: 0; } 经过微信调试工具排查后,发现user agent的

随机推荐