Flutter找不到Android模拟器解决

Flutter配置好后,在Android Studio中找不到设备

完成Flutter的Android配置之后,连上设备,运行flutter doctor,发现已经识别了一个可用设备了

但是用Android Studio新建Flutter项目之后,却一直显示未找到设备。

最后在Stack Overflow上找到了解决方案:

https://stackoverflow.com/questions/49222658/device-list-doesnt-shows-in-android-studio-using-flutter

就是要配置一下flutter关联的Android sdk路径和Android Studio文件夹,我的设置完sdk路径就可以正常找到device了,问题解决~。

粗体部分替换成自己的Android sdk路径:

粗体部分替换成自己的android studio文件夹路径(我的不用配置这个就成功了):

注意,上面的操作在重启之后无效,如果希望重启之后也生效,则编辑 ~/.flutter_settings ,增加如下配置即可:

参考链接


LocalAuthentication开发实践

在iPhone 5s加入Touch ID后,指纹识别的功能在App中逐渐受到青睐,特别是对于本地安全较高的应用(如带支付的App)指纹识别是必备的功能,它既能解决在验证过程中输入密码的繁琐过程,同时指纹识的安全等级更高。那么,要想在自己开发的应用中使用指纹识别,就必须要LocalAuthentication.framework提供的API,下面将详细地介绍如何使用这个框架来实现指纹识别功能。

基础用法

我们先来看下面的例子:

继续阅读LocalAuthentication开发实践

移动端系统生物认证技术详解

相信大家对于生物认证应该不会陌生,使用指纹登陆或者 FaceId 支付等的需求场景如今已经很普遍,所以基本上只要涉及移动端开发,不管是 Android 、iOS 或者是 RN 、Flutter 都多多少少会接触到这一业务场景。

当然,不同之处可能在于大家对于平台能力或者接口能力的熟悉程度,所以本篇主要介绍 Android 和 iOS 上使用系统的生物认证需要注意什么,具体流程是什么,给需要或者即将需要的大家出一份汇总的资料

继续阅读移动端系统生物认证技术详解

Windows Subsystem for Linux Update错误0x80070643的真正解决方法

最近 Windows 10 21H2 在系统更新的时候,报错:

如下图:

继续阅读Windows Subsystem for Linux Update错误0x80070643的真正解决方法

决策表

  • 概念

因果图、决策表是一种充分考虑系统之间的输入组合、约束以及输出因果关系的用例设计方法。

  • 适用范围

适合:决策表特别适合于针对不同逻辑条件的组合,测试对象需要执行不同操作的场景。

不适合:

  1. 输入和输出不明确,或输入与输出的因果关系不明确的情况
  2. 被分析的特点和功能点过于复杂,输入项目很多的情况下。输入项过多,会造成决策表非常庞大,没有工具辅助的情况下,难以操作。
  3. 系统输入之间相互约束少,不需要做大范围的组合测试时,不宜用本工程方法,不然会产生大量用例冗余。
  4. 系统输入之间存在顺序先后的可变性。
    例如,两个输入之间可以交换顺序,且交换顺序后,他们的输出是不一样的。
    判定表的输入是无法排序的。
  • 决策表的组成

条件桩: 列出系统的所有输入,通常认为列出的输入次序无关紧要

动作桩: 列出系统所有可能执行的操作,这些执行操作没有顺序约束

条件项: 列出输入项的各种取值

动作项: 列出输入项的各种取值情况下应该采取的动作

  • 决策表的步骤
  1. 列出所有的条件桩和动作桩
  2. 确定规则的数目
  3. 填入条件项和动作项得到初始的决策表
  4. 简化相似的规则,得到优化的决策表
  5. 每列规则,设计一个测试用例

【示例

  需求:

公司有如下规定:

  • 中国去欧美的航线所有座位都有食物供应。每个座位都可以播放电影
  • 中国去非欧美的国外航线都有食物供应,只有商务仓可以播放电影
  • 中国国内的航班的商务仓有食物供应,但是不可以播放电影
  • 中国国内的航班的经济仓除非飞行时间大于2小时就有食物供应,但是不可以播放电影

1. 列出所有的条件桩和动作桩

等价类:

    A1={航线为国外欧美航线}

    A2={航线为国外非欧美航线}

    A3={航线为国内航线}

    P1={舱位为经济舱}

    P2={舱位为商务舱}

    T1={飞行时间大于2小时}

    T2={飞行时间不大于2小时}

条件桩

    C1:航线为{A1,A2,A3}之一

    C2:舱位为{P1,P2}之一

    C3:飞行时间为{T1,T2}之一

动作桩

    A1:食物供应

    A2:电影播放

2. 确定规则的数目

3x2x2=12

3. 填入条件项和动作项得到初始的决策表

  规则 1 2 3 4 5 6 7 8 9 10 11 12
条件桩 C1航线 A1 A1 A1 A1 A2 A2 A2 A2 A3 A3 A3 A3
C2类型 P1 P1 P2 P2 P1 P1 P2 P2 P1 P1 P2 P2
C3时间 T1 T2 T1 T2 T1 T2 T1 T2 T1 T2 T1 T2
动作桩 A1食物  
A2电影            

4. 简化相似的规则,得到优化的决策表

  1 2 3 4 5
条件桩 C1航线 A1 A2 A2 A3 A3
C2类型 - P1 P2 P1 P2
C3时间 - - - T1 -
动作桩 A1食物
A2电影      

5. 每列规则,设计一个测试用例

用例编号 输入 预期输出
1 中国-欧美航线/所有座位/全时 提供食物/播放电影
2 非中国-欧美国外航线/经济舱/全时 提供食物
3 非中国-欧美国外航线/商务舱/全时 提供食物/播放电影
4 国内航线/经济舱/大于2小时 提供食物
5 国内航线/商务舱/全时  

参考链接


决策表

iOS - keychain详解及变化

keychain介绍

iOS keychain 是一个相对独立的空间,保存到keychain钥匙串中的信息不会因为卸载/重装app而丢失。相对于NSUserDefaults、plist文件保存等一般方式,keychain保存更为安全。所以我们会用keyChain保存一些私密信息,比如密码、证书、设备唯一码(把获取到用户设备的唯一ID 存到keychain 里面这样卸载或重装之后还可以获取到id,保证了一个设备一个ID)等等。keychain是用SQLite进行存储的。用苹果的话来说是一个专业的数据库,加密我们保存的数据,可以通过metadata(attributes)进行高效的搜索。keychain适合保存一些比较小的数据量的数据,如果要保存大的数据,可以考虑文件的形式存储在磁盘上,在keychain里面保存解密这个文件的密钥。

继续阅读iOS - keychain详解及变化

三阶贝塞尔曲线cubicTo

flutter中绘制基础引言

Flutter 中实现绘制的主要是CustomPainter类

然后放在父控件的child里用 CustomPaint 包裹使用

三阶贝塞尔曲线

在 flutter 通过 Canvas 来结合 Path 来实现绘制 三阶贝塞尔曲线,三阶贝塞尔曲线就是说两个点之间的线 有两个控制点。

例如我们要绘制上述的椭圆,其中 A、B、C 就是我们的目标点,我们绘制的路径就是 从A到B再到C,然后控制点如下

  • a1 、 b1 点是 A B 的控制点
  • b2 、c2 点是 B C 的控制点

那么我们要绘制出如上图中的效果,代码如下

在 flutter 中,通过 path 的 cubicTo 函数来实现三阶贝塞尔曲线

void cubicTo(double x1, double y1, double x2, double y2, double x3, double y3) 点(x1,y1)、(x2,y2) 为控制点 (x3,y3) 为目标点

参考链接


flutter绘图基础之三阶贝塞尔曲线cubicTo

贝塞尔曲线

贝赛尔曲线的前世今生

贝塞尔曲线,这个命名规则一眼看上去大概是一个叫贝塞尔的数学家发明的。但,贝塞尔曲线依据的最原始的数学公式,是在1912年在数学界广为人知的伯恩斯坦多项式。简单理解,伯恩斯坦多项式可以用来证明,在[ a, b ] 区间上所有的连续函数都可以用多项式来逼近,并且收敛性很强,也就是一致收敛。再简单点,就是一个连续函数,你可以将它写成若干个伯恩斯坦多项式相加的形式,并且,随着 n→∞,这个多项式将一致收敛到原函数,这个就是伯恩斯坦斯的逼近性质。

时光荏苒岁月如梭,镜头切换到了1959年。当时就职于雪铁龙的法国数学家 Paul de Casteljau 开始对伯恩斯坦多项式进行了图形化的尝试,并且提供了一种数值稳定的德卡斯特里奥(de Casteljau) 算法。(多数理论公式是建立在大量且系统的数学建模基础之上研究的规律性成果)根据这个算法,就可以实现 通过很少的控制点,去生成复杂的平滑曲线,也就是贝塞尔曲线

但贝塞尔曲线的声名大噪,不得不提到1962年就职于雷诺的法国工程师皮埃尔·贝塞尔(Pierre Bézier),他使用这种方法来辅助汽车的车体工业设计(最早计算机的诞生则是为了帮助美国海军绘制弹道图),并且广泛宣传(典型的理论联系实际并获得成功的示例),因此大家称为贝塞尔曲线 。

贝赛尔曲线的数学理论

既然贝赛尔曲线的本质是通过数学计算公式去绘制平滑的曲线,那就可以通过数学工具进行实际求证以及解释说明。当然对其进行数学求证就没必要了,因为这些伟大的数学家们已经做过了,这里只是解释说明:

  • 步骤一:在平面内选3个不同线的点并且依次用线段连接。

    3点连线
    3点连线
  • 步骤二:在AB和BC线段上找出点D和点E,使得 AD/AB = BE/BC

    AD/AB = BE/BC
    AD/AB = BE/BC
  • 步骤三:连接DE,在DE上寻找点F,F点需要满足:DF/DE = AD/AB = BE/BC

    DF/DE = AD/AB = BE/BC
    DF/DE = AD/AB = BE/BC
  • 步骤四:最最重要的!根据DE线段和计算公式找出所有的F点,记住是所有的F点,然后将其这些点连接起来。那,连接规则是什么?以上图为例,第一个连接点是A-F,第二连接点是A-F1(这个F1必须满足DF1/DE = AD/AB = BE/BC)以此类推,直到最后连接上C点,下面上一个动图加深理解:

    贝塞尔曲线
    贝塞尔曲线

    可能有些朋友还是不理解,那么这个GIF我截下其中的一张图说明,如下图:

    示例说明
    示例说明

    动图里的P0、P1、P2分别代表的是上图的:P0 == A;P1 == B;P2 == C。那么这个黑色点,代表的就是F点,绿色线段的2个端点(P0-P1线段上的绿色点,代表是就是D点,P0-P2线段上的绿色点,代表是就是E点)。线段上面点的获取,必须要满足等比关系。

关于贝赛尔曲线的基本数学理论大概就是上面的内容。两个线段根据等比关系找点的贝塞尔曲线,一般也称为二阶贝塞尔曲线。

贝赛尔曲线的N阶拓展(三阶贝塞尔与N阶贝塞尔曲线)

刚才说到,上面的贝赛尔曲线一般称为二阶贝塞尔曲线,既然是二阶贝塞尔曲线,那肯定有三阶贝塞尔曲线、四阶贝赛尔曲线等等。其实三阶贝塞尔与四阶贝赛尔曲线以及N阶贝赛尔曲线曲线的规则都是一样的,都是先在线段上找点,这个点必须要满足等比关系,然后依次连接,下面是三阶贝赛尔曲线的解释说明:

  • 步骤一:三阶贝赛尔曲线,简单理解就是在平面内选4个不同线的点并且依次用线段连接(也就是三条线)。如下所示

    四点三线
    四点三线
  • 步骤二:同二阶贝塞尔曲线一样首先需要在线段上找对应的点(E、F、G),对应的点必须要符合等比的计算规则,计算规则如下:AE/AB = BF/BC = CG/CD;找到对应的点以后接着依次链接EF、FG;接着在EF、FG线段上面继续找点H、I,对应的点依旧要符合等比的计算规则,也就是 EH/EF = FI/FG;最后连接H、I线段,在HI线段上面继续找点J、点J的计算规则需要符合:EH/EF = FI/FG = HJ/HI

    三阶贝赛尔曲线找点
    三阶贝赛尔曲线找点
  • 步骤三:重复步骤二的动作,找到所有的J点,依次将J点连接起来,这样最终完成了三阶贝赛尔曲线。

    J点依次连线
    J点依次连线

整一个三阶贝赛尔曲线的动作加起来就是下面的一张动图:

三阶贝塞尔
三阶贝塞尔

那么四阶贝赛尔曲线的实现步骤也是一样的,平面上先选取5个点(5点4线)、依次选点(满足等比关系)、依次连接、根据计算规则找到所有的点(逐个连接)。。。。。。

四阶贝赛尔曲线
四阶贝赛尔曲线

貌似都是从二阶贝塞尔曲线说起的,那么一阶贝赛尔又是怎么样的?一阶贝赛尔如图:

一阶贝赛尔
一阶贝赛尔

可以看到一阶贝赛尔是一条直线!

因此,N阶贝赛尔不仅可以画平滑的曲线也可以画直线,因此自定义控件画直线又多了一种可选择的方式,但是一般用贝赛尔主要是画曲线,这里只是提供了一种别的解决思路;另外,在Android属性动画,系统为我们提供了一个PathInterpolator插值器。这个PathInterpolator里面就有贝塞尔曲线的身影。有兴趣的小伙伴也可以去了解一下。

贝赛尔曲线的拟合

给定一段曲线,如何用贝塞尔曲线去拟合? 一般可以把曲线拆分成若干离散点的集合,然后要求拟合的曲线通过这些离散的数据点。

现在推导一下Bezier曲线控制点的计算过程。

曲线公式

曲 线 :$ C(u) = \displaystyle\sum_{i=0}^nB_{n,i}(u)P_i $

基 函 数 : $ B_{n,i} = \frac{ n ! }{ i !  (n−i)! } u^i ( 1 − u )^ {n − i} $

这里求解控制点,即C为已知信息,求解式中的P。

计算3次Bezier曲线控制点

曲线多项式:

$ C(u) = \displaystyle\sum_{i=0}^3 B_{3,i}(u)P_i = ( 1 − u )^3 P_0 + 3 ( 1 − u )^2 u P_1 + 3 ( 1 − u ) u^2 P_2 + u^3 P_3 , 0 ≤ u ≤ 1 $

写成矩阵方式:

$ C = B∗P $

式中:

$ B = \begin{bmatrix} 1 & 0 & 0 & 0 \\\\\frac{8}{27} & \frac{4}{9} & \frac{2}{9} & \frac{1} {27} \\\\ \frac{1} {27} & \frac{2}{9} & \frac{4}{9} & \frac{8}{27} \\\\ 0 & 0 & 0 & 1 \end{bmatrix}$

$ C = \begin{bmatrix} P_0 \\\\ P_1 \\\\P_2 \\\\P_3 \end{bmatrix}$ 

则得到;

$ B^{−1} C = B^{−1} B ∗ P $

$ P = B^{ − 1} C $

即可计算得到相应的样条曲线控制点。

Python验证

取点位 $ \begin{bmatrix} C_0(0,0) & C_1(0,2) & C_2(2,2) & C_3(2,0) \end{bmatrix}$

计算控制点P后,画出如下Bezier曲线:

参考链接