chuyouyinghe的专栏

暴力方法，将上面提示的 /Users/用户名/.gradle/caches/modules-2 目录下的lock文件删掉。使用安卓手机调试，一直提示这个错误，clean，关机重启只成功一次。接着重新运行gradle命令，则可以正常运行了。

从 Android 转向 Flutter 后，受不了没有 ConstraintLayout 的日子，更反感嵌套地狱，网上的优化方法都治标不治本。于是继 2016 年开源 MagicIndicator（9100+ star） 以后，我只能再次发力了。github.com/hackware199…欢迎试用并给我反馈。Flutter ConstraintLayout一个超级强大的 Stack，使用约束构建极为灵活的布局，和 Android 下的 ConstraintLayout 和 iOS 下的

本文作者：徐宜生，原文发布于：群英传。Flutter这个东西出来这么久了，到底市场占有率怎么样呢？为了让大家了解这一真实数据，也为了让大家了解当前Flutter在各大App中的使用情况，我今天下载了几百个App，占了手机将近80G空间，就为了得出一个结论——Flutter，到底有没有人用。首先，我在vivo应用市场中，下载了4月11日软件排行榜中的所有App，总计230个，再加上平时用的比较多的一些App，总共270个App，作为我们的统计基数。检测方法，我使用LibChecker来

1. Flutter 的现状自从 2018 年 12 月，谷歌发布了 Flutter 1.0稳定版本，至今 Flutter 已经发布到了 2.10 版本，几乎每次版本发布都会解决数千个问题、合入数千个PR，官方的持续的更新，让整个 Flutter 生态越来越强大，你可以通过一套代码库来构建 Android、iOS、桌面、嵌入式等应用。Flutter已经俨然成为世界上最流行的跨平台框架之一了。通过Flutter 官网显示：https://flutter.dev/ecosystem.

相信大家已经都在对 Flutter 2.10 版本跃跃欲试，本篇就目前升级用 Flutter 2.10 版本遇到的问题做一些总结提炼。事实上按照 Flutter 每个版本的投入使用规律，应该是第三个小版本最稳，以 Flutter 目前庞大的用户量，每次正式版的发布必然带来各种奇奇怪怪的问题，一般情况下我推荐 2.10 版本等到 2.10.3 发布再投入生产会更稳妥，但是如果你等不及官方 hotfix ，那么后面的内容可能可以帮助到你。本次如果你是从 2.8 升级的到 2.10 ，那么 dart.

这是JsonChao的第 57 期分享思维导图大纲目录 一、检测手段 1、Flutter Inspector 2、性能图层 3、Raster 线程问题 4、UI 线程问题定位 5、使用 checkerboardOffscreenLayers 检查多视图叠加的视图渲染 6、使用 checkerboardRasterCacheImages 检查缓存的图像 二、关键优化指标 1、页

我们小学二年级就学过：Dart 是单线程的并且 Flutter 依赖于 Dart。但是如果我们要在主线程做一些计算量大的操作，就必然会阻塞线程，使UI更新卡顿甚至卡死。那怎么办呢？好消息是 Dart 为我们提供了 isolate，isolate 跟线程差不多，他是 Dart 中的线程。isolate 与线程的区别就是线程与线程之间是共享内存的，而 isolate 和 isolate 之间是不共享的，所以叫 isolate (隔离)。在flutter 里面主线程就是主 isolate 。如

一. isolate简介Dart 是单线程，Dart 为我们提供了 isolate，isolate 跟线程差不多，它可以理解为 Dart 中的线程。isolate 与线程的区别就是线程与线程之间是共享内存的，而 isolate 和 isolate 之间是内存不共享的，所以叫 isolate (隔离)。因此也不存在锁竞争问题，两个Isolate完全是两条独立的执行线，且每个Isolate都有自己的事件循环，它们之间只能通过发送消息通信，所以它的资源开销低于线程。原文链接：https://blog.c

一 . 原始代码为什么要Isolate，我们先看一段比较简单的代码：import 'package:flutter/material.dart';import 'package:flutter/foundation.dart'; class TestWidget extends StatefulWidget { @override State<StatefulWidget> createState() { return TestWidgetState();

Flutter性能监控工具（1）--- Observatory简介主要讲了如何打开Observatory，现在讲一下如何使用Observatory里的各个功能来分析性能问题，下图是Observatory的主页面：最上面的蓝色导航栏表示当前所在的位置 vm@ws://127.0.0.1:50579/ws ：表示当前连接的VM 鼠标放在这个上面，会看到这个，表示当前APP的main()： 右边的Refresh ：刷新数据VM这里显示当前VM的信息name ： 当前V.

0x00 前言Flutter的宣传说，使用Flutter可以达到60FPS，但是这并不意味，不管你怎么写，都能达到60FPS，如果有耗时的操作，可能会阻塞UI的渲染，如果内存使用过多，也有可能会OOM，所以性能的好坏，是保证Flutter能否达到60FPS的关键，在对Flutter进行性能优化之前，我们先看下如何来监测Flutter的性能。0x01 Flutter的三种构建模式(build modes)Flutter有三种构建模式，适用于不同的场景，想要对性能监控，都跑在Profile模式下:

0x00 前言PerformanceOverlay是在app上显示性能统计数据的浮窗。PerformanceOverlay是一个Widget，有几个属性，用于控制开启哪些功能。0x01 PerformanceOverlay 分析PerformanceOverlay的源码是：~/flutter/packages/flutter/lib/src/widgets/performance_overlay.dart复制代码可以看出PerformanceOverlay有以下的属性： fin

1、打开ObservatoryAndroid Studio 命令行Terminal中运行flutter run，应用启动成功后，命令行中会输出一个 url，复制 url 到浏览器打开。2、VM screen打开Observatory，进入的是VM 页面，介绍app的整体情况进入isolate main 页面后的显示3、Allocation Profile查看内存分配情况Accumulator 列表示自isolate开始或者重置accumulator 后的累计数...

在Flutter中性能问题可以分为GPU线程问题、UI线程（CPU）问题。这两类问题可以通过Flutter提供的性能图层进行定位分析。性能图层（Performance Overlay）Flutter为了帮助开发者定位代码中的性能问题，提供了性能图层，它可以让我们快速的定位问题。为了使用性能图层，我们需要以分析模式（Profile）来运行App，之前我们已经了解到Profile（分析）模式和Release模式一样，都需要在真机上才能运行，而且Profile模式和Release模式一样，使用

文章目录一、前言二、代码一、前言在应用中有时候会需要判断程序的前后台状态,这里主要使用WidgetsBindingObserver进行判断。对于前后台判断的情况也只是WidgetsBindingObserver中的一种功能。对于WidgetsBindingObserver需要注意两点:最好是最先进入而且不会销毁的页面，这样可以判断整个程序的前后台状态WidgetsBindingObserver要写在被MaterialApp或者其它主题包裹的地方二、代码import 'package:f

class FlutterLifeCycleState extends State<FlutterLifeCycle> with WidgetsBindingObserver { @override void initState() { super.initState(); WidgetsBinding.instance.addObserver(this); //添加观察者 } ///生命周期变化时回调// resumed:应用可见并可响应用户操作.

官方文档介绍Adapter What's adapteradapter为fish_redux团队对listView的优化封装，适用于长列表渲染，其中实现方式有以下三种DynamicFlowAdapter 接受数组类型的数据驱动 StaticFlowAdapter 接受map类型的数据驱动 CustomAdapter 自定义 adapterDynamicFlowAdapterclass ListGroupAdapter extends DynamicFlowAdapter<Ad

在实际开发的过程中，我们经常需要固定某个Widget的宽度或高度，这时我发现我该给什么值呢？不同的设备上显示结果是什么呢？带着这个问题我开始了这篇文章。1. 官网竟然没有。我不知道是不是我没找到，但到目前为止我真的没找到。哪位朋友如果找到了麻烦评论里说一声。2. 百度文章一：flutter 屏幕适配 字体大小适配_卓原的进化之旅-CSDN博客_flutter 屏幕适配点评：直接给出方法来做适配了，而我的目的是了解flutter自己是如何处理尺寸单位的。但其中的一句话让我有了.

import 'dart:async'; void main(){ new Future(() => futrueTask()) .then((i) => 'abc$i') .then((m) => print('$m')) .then((_) => new Future.error('出错了')) .whenComplete(() => print('whenComplete')) .catchErro.

要在effect里去监听page要混入with WidgetsBindingObserverMixinLifecycle.didChangeAppLifecycleState监听flutter生命周期的变化AppLifecycleState.inactive: // 处于这种状态的应用程序应该假设它们可能在任何时候暂停。 AppLifecycleState.resumed:// 应用程序可见，前台AppLifecycleState.paused: // 应用程序不可见，后台AppLifecy

Positioned控件主要用来设置绝对布局，必须配合Stack控件来使用，Positioned控件 通过设置left和top属性可以设置控件的绝对位置import 'package:flutter/material.dart';void main() => runApp(MyApp());class MyApp extends StatelessWidget { @override Widget build(BuildContext context) { ...

概述只要在父widget中调用setState，子widget的didUpdateWidget就一定会被调用，不管父widget传递给子widget构造方法的参数有没有改变。只要didUpdateWidget被调用，接来下build方法就一定会被调用。子widget首次被加载时的生命周期：initState -> build子widget首次被加载后，如果在父widget中调用setState，子widget的生命周期：didUpdateWidget -> build

Failed assertion: boolean expression must not be null出现这种情况是你的 if中的条件或者其他条件为null，如下两种条件,原因貌似是在dart中bool的值只有 true 或者 false,所以 null不会被视为false ，同理 >1的数也不会视为true，反而会出现错误。这大概和dart什么都是对象属性有关，bool值true fasle 也是对象，其他对象自然不能填入dart官网原话:To represent boolean v

Offstage( offstage: true, //这里控制 true false 布尔值 child: '子控件',),转自：https://www.jianshu.com/p/3bfbfbeca30c

开发环境：Mac OS 10.14.5VSCode 1.36.1Flutter 1.9.1+hotfix.2前言这是第二篇关于状态管理的文章。第一篇见 Flutter示例系列（二）之状态管理-壹（scoped_model）。写过前端React或者RN的大概都接触过Redux，本文主要讲述阿里团队开发的 fish-redux 框架。还有一个使用较多的框架 flutter-redux，想要了解的可以参考此博文。概念1. fish-redux 的前世今生？fish-redux 是一个.

一、SliverList的简介要同时滚动ListView和GridView的时候可以使用SliverList和SliverGridSliverList需要和CustomScrollView配合使用二、SliverList的源码const SliverList({ Key key, @required SliverChildDelegate delegate, }) : super(key: key, delegate: delegate);三、SliverLis

文中所有示例代码请点击：gitee.com/yumi0629/Fl…今天呢，我小拉面主要想给大家讲一讲Flutter中的Slivers大家族的使用场景和方法。开发过列表布局的同学们应该对Slivers系列的控件不陌生，或多或少都用过这个库中的控件，来解决复杂的滑动嵌套布局。比如之前讲Hero的时候提到的下面这个界面，使用普通的GridView的话是没法实现的，我们选择使用CustomScrollView，然后在slivers属性中添加子控件，在这个例子里，我们可以用SliverTo...

import 'package:flutter/cupertino.dart';import 'package:flutter/material.dart';class SliverListDemo extends StatefulWidget{ @override _SliverListDemoState createState()=>_SliverListDemoState();}class _SliverListDemoState extends State<Slive.

如果你对Flutter还有疑问或者技术方面的疑惑，欢迎加入Flutter交流群（微信：laomengit）。 同时也欢迎关注我的Flutter公众号【老孟程序员】，公众号首发Flutter的相关内容。 Flutter地址：http://laomengit.com里面包含160多个组件的详细用法。要同时滚动ListView和GridView的时候可以使用SliverList和SliverGrid。SLIVERLISTSliverList的用法非常简单，只需一个构建函数，用法如下：S..

已经是很久很久很久没有更新了，这段时间过得略糟糕，此处省略一万字。。。感觉一眨眼，flutter都1.6了，落后了好多了，又重新捡起来熟悉了一遍，才想起来页面咋创建的，好抱歉~~~~昨晚偶然看到了一个比较好玩的组件，叫 Chip，应用场景（关于应用场景，这个链接说得很详细），官方翻译叫标签或者芯片一、效果二、构造函数解析：const Chip({ Key key, this.avatar,//左侧的图标 @required this.label,

ListView Widget横向列表在上一篇Flutter学习笔记五——ListView Widget中认识了ListView Widget的基本使用，默认情况下是竖向列表,这一篇来了解一下横向列表的使用。其实ListView实现横向列表，只需要添加ScrollDirection属性。body: Center( child: Container( height: 200.0, child: ListView(

1.实体类class VideoInfo { String body; int id; String title; int userId; VideoInfo({this.body, this.id, this.title, this.userId}); factory VideoInfo.fromJson(Map<String, dynamic> json) { return VideoInfo( body: json['body'],...

很难想象移动应用程序不需要与Web服务器通信或在某个时刻存储结构化数据。 在编写需要联网的应用程序时，我们很可能迟早需要使用JSON。在本教程中，我们将探讨如何在Flutter中使用JSON。我们回顾一下在不同情况下使用的JSON解决方案以及原因。哪种JSON序列化方法适合我？ 小项目手动序列化 在大中型项目中使用代码生成 Flutter中是否有GSON / Jackson / Moshi？ 使用 dart:convert手动序列化JSON 内连序列化JSON 在模型类中序列化

效果图如下插件地址1 . 配置文件 pubspec.yamldependencies: flutter: sdk: flutter flutter_localizations: sdk: flutter ... flutter_easyrefresh: ^2.1.2 . 配置文件main.dart **...import 'package:flutter_easyrefresh/easy_refresh.dart';import 'packag...

关注 https://github.com/jiangkang/flutter-system 了解更多Flutter相关的知识图片圆角在开发中还是非常常见的，用Flutter实现圆角还是非常简单的，目前了解的大概有下面这几种：通过Card的shape属性通过Container的decoration直接使用ClipRRect效果图通过Card的shape属性Card( shape: RoundedRectangleBorder( ...

源代码import 'package:flutter/material.dart';void main () => runApp(MyApp());class MyApp extends StatelessWidget{ @override Widget build(BuildContext context ){ return MaterialApp( title:'All Widget Usages', home:Scaffold(

一开始代码这么写：Widget buildView(EgcSearchProductState state, Dispatch dispatch, ViewService viewService) { TextEditingController controller = TextEditingController(); return NavigationContent( title: "创建商品素材", body: Container( width: double

flutter中获取TextField的值需要通过TextEditingController，示例代码如下：TextEditingController emailController = new TextEditingController();//声明controller .... TextField( controller: emailController,//指定controller obscureText: true, textAlign: TextAlign.lef..

流式布局Wrap和Flow在介绍Row和Colum时，如果子widget超出屏幕范围，则会报溢出错误，如：Row( children: <Widget>[ Text("text"*100) ],);运行效果如图所示：可以看到，右边溢出部分报错。这是因为Row默认只有一行，如果超出屏幕不会折行。我们把超出屏幕显示范围会自动折行的布局称为流式布局。Flutter中通过Wrap和Flow来支持流式布局，将上例中的Row换成Wrap后溢出部分则会自动折行，下面我

1. Opacity 透明度和尚以前在处理 Widget 的显隐性时用的是设置 Widget 宽高均为0，方式不太好，偶然间了解到 Opacity，可以通过处理透明度来处理 Widget 的显隐性。Opacity 可以使子控件透明，可以通过设置 0.0～1.0之间的值来设置透明度；对于 0.0 子控件基本没有绘制过，对于 1.0 会立即绘制而不使用中间缓冲区。这种方式比直接在 Widget中添加和删除子控件更有效。Tips: opacity 的值必须在 0.0～1.0 之间，类似于 Android