说明 Flutter 实现的拼图游戏 Real Puzzle
使用Flutter flame游戏引擎实现
截图 ##实现原理
TOTO
地址 演示地址 https://jigsaw.xfans.me/ 源码地址: https://github.com/xfans/flutter_jigsaw_puzzle
说明 Flutter 2.5 版本中的破坏性改动
默认的设备拖动和滚动 v2.2 版后删除了废弃的 API Package 介绍: flutter_lints ThemeData 的 accent 属性已被弃用 手势识别器清理 将 AnimationSheetBuilder.display 替换为 collate 使用 HTML 插槽在 Web 中渲染平台视图 将 LogicalKeySet 迁移至 SingleActivator 项目使用Flutter2.5编译后,部分页面的颜色发生了变化。
需要对ThemeData 的 accent 属性进行适配。
改动 主题信息 ThemeData 中的 accentColor、accentColorBrightness、accentIconTheme 和 accentTextTheme 属性现已被弃用。
Material 设计规范 不再为 Material 组件指定或使用「强调」色。组件的默认颜色来自整个主题的 颜色方案。现在通常使用 ColorScheme 的 secondary color 代替 accentColor,并且在需要对比色时使用 onSecondary 属性。
适配 适配前:
适配后:
使用时:
改为:
相关链接 https://flutter.cn/docs/release/breaking-changes/theme-data-accent-properties
https://flutter.cn/posts/whats-new-in-flutter-2-5
Todo
说明 把launcher的theme添加
<item name="android:windowIsTranslucent">true</item>
会引起生命周期的异常,引发home键无效等bug。
解决方法 使用
<item name="android:windowBackground">@android:color/transparent</item>
<item name="android:windowShowWallpaper">true</item>
代替
背景 在Flutter中通常使用cached_network_image控件显示图片,该控件使用http库请求图片,http库无法像dio一样方便的添加拦截器等。
实现 CachedNetworkImage使用flutter_cache_manager进行图片缓存,可以使用自定义cache_manager来替换http为dio。 如下:
使用方法 然后就可以使用dio的拦截等功能了,比如使用拦截器添加并刷新token,添加log等功能。
地址 https://pub.dev/packages/flutter_cache_manager_dio
https://github.com/xfans/flutter_cache_manager_dio
作用 InheritedWidget是一个在Widget树中,从上往下传递信息的小部件。
主要从两个方面理解源码:
1.子Widget可以获取到父控件中的InheritedWidget,从而获取到InheritedWidget的信息。
2.子Widget调用dependOnInheritedWidgetOfExactType后,当父InheritedWidget重建后,会调用子控件重建。
原理 1.子控件可以获取到父控件中的InheritedWidget 在Element中有个Map:
其中保存了该Widget的父节点中的InheritedWidget。会在mount`activate`
方法中赋值,赋值的代码如下:
在Element中
在InheritedElement中
经过上面两个方法,Widget本身就可以通过_inheritedWidgets获取到InheritedElement了
2.子Widget调用dependOnInheritedWidgetOfExactType后,当父InheritedWidget重建后,会调用子控件重建 在InheritedElement中有个Map:
当子Widget调用dependOnInheritedWidgetOfExactType方法时,会依次调用dependOnInheritedElement方法,InheritedElement的updateDependencies方法,setDependencies方法。将自己注册到父InheritedElement的_dependents中。
当InheritedElement重建时会调用updated方法,然后会调用到notifyClients方法,最终调用Widget didChangeDependencies方法并重建子Widget。
由上边的代码可以看出,只有当子Widget调用了dependOnInheritedWidgetOfExactType才会收到InheritedWidget的重建通知。
说明: 在未刷机的情况下,口袋阅1的默认桌面如下:
自己安装的程序无法在桌面上显示,而桌面上的kindle又不经常使用。可以改为,点击Kindle进入自己安装的程序,比如:点击Kindle进入koreader。
方法: 实质上就是,自己编写一个与Kindle包名相同的程序,启动该程序时,启动你设置的程序。核心代码如下,很简单:
可以使用已经编译好的程序:
安装后输入要替换的包名,点击确认即可。然后点击桌面的Kindle图标即可进入设置的app。注意:安装该程序后,无法安装Kindle app。包名冲突。
卸载方法:adb uninstall com.amazon.kindlefc
地址: 下载地址:https://xfans.me/apps
代码地址:https://github.com/xfans/KdyReplace
说明 模仿github客户端的UI,使用flutter实现
地址:https://github.com/xfans/flutter_gitee
地址:https://gitee.com/xfans/flutter_gitee
问题 问题1 问题:Flutter中Column嵌套Listview报overflowed错误.
解决:使用Column+Expanded+Listview布局界面.
问题2 问题:数组json转换成List
解决:
问题3 问题:界面中请求网络的时机
解决:使用<a href="https://api.flutter-io.cn/flutter/widgets/FutureBuilder-class.html">FutureBuilder</a>
问题4 问题:material-design icon有哪些
解决:https://material.io/resources/icons/?icon=account_balance&style=baseline
问题5 问题:抽出appbar 时can’t be assigned to the parameter type ‘PreferredSizeWidget’
解决:
问题6 问题:flutter加载中文乱码
解决:
问题7 问题:flutter 写文件报 OS Error: Read-only file system
解决:使用path_provider插件获取目录
问题8 问题:设置android中的match_parent
解决:width: double.infinity
问题9 问题:AppBar中的leading设置大小无效
解决:被ConstrainedBox限制了大小,使用UnconstrainedBox嵌套一层即可
问题10 问题:使用bottomNavigationBar切换page时重新调用initState
解决:使用PageView包裹body,子page with AutomaticKeepAliveClientMixin,重写bool get wantKeepAlive => true
http://www.movable-type.co.uk/scripts/latlong.html