Flutter
大招至胜
完美主义者+细节强迫症
展开
-
Flutter高斯模糊
最近我在GridView中,对每个item进行高斯模糊,结果整个GridView会被高斯模糊。最后解决方式是在BackdropFilter外面包裹一个ClipRect.在Flutter中,我们可以用BackdropFilter实现高斯模糊。原创 2022-12-10 21:10:31 · 652 阅读 · 0 评论 -
flutter ListTile添加边框
Flutter ListTile添加边框原创 2022-10-04 23:50:32 · 1353 阅读 · 0 评论 -
Flutter获取Widge的大小与位置
在开发的时候,有时候我们需要获取Widget的位置与大小的需求,比如输入框激活状态,键盘出现有可能会遮挡输入框,这个时候我们就需要获取widget的位置与大小,然后计算页面偏移,然后滚动让页面可见。方法很简单,就是给Widget设置GlobalKey,然后就可以通过key获取对应的RenderObject, 通过RenderObject就可以获取Size与Position.这样就可以获取位置与大小了,剩下的事情就交给你了。😄...原创 2022-06-15 21:52:45 · 2331 阅读 · 0 评论 -
是时候升级dart null-safety了
出来了这么久了,是时候把项目升级并支持null-safety了。记录一下我的步骤。升级所有依赖的第三方库。如果有问题就找替代库。比如我使用了一个分享的插件,但是作者没有更新并支持null-safety, 但是有热心的网友会提供null-safety版本,直接git引用。social_share_plugin: git: url: https://github.com/fareesh/social_share_plugin.git ref: master确保所有原创 2021-11-21 14:34:34 · 2108 阅读 · 1 评论 -
Flutter类冲突
自己写的类与Flutter Framework里面的类同名了,就会冲突。如何解决呢?引入的时候取别名import ‘xxxx.dart’ as Util;这时候就可以再你的类前面加Util.YourWidget进行使用。也可以将不用的隐藏的import ‘xxx.dart’ hide XXXWidget;当然你还可以改你自己的类名避免冲突目前就知道这三种方法。...原创 2021-11-21 10:34:28 · 1796 阅读 · 0 评论 -
Flutter多SDK管理
python,node这些语言都有多版本管理器。 flutter其实也有,叫fvm。我用了几个版本的fvm,发现befovy/taps版本的fvm是最好用的。我记录一下在Mac电脑上的安装,方便以后查询。首先是安装,用homebrew吧,方便!!!brew tap befovy/tapsbrew install fvm我想把flutter sdk安装到/opt/fvm目录下,所以我们需要手动创建这个目录,并将该目录的拥有者设为当前用户,获取当前用户的命令是whoamisudo mkdir -p原创 2021-11-09 00:36:32 · 2103 阅读 · 0 评论 -
Flutter多线程
在用flutter写IM的时候,当用户很久没有上线过,再次上线的时候,会收到很多离线消息。我是用一个while循环收的,直到收完离线消息,这样可想而知,一点会影响UI的。 消息不多的情况还好,当消息多的时候必然会阻塞UI.于是这样的任务必须放到子线程去做。而dart中多线程的实现是isolate的方式实现的。在flutter中对Isolate有一定的封装,使用compute, 下面我就用这两种方式各实现一个demo.isolate的方式, 通讯是用ReceivePort与SendPort,一个用于发消原创 2021-11-07 11:51:08 · 3431 阅读 · 0 评论 -
Flutter CustomPainter一直重绘
本以为重写CustomPainter 中下面的方法,返回false就不重绘了,结果每次还是会触发paint方法@override bool shouldRepaint(CustomPainter oldDelegate) { return false; }查询资料后,原来是要在外面包一层。RepaintBoundary( child: CustomPaint( painter: YourPainter(), ))...原创 2021-09-11 13:40:51 · 728 阅读 · 0 评论 -
Flutter CustomPaint paint方法每帧都会调用
本以为shouldRepaint方法返回false就不会触发了,结果还是会。@override bool shouldRepaint(CustomPainter oldDelegate) { return false; }结果发现需要在CustomPaint外面用RepaintBoundary包装一层。这下就不会每帧都触发了,开森哦!!...原创 2021-07-11 11:42:26 · 504 阅读 · 1 评论 -
Flutter中跟随移动
做弹出层下拉列表的时候,我们想要下拉列表跟随输入框滚动。可以使用CompositedTransformFollower,CompositedTransformTarget,然后LayerLinkclass CountriesField extends StatefulWidget { @override _CountriesFieldState createState() => _CountriesFieldState();}class _CountriesFieldState ex原创 2021-06-30 22:32:15 · 630 阅读 · 2 评论 -
Flutter简单的弹出层
弹出提示,如果不想集成第三方的,用Overlay就可以实现直接上示例:showOverlay(BuildContext context) async { OverlayState overlayState = Overlay.of(context); OverlayEntry overlayEntry = OverlayEntry( opaque: false, builder: (context) => Positioned( child: CircleAvatar(原创 2021-06-30 22:17:51 · 1266 阅读 · 0 评论 -
Flutter OutlinedButton圆角与边框自定义
OutlinedButton(style: OutlinedButton.styleFrom(shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(18.0),),side: BorderSide(width: 2, color: Colors.green),),onPressed: () {},child: Text(‘Button’),)shape: StadiumBorder(),是体育场外框。...原创 2021-04-16 16:25:47 · 8064 阅读 · 0 评论 -
Flutter放一个隐藏的webview
最近在用google的recaptcha, 要调用js。我的办法就是在页面中放一个隐藏的webview.有两个方法实现用IndexedStack, 将webview放在最底部。第二种是用Opacity,设置opacity为0原创 2021-03-26 21:03:59 · 662 阅读 · 0 评论 -
Flutter运行项目等太长时间
原因是gradle默认的是google与jcenter的源,修改为国内阿里的镜像。首先是工程目录下的修改然后是flutter按照目录下的两个文件maven { url 'https://maven.aliyun.com/repository/google' }maven { url 'https://maven.aliyun.com/repository/public' }然后用AS打开android目录下的android工程, 更新完依赖,关闭后再打开flutter工程,运行就快了。原创 2021-02-04 20:56:23 · 3863 阅读 · 0 评论 -
Flutter initialRoute会先加载home页面再加载initialRoute指定的页面
在flutter中,我们可能会是这样的逻辑: 打开app的时候判断有没有登录,如果没有登录就显示登录页面,如果登录了就显示主页面。我们路由可能是这样的:'/login': (context) => LoginPage(),'/': (context) => HomePage(),在main.dart中,有一个变量firstPage, 更加是否登录来设置它的值,当没有登录的时候就是firstPage=’/login’, 并传入MaterialApp构造函数。MaterialApp(.原创 2020-12-06 21:01:35 · 2716 阅读 · 0 评论 -
Flutter+FCM开发推送功能
我是直接站在巨人的肩上了安装https://pub.flutter-io.cn/packages/firebase_messaging的文档,将fcm集成到flutter项目中。运行遇到错误:MissingPluginException(No implementation found for method FcmDartService#initialized on channel查询github上issue发现有同样的错误,参考issue文档成功解决再运行,没有错误了,赶紧到fcm console中原创 2020-12-03 17:16:37 · 1039 阅读 · 1 评论 -
Flutter IDEA中右键flutter菜单灰色解决方法
这个问题是应为用老的flutter sdk创建的项目,然后更新了flutter sdk.老的flutter sdk创建的工程android目录里面是android.iml文件。新的应该是_android.iml改一下名字就可以了原创 2020-12-02 22:16:41 · 1591 阅读 · 0 评论 -
Flutter路由监听
点击返回按钮的时候我用WillPopScope这个widget来监听的。后来,为了更细的监听路由,我发现了flutter自带的监听器,直接上代码,节约时间首先创建一个全局变量,不在任何类里面final RouteObserver<PageRoute> routeObserver = RouteObserver<PageRoute>();然后告诉flutter:喂,这是观察者,你路由的时候给他说一下!在main.dart中加入Widget build(BuildConte原创 2020-12-02 16:04:12 · 1370 阅读 · 0 评论 -
Flutter局部刷新
在开发项目的时候,一个比较复杂的页面。如果setstate会触发build导致整个页面刷新。页面会闪烁。有时候,往往需要刷新的只是其中一个很小的widget. 这个时候我们就需要局部刷新。原理就是将需要刷新的widget单独提取为一个statefulwidget,然后再其内部调用setState方法来刷新。可以用的框架有ProviderRedux或者直接StreamController + StreamBuilder不明白的可以交流。...原创 2020-10-20 16:51:09 · 954 阅读 · 0 评论 -
Flutter TextField自定义键盘
TextField获取到焦点后弹出的是系统的键盘,有的功能需要自定义键盘,那如何办呢?我觉得需要两步,首先要禁止弹窗系统键盘,然后再显示自定义键盘禁用很简单,设置两个属性即可readOnly: true,showCursor: true,再在合适的地方显示你的自定义键盘。onTap: () { //这儿触发自定义键盘显示},简单吗?...原创 2020-09-27 11:09:18 · 1891 阅读 · 1 评论 -
Flutter键盘消失的方法
滚动的时候让键盘消失NotificationListener( onNotification: (t) { if (t is UserScrollNotification) { //方法1(推荐) FocusScopeNode currentFocus = FocusScope.of(context); if (!currentFocus.hasPrimaryFocus && currentFocus.focusedChild != null)原创 2020-09-25 09:34:36 · 904 阅读 · 0 评论 -
Flutter让键盘消失,但是TextField不丢失Focus
让TextField autoFocus为true,或者FocusScope.of(context).autofocus(_focusNode);原创 2020-09-24 16:57:41 · 2612 阅读 · 0 评论 -
Flutter更新第三方库后,可能遇到的问题
做晚更新了一下第三方库,然后flutter pub get,build_runner 结果报错。原来是需要更新一下第三方依赖flutter pub upgrade就成功了。原创 2020-09-24 10:57:46 · 1756 阅读 · 0 评论 -
Flutter 弹出框, TextField会失去焦点
最近在研究flutter IM UI 的开发,在聊天页面中,长按弹出弹出框。我用的是PopupRoute来做的。结果会让输入框失去焦点。为了不让输入框失去焦点,我使用了TransitionRoute代替PopupRoute,这样就不会失去焦点。记录一下,方便查询。...原创 2020-09-22 11:35:04 · 1577 阅读 · 0 评论