上手/入门 A tour of Flutter

分类 标题 介绍 传送门
UI/UX Flutter Widget of the Week 展示一些Widget基本功能, 超短视频,有个印象! 地址
汇总 Dart’s Flutter Framework Study 学习资料大集合,并介绍了如何在不同的页面上保持状态(BottomNavigationBar) 地址

基本功 Dart

指引&指导 Guide

Widget/UI输入框 InputWidget

异步操作 Asynchronous : Future & async/await

JSON序列化 JSON Serialization

存储&读写文件 File I/O

未分类 Others

工具链 DevToolsChain

插件 Useful Plugin/Package

本地存储/持久化 Local Storage/Data Persistence

状态管理 State Management

原生交互 Native Interaction

未分类 Others

优秀仓库 Git Repository

学习资料参考 Study Reference

素材/设计工具 Assets/Design Tools

一些问题 Some Problems

踩过的坑:

BottomNavigation(底部选项卡)无法保持各个页面状态,这不符合直觉

方案一

  • 关键类 : PageStorageKey, PageStorageBucket

  • 示例代码 :

  • 关键代码 :

    final PageStorageBucket bucket = PageStorageBucket();
    //...
    return Scaffold(
    body: PageStorage(
      child: currentPage,
      bucket: bucket,
    ),
    //...
    PageStorage.of(context).writeState(context, b,
      identifier: ValueKey(
        '${widget.dataList[index].id}',
      ));
    
  • 注意点 : 每个新的继承 StatefulWidget , StatelessWidget 或自定义Widget的新的Widget,要提供 Key 的构造参数并调用super(key:key),以确保框架提供相应支持 `dart

class MyWidgetOrPage extend StatelessWidget{ MyWidgetOrPage(Key key, {…}):super(Key:key); //… }

class MyWidgetOrPage extend StatefulWidget{ MyWidgetOrPage(Key key, {…}):super(Key:key); //… }

//… `

方案二

其他方案


移动端开发      Flutter

本博客所有文章除特别声明外,均采用 CC BY-SA 3.0协议 。转载请注明出处!

阅读清单 上一篇