为了统一,各视图分别使用如下组件
二、选择器Picker
1、事项选择器:ItemPickerUtil
1 | import 'package:flutter_datepicker/flutter_datepicker.dart'; |
2、日期选择器DatePickerUtil
1 | import 'package:flutter_datepicker/flutter_datepicker.dart'; |
为了统一,各视图分别使用如下组件
1 | import 'package:flutter_datepicker/flutter_datepicker.dart'; |
1 | import 'package:flutter_datepicker/flutter_datepicker.dart'; |
为了统一,各视图分别使用如下组件
在第六章进阶Flutter控件的封装一文中,我们已经知道使用继承父类式封装这种方式,不管在封装时候,还是在使用时候,写的代码都是最简洁的。而且后期如果要直接使用系统样式,也只需要改回类名,其他结构和属性都不用动即可。
所以,即使是你所定义的类只有一个入参,也一定要遵守使用继承父类式封装的设计规范。
以下以按钮中 textStyle 的传值为例:
1 | import 'package:flutter_baseui_kit/flutter_baseui_kit.dart'; |
good:
1 | import 'package:flutter/material.dart'; |
1 | class WishPublishPage extends BJHBasePage { |
详看:UI框架.xmind
详看:框架的重要性.pptx
框架是什么?
框架是解决问题的具体实现方法,能直接执行或复用。
为什么需要框架?
简单的讲是为了约束和统一。
举个例子:我们想要让所有的页面支持在无网络的时候,都有个缺省页。
如果没有一个框架,则我们每个页面都得进行很多判断和视图操作。
且后期如果需要修改,也会导致工作量巨大。
框架的好处是什么?
我们先从常见的几个工作中实际场景介绍:
网络请求:不进行框架/封装处理的话,可能遇到的问题:
①、每次进行网络请求,都得写一堆代码才能完成最基础的请求操作;
②、如果还要求对每个请求都添加一些公共参数、错误码处理,则又得每个请求添加一遍;
页面的缺省:不进行框架/封装处理的话,可能遇到的问题:
①、无网络等状态下,直接无缺省页,显示成白屏,体验极差;
②、有设置缺省页,但无进行框架化,导致每个页面都得堆一堆代码来实现缺省页功能;
③、有设置缺省页,但无进行框架化,后期需要修改时候,每个页面都修改,维护成本巨大;
视图控件(如按钮):不进行框架/封装处理的话,可能遇到的问题:
①、代码实现特长;
②、还没有点击效果,如果要添加又要一堆代码;
③、后期需要修改时候,每个页面都修改,维护成本巨大;
测试框架:
①、开发联调接口,无法设置代理抓包查看;
②、用户反馈问题,无法提供问题出现的版本等信息;
③、已发布包程序出现异常,开发无法定位;
场景问题解决要点/框架能解决的问题:
①、不用堆一堆类似代码,几行代码就实现
②、规范变化的时候,不要我关心和修改
③、增加通用功能的时候,不需要自己再去实现一遍
④、app异常时候的监测和反馈
框架化后,以上这些问题都能够得到解决。
所以,框架的好处有统一设计,
建立框架的意义:
好的框架能够保证和提升项目的可维护性,扩展性,健壮性。
能够提高工作效率
能够让风格更统一
各框架提供的功能
缺省页框架:
解决可能的初始”白屏”
无网络情况下的”空白页”
无数据情况下的”空白页”
为页面提供网络异常页并伴有刷新恢复重试
测试框架:
新增抓包设置(代理)
新增查看版本页面,方便对应反馈的问题出现的版本(防止是旧包)。
程序异常(上报+提示)
视图控件框架:
定义加载动画loading
愿望灯动画效果优化(底部下沉)
框架的使用
使用前(纯代码,未有任何封装):
1 | GestureDetector( |
框架化后:
1 | ThemeBGButton( |
为了有更好的用户体验,我们提出以下优化和升级方案。
白屏体验
网络恢复
页面无任何占位视图。如页面本身就是一个列表。
页面数据来源于网络,网络请求回来前,空。
主要有以下两种方案,各自独立,分场景使用。
①界面框架预染页(美团/饿了么的灰底效果)
②数据预加载(首页)
美团/饿了么的灰底效果(如商品详情页)
1 | // bad |
当realWidgets中的数据全部来自网络时候,也有白屏的可能,如列表,如需确实有界面框架显示,使用如下方式:
初次冷启动:
使用与产品约定的默认数据来加载
其他:
保存缓存数据,下次使用缓存数据来加载
框架接入 2d
②处理请求后的场景:文字提示+页面展示(无数据+无网络)
2、网络异常:
为页面提供网络异常页并伴有刷新恢复重试
框架接入 2d
根据情况,弹出易于用户理解的错误提示
1 | // bad |
接入bugly服务+自定义异常页
接入第三方bugly 或华为AGC的崩溃服务
默认的程序异常页 VS 处理后的程序异常页

程序异常上报后的后台:
异常上报 1d
新增查看版本页面,方便对应反馈的问题出现的版本(防止是旧包)。
新增代理设置,方便接口人员抓包排查
定义加载动画loading
愿望灯动画效果优化(底部下沉)
UI提供 images 或 json,自定义loading动画
采用上层愿望灯不变,底部进行下沉动画来实现愿望灯上飘的效果
图层
内部界面
开发中/已实现:
点击后直接进入,并展示
待开发:
点击后,弹出”将进入XXX功能,其待开发中”
产品未规划:
不显示该入口
重定向
域名切换:tke
通过页面分析,与产品和后台确认哪些页面需要进行接口拆分。
目前可能需要处理的有:
使用 image 或 json 实现loading动画
1 | static void showLoading(bool show); |
| 编号 | 页面状态PageType | 功能 | 人日 | |
|---|---|---|---|---|
| 1 | 加载失败 | errorWidget | 0.25 | |
| 2 | 加载成功,但无数据 | nodataWidget(含”重新加载”操作) | 0.5 | |
| 3 | 加载成功,且有数据 | successWidget | 0 |
通过传入不同的状态,显示不同状态下的页面
5、含状态管理的页面基类
1 | int currentPageType = successWidget; // 默认的状态页面 |
重构及增加错误码友好提示处理 1d
键盘收起
默认颜色+自定义背景颜色
状态获取
导航栏重用success上添加的
1
2
3
4
5
6
7 Visibility 隐藏/可见,能保存组件的状态;Offstate不能保存组件的状态,组件重新加载
* 控制child是否显示
*
当offstage为true,控件隐藏; 当offstage为false,显示;
当Offstage不可见的时候,如果child有动画等,需要手动停掉,Offstage并不会停掉动画等操作。
const Offstage({ Key key, this.offstage = true, Widget child })
白屏:
①处理请求前的场景:数据预加载+框架预染页(美团/饿了么的灰底效果)
②处理请求后的场景:文字提示+页面展示(无数据+无网络)
2、网络异常:
为页面提供网络异常页并伴有刷新恢复重试
3、程序异常(上报+提示):
接入bugly服务+自定义异常页
4、视觉体验优化
定义加载动画loading
愿望灯动画效果优化(底部下沉)
5、测试优化
新增查看版本页面,方便对应反馈的问题
新增代理设置,方便接口人员抓包排查
6、其他
AA送礼:提测,待测试验证后,如有问题修复
开发者账号申请审核未通过,正在处理。 (因为域名问题被拒,新域名已经准备好了,在跟apple沟通中)
下周:
继续我的模块开发,联调接口。
在完成”我的”模块或等待接口情况下,评估及开发产品规划的其他功能。
目前:
框架升级(白屏、预览页灰底、网络刷新恢复页,异常上报及异常页):今天
愿望灯 ok
许个愿 ok
我的:部分在联调,部分在等接口
AA送礼:提测,待测试验证后,如有问题修复
loading
开发者账号申请审核未通过,正在处理。 (因为域名问题被拒,新域名已经准备好了,在跟apple沟通中)
为了有更好的用户体验,我们对页面框架进行如下优化。
1、错误页和空白页的页面,需要自定义
1 | import 'package:flutter_effect/flutter_effect.dart'; |
buildInitWidget其他,如果你还想设置初始页面,目前初始视图默认是空白视图
1 |
|
设置背景图片
1 | // 背景视图(常用来设置背景图片) |
详细而全的文档:Pro Git(中文版)
回退命令:
1 | 在git push的时候,有时候我们会想办法撤销git commit的内容 |
1 | $ git reset HEAD^ 回退到上个版本,代码还在 |
当你有多处备份的时候,你可以强制性的执行
git reset –hard HEAD^
但是你刚commit上去,未push出去的就没法找回了。
网上的参考:pod install报错:ArgumentError - Malformed version number string
实际:通过执行sudo gem install cocoapods命令重装cocoapods即解决了。
出现 POST git-receive-pack (chunked) 的原因就是 当使用 HTTPS 提交到 Git 上时使用不检查加密要是东西过多将导致提交停止。
解决方法:
1 | 方案1> 使用 Git 提交代码 |
.png)
再次提交将会成功。
–
以下目录内容全部摘自:iOS中的单例模式
# 目录 * [一、什么是单例模式](#)
1 ...
1 | 1、内存问题 |
1、单例:dispatch_once (使用dispatch_once时,不用使用@synchronized)
单例是一种用于实现单例的数学概念,即将类的实例化限制成仅一个对象的设计模式。
或者我的理解是:单例是一种类,该类只能实例化一个对象。
实现单例模式的函数就是void dispatch_once( dispatch_once_t *predicate, dispatch_block_t block);
该函数接收一个dispatch_once用于检查该代码块是否已经被调度的谓词(是一个长整型,实际上作为BOOL使用)。它还接收一个希望在应用的生命周期内仅被调度一次的代码块,对于本例就用于shared实例的实例化。
dispatch_once不仅意味着代码仅会被运行一次,而且还是线程安全的,这就意味着你不需要使用诸如@synchronized之类的来防止使用多个线程或者队列时不同步的问题。
Apple的GCD Documentation证实了这一点:
如果被多个线程调用,该函数会同步等等直至代码块完成。
示例:在整个应用中访问某个类的共享实例
1 | + (NetworkManager *)sharedInstance |
就这些,你现在在应用中就有一个共享的实例,该实例只会被创建一次。
下次你任何时候访问共享实例,需要做的仅是:NetworkManager *networkManager = [NetworkManager sharedInstance];
2、线程的同步执行@synchronized
为了防止多个线程同时执行同一个代码块,OC提供了@synchronized()指令。使用@synchronized()指令可以锁住在线程中执行的某一个代码块。存在被保护(即被锁住)的代码块的其他线程,将被阻塞,这也就意味着,他们将在@synchronized()代码块的最后一条语句执行结束后才能继续执行。
@synchronized()指令的唯一参数可以使用任何OC对象,包括self。这个对象就是我们所谓的信号量。