代码 > flutter选择背景和文字背景冲突

2024-05-29

具体来说,就是选择背景SelectionColor比背景色backgroundColor优先级低,所以在设置过前/背景色的文本上,选择色的设置无效。

一番搜索,已经有两个issus被提出来了

https://github.com/flutter/flutter/issues/79168

https://github.com/flutter/flutter/issues/96112

怎么说呢,虽然不算常见场景,但需要用的时候还挺蛋疼。

这么久也没修复,感觉真的要修复得接管整个选择目标的渲染流程了。蛋疼。

 

PS

用了个比较脏的Hack

用WidgetSpan(Container(Text())) 代替了TextSpan

将背景色和TextStyle分离

背景色设在Container上

TextStyle给Text

这样Text是没背景色的,选择色就能覆盖背景色了,

由于TextStyle是只读的,还不能单纯的去除背景信息,只能再封装一下原来的textstyle方法。

不得不说,真脏。

代码 > flutter的showDialog

2024-05-23

这次调代码的主要原因就是随着flutter sdk版本升级,showdiablog失效了……

 

怎么说呢。

 

flutter的showDialog虽然名字是showDialog,但它本质值是伪装成showDialog的功能。

本质是在导航里插入一个临时节点,然后在临时节点里显示Dialog的内容。

3.10-3.22不知道那个版本的更新修改了逻辑,showDialog会触发一次路由匹配……

 

正经来说

showDialog需要指定context和useRootNavigator。

理论上,按照传统的showDialog函数的用法。

少副作用的showDialog需要在容器里用一个Navigator组件来包住子元素。

然后通过指定Navigator的Key的方式,在运行时获取到Navigator的context。

然后,再取消useRootNavigator,这样才能限制showDialog的副作用在自定义的Navigator内。

完全理通的时候,能够理解这个逻辑。

但文档里没说清楚的话,刚开始用真的太容易踩坑了。

代码 > 修正flutter升级3.10升级到3.22后渲染出的问题

2024-05-22

具体来说,由于我的代码是按文字行渲染然后缓存的,发现部分行在linux桌面会随机丢失,统一版本mac os x 无此问题。

目测是异步没及时渲染成功的问题。于是调整了下代码。成功修复。

await recorder.endRecording().toImage()

调整为

recorder.endRecording().toImageSync()

问题解决。

基本是这个异步方法的问题。不知道是渲染问题,还是库的问题。

代码 > 使用了下清华开源的ChatGLM2-6B

2024-03-25

作了些简单的修正,轻松的架上了。

不得不说,还是有点东西的。

至少简单的文案能高个框架出来,感觉还是能解放点生产力的。

实际效果肯定不能和chatgpt比,但chatgpt肯定也不能在我的3060上跑阿。

不知道能否继续定制和学习,如果能方便的定制和学习的话,的确是非常不错的生产力工具。

代码 > flutter中强制Statefull子元素更新

2023-11-22

为了效率,flutter的setState是只更新依赖当前State的Widget的,维护自己独立Widget,通过listen event独立更新的子Widget是不会因为setState更新的。

但有时候整个Widget的刷新是必须的,一层层向下Bind Event是不可接受的。

这时候可以通过setState更新父元素的key来实现。不同的key的父元素代表不同的组件,自然会重建了。

元素添加一个属性

var _refreshKey = UniqueKey();
 

build时指定key

return RawKeyboardListener(
key: _refreshKey,
 

需要时重设key

setState(() {
_refreshKey = UniqueKey();
});
 

就能替换整个组件树了。

 

代码 > flutter中自适应缩放窗口

2023-11-21

做网页有个常见的偷懒方法,网页中设置一个最小宽度,这样手机浏览器小于这个宽度时会自动缩放。

flutter里用FittedBox实现这个功能

minWitdh是最小宽度。

height可选,不填写根据父元素约束的maxHeight计算

 

import 'package:flutter/material.dart';

class Fullscreen extends StatelessWidget {
const Fullscreen(
{super.key, required this.child, required this.minWidth, this.height});
final Widget child;
//fixed raw widget height
//Use constraints.maxHeight if null.
final double? height;
final double minWidth;
@override
Widget build(BuildContext context) {
return LayoutBuilder(builder: (cotext, constraints) {
Widget body = child;
final widgetHeight =
height jQuery33100915512005582535_1700544202060 constraints.maxHeight / constraints.maxWidth * minWidth;
if (constraints.maxWidth < minWidth) {
body = FittedBox(
fit: BoxFit.fitWidth,
child: SizedBox(
width: minWidth,
height: widgetHeight,
child: child,
));
}
return body;
});
}
}

代码 > flutter 感受4

2023-11-17

昨天折腾到3点,才把app架构理顺了。

flutter刚建立好的代码很有诱惑性,似乎一个app应该是树状结构。

实际并不是。

Widget本质不是树,只是一片叶子。负责渲染部分。

state更只是 当前页面的 显示用数据,只是一个vm。

APP本身必须组件一个自己的业务系统。

业务系统是全局的静态对象,随着应用进入进入,随着应用退出退出。

提供各种Listenable供Widget绑定接受数据(ViewModel)。

调用服务器数据更新自己的业务内容(Model)

本来说runApp就是buidui,不该当作入口,而应该是业务系统负责调起的一个显示子系统。

代码 > flutter感受3

2023-11-14

初步把界面渲染做出来了。怎么说呢,感受比较复杂。

第一,最大的优点是dart的语法/思路与js比较一致,很多代码可以直接复制。

第二,太过mvvm。对于要直接渲染界面并不友好。

第三,asyn/await的异步其实有点没那么好用,加起锁来相对比较复杂,异步编程还是比go废脑筋一点。

第四,语法糖太多。

 

目前界面渲染是按行把文字渲染成canvas,转picture再转Image

把所有image都缓存着,需要更新时paint到一个picture里,进行全局缓存。

这样能提升不少性能。

然后async/await再这里遇到了些小问题,直接暴力加锁解决。

毕竟加锁的代价的数量级,和渲染差了无数个数量级,遇事不决,直接加锁。我就是阳光菜鸟大男孩。

代码 > flutter感受2

2023-11-13

尝试用Fluttter给Hellclient做桌面/安卓的UI端。

怎么说呢。

flutter感觉挺像react。

用来做mvvm的数据<=>界面映射很不错。

真的要动手在canvas上渲染还是挺蛋疼和麻烦的。

代码 > flutter 感受

2023-08-08

1.和Javascript的Mvvm框架比较接近的开发体验,上手不难。搞清了下state归属,多写几个组件import以后,也没啥嵌套地狱

2.比较蛋疼的语法,特别是字符串里的${},梦回shell

3.组件非常丰富。

暂时感觉还ok,继续使用,看看效果