[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"project-9111":3},{"id":4,"name":5,"fullName":6,"owner":7,"repo":5,"description":8,"homepage":9,"htmlUrl":10,"language":11,"languages":10,"totalLinesOfCode":10,"stars":12,"forks":13,"watchers":14,"openIssues":15,"contributorsCount":15,"subscribersCount":15,"size":15,"stars1d":15,"stars7d":15,"stars30d":16,"stars90d":15,"forks30d":15,"starsTrendScore":15,"compositeScore":17,"rankGlobal":10,"rankLanguage":10,"license":18,"archived":19,"fork":19,"defaultBranch":20,"hasWiki":21,"hasPages":19,"topics":22,"createdAt":10,"pushedAt":10,"updatedAt":25,"readmeContent":26,"aiSummary":27,"trendingCount":15,"starSnapshotCount":15,"syncStatus":28,"lastSyncTime":29,"discoverSource":30},9111,"Flutter-Notebook","OpenFlutter\u002FFlutter-Notebook","OpenFlutter","FlutterDemo合集，今天你fu了吗","",null,"Dart",7215,1183,459,0,3,40.22,"Apache License 2.0",false,"master",true,[23,24],"flutter","flutter-demo","2026-06-12 02:02:02","### You can select the language by pressing on the options between these \n[中文版](https:\u002F\u002Fgithub.com\u002FOpenFlutter\u002FFlutter-Notebook\u002Fblob\u002Fmaster\u002FREADME.md) | [English](https:\u002F\u002Fgithub.com\u002FOpenFlutter\u002FFlutter-Notebook\u002Fblob\u002Fmaster\u002Freadme_english.md)\n![](.\u002Fimage\u002Flogo.png)\n## flutter_notebook有什么\nflutter_note_book有许多flutter相关功能demo的集合，它能够帮助您快速学习一些零碎的知识，本项目将会不定期更新。\n\n如果您觉得有用的话可以Watch该项目，之后更新会自动通知您。\n## 收集更多优秀样例\n### 本项目大多为了提供一些问题的解决思路，如果您有更好的实现方式或者好的创意，欢迎提交PR!\n## 如何下载单个项目\n将单个项目下url复制粘贴到下面这个中，将会自动生成下载文件：\n\n[DownGit](https:\u002F\u002Fminhaskamal.github.io\u002FDownGit\u002F#\u002Fhome) \n\n## 目前包含以下demo：\n### 官方控件系列\n#### 视图\n- [BottomNavigationBar底部导航](https:\u002F\u002Fgithub.com\u002FVadaski\u002FVadaski-flutter_note_book\u002Ftree\u002Fmaster\u002Fmecury_project\u002Fexample\u002Fflutter_bottomnavigationbar)\n- [BottomAppBar底部导航](https:\u002F\u002Fgithub.com\u002FVadaski\u002FVadaski-flutter_note_book\u002Ftree\u002Fmaster\u002Fmecury_project\u002Fexample\u002Fbottom_appbar_demo)\n- [自定义路由样式](https:\u002F\u002Fgithub.com\u002FOpenFlutter\u002FFlutter-Notebook\u002Ftree\u002Fmaster\u002Fmecury_project\u002Fexample\u002Fcustom_router_transition)\n- [高斯模糊（毛玻璃）](https:\u002F\u002Fgithub.com\u002FOpenFlutter\u002FFlutter-Notebook\u002Ftree\u002Fmaster\u002Fmecury_project\u002Fexample\u002Ffrosted_glass_style_demo)\n- [切换页面，保持各页面状态](https:\u002F\u002Fgithub.com\u002FVadaski\u002FVadaski-flutter_note_book\u002Ftree\u002Fmaster\u002Fmecury_project\u002Fexample\u002Fkeep_alive_demo)\n- [制作一个精美的Material风格搜索框](https:\u002F\u002Fgithub.com\u002FVadaski\u002FFlutter-Notebook\u002Ftree\u002Fmaster\u002Fmecury_project\u002Fexample\u002Fbeaytiful_search_bar_demo)\n- [TextField的焦点及动作](https:\u002F\u002Fgithub.com\u002FOpenFlutter\u002FFlutter-Notebook\u002Fblob\u002Fmaster\u002Fmecury_project\u002Fexample\u002Ftextfields_focus_demo)\n- [微信九宫格效果](https:\u002F\u002Fgithub.com\u002FOpenFlutter\u002FFlutter-Notebook\u002Ftree\u002Fmaster\u002Fmecury_project\u002Fexample\u002Fwarp_demo)\n- [标签控件 chip系列](https:\u002F\u002Fgithub.com\u002FOpenFlutter\u002FFlutter-Notebook\u002Ftree\u002Fmaster\u002Fmecury_project\u002Fexample\u002Fchip_demo)\n- [可展开控件 expansion系列](https:\u002F\u002Fgithub.com\u002FOpenFlutter\u002FFlutter-Notebook\u002Fblob\u002Fmaster\u002Fmecury_project\u002Fexample\u002Fexpansion_demo)\n- [可滑动控件Sliver系列](https:\u002F\u002Fgithub.com\u002FVadaski\u002FVadaski-flutter_note_book\u002Ftree\u002Fmaster\u002Fmecury_project\u002Fexample\u002Fsliver_demo)\n- [使用贝塞尔二阶曲线切割图像](https:\u002F\u002Fgithub.com\u002FOpenFlutter\u002FFlutter-Notebook\u002Ftree\u002Fmaster\u002Fmecury_project\u002Fexample\u002Fclipper_demo)\n- [用户可以通过拖动以交互方式重新排序的项目的列表](https:\u002F\u002Fgithub.com\u002FOpenFlutter\u002FFlutter-Notebook\u002Fblob\u002Fmaster\u002Fmecury_project\u002Fexample\u002Freorderble_listview_demo\u002F)\n\n#### 功能\n- [返回上一页时弹出提示信息](https:\u002F\u002Fgithub.com\u002FVadaski\u002FVadaski-flutter_note_book\u002Ftree\u002Fmaster\u002Fmecury_project\u002Fexample\u002Fwill_pop_scope_demo)\n- [应用开启进入闪屏页](https:\u002F\u002Fgithub.com\u002FVadaski\u002FVadaski-flutter_note_book\u002Ftree\u002Fmaster\u002Fmecury_project\u002Fexample\u002Fsplash_screen_demo)\n- [上拉加载，下拉刷新](https:\u002F\u002Fgithub.com\u002FVadaski\u002FVadaski-flutter_note_book\u002Ftree\u002Fmaster\u002Fmecury_project\u002Fexample\u002Fpull_on_loading)\n- [json自动反序列化](https:\u002F\u002Fgithub.com\u002FVadaski\u002FVadaski-flutter_note_book\u002Ftree\u002Fmaster\u002Fmecury_project\u002Fexample\u002Fflutter_auto_json_parsing)\n- [左滑删除ListView中Item](https:\u002F\u002Fgithub.com\u002FVadaski\u002FFlutter-Notebook\u002Fblob\u002Fmaster\u002Fmecury_project\u002Fexample\u002Fswipe_to_dismiss)\n- [右滑返回上一页](https:\u002F\u002Fgithub.com\u002FVadaski\u002FFlutter-Notebook\u002Ftree\u002Fmaster\u002Fmecury_project\u002Fexample\u002Fright_back_demo)\n- [在flutter中截屏](https:\u002F\u002Fgithub.com\u002FVadaski\u002FFlutter-Notebook\u002Ftree\u002Fmaster\u002Fmecury_project\u002Fexample\u002Fwidget_to_image)\n- [轻量级操作提示控件toolstip](https:\u002F\u002Fgithub.com\u002FOpenFlutter\u002FFlutter-Notebook\u002Fblob\u002Fmaster\u002Fmecury_project\u002Fexample\u002Ftool_tips_demo)\n- [可拖动组件draggable](https:\u002F\u002Fgithub.com\u002FOpenFlutter\u002FFlutter-Notebook\u002Fblob\u002Fmaster\u002Fmecury_project\u002Fexample\u002Fdraggable_demo\u002F)\n- [去掉点击事件的水波纹效果](https:\u002F\u002Fgithub.com\u002FOpenFlutter\u002FFlutter-Notebook\u002Ftree\u002Fmaster\u002Fmecury_project\u002Fexample\u002Fwithout_splash_color)\n- [在当前页面上覆盖新的组件overlay](https:\u002F\u002Fgithub.com\u002FOpenFlutter\u002FFlutter-Notebook\u002Ftree\u002Fmaster\u002Fmecury_project\u002Fexample\u002Foverlay)\n- [在不同页面传递事件EventBus](https:\u002F\u002Fgithub.com\u002FOpenFlutter\u002FFlutter-Notebook\u002Ftree\u002Fmaster\u002Fmecury_project\u002Fexample\u002Fevent_bus_demo)\n- [自定义 Navigator](https:\u002F\u002Fgithub.com\u002FOpenFlutter\u002FFlutter-Notebook\u002Ftree\u002Fmaster\u002Fmecury_project\u002Fexample\u002Fnavigator_example)\n\n\n#### 动画\n- [基本动画样例](https:\u002F\u002Fgithub.com\u002FVadaski\u002FVadaski-flutter_note_book\u002Ftree\u002Fmaster\u002Fmecury_project\u002Fexample\u002Fanimation_demo)\n- [神奇的Hero动画](https:\u002F\u002Fgithub.com\u002FVadaski\u002FVadaski-flutter_note_book\u002Ftree\u002Fmaster\u002Fmecury_project\u002Fexample\u002Fhero_demo)\n- [AnimatedContainer](https:\u002F\u002Fgithub.com\u002FOpenFlutter\u002FFlutter-Notebook\u002Ftree\u002Fmaster\u002Fmecury_project\u002Fexample\u002Fanimated_container)\n- [AnimatedCrossFade](https:\u002F\u002Fgithub.com\u002FOpenFlutter\u002FFlutter-Notebook\u002Ftree\u002Fmaster\u002Fmecury_project\u002Fexample\u002Fanimated_cross_fade)\n- [Ripple路由转换动画](https:\u002F\u002Fgithub.com\u002FOpenFlutter\u002FFlutter-Notebook\u002Ftree\u002Fmaster\u002Fmecury_project\u002Fexample\u002Fripple_animation)\n\n### 优秀第三方库\n- [Awesome Flutter Packages](https:\u002F\u002Fgithub.com\u002Fleisim\u002Fawesome-flutter-packages)\n- [图表库——google charts📈](https:\u002F\u002Fgithub.com\u002Fgoogle\u002Fcharts)\n- [闲鱼混合栈管理框架——flutter_boost](https:\u002F\u002Fgithub.com\u002Falibaba\u002Fflutter_boost)\n- [哈啰出行重磅开源混合栈方案——「thrio」](https:\u002F\u002Fgithub.com\u002Fhellobike\u002Fthrio)\n- [Agora RTC SDKs 音视频通话](https:\u002F\u002Fgithub.com\u002FAgoraIO\u002FFlutter-SDK)\n- [应用介绍页——slider](https:\u002F\u002Fgithub.com\u002FVadaski\u002FVadaski-flutter_note_book\u002Ftree\u002Fmaster\u002Fmecury_project\u002Fexample\u002Fslider_screen)\n- [应用介绍页——intro_view](https:\u002F\u002Fgithub.com\u002FOpenFlutter\u002FFlutter-Notebook\u002Ftree\u002Fmaster\u002Fmecury_project\u002Fexample\u002Fintro_views)\n- [从本地相册选取多张图片](https:\u002F\u002Fgithub.com\u002FVadaski\u002FFlutter-Notebook\u002Fblob\u002Fmaster\u002Fmecury_project\u002Fexample\u002Fload_multi_image)\n- [使用url_launcher唤醒功能](https:\u002F\u002Fgithub.com\u002FVadaski\u002FVadaski-flutter_note_book\u002Ftree\u002Fmaster\u002Fmecury_project\u002Fexample\u002Furl_launcher_demo)\n- [拿捏图片放大缩小](https:\u002F\u002Fgithub.com\u002FOpenFlutter\u002FFlutter-Notebook\u002Ftree\u002Fmaster\u002Fmecury_project\u002Fexample\u002Fpinch_zoom_image_demo)\n- [一个很棒的等待动画库——Spinkit](https:\u002F\u002Fgithub.com\u002FOpenFlutter\u002FFlutter-Notebook\u002Ftree\u002Fmaster\u002Fmecury_project\u002Fexample\u002Fspinkit_animation)\n\n\n### 状态管理\n- [Scoped_Model](https:\u002F\u002Fgithub.com\u002FVadaski\u002FVadaski-flutter_note_book\u002Ftree\u002Fmaster\u002Fmecury_project\u002Fexample\u002Fscoped_demo)\n- [Redux](https:\u002F\u002Fgithub.com\u002FVadaski\u002FFlutter-Notebook\u002Ftree\u002Fmaster\u002Fmecury_project\u002Fexample\u002Fredux_demo)\n- [BLoC](https:\u002F\u002Fgithub.com\u002FOpenFlutter\u002FFlutter-Notebook\u002Ftree\u002Fmaster\u002Fmecury_project\u002Fexample\u002Fbloc_demo)\n- [BLoC Provider模式](https:\u002F\u002Fgithub.com\u002FOpenFlutter\u002FFlutter-Notebook\u002Ftree\u002Fmaster\u002Fmecury_project\u002Fexample\u002Fbloc_provider_pattern) \n- [Google-Provide](https:\u002F\u002Fgithub.com\u002FOpenFlutter\u002FFlutter-Notebook\u002Ftree\u002Fmaster\u002Fmecury_project\u002Fexample\u002Fflutter_provide)\n- [fish-redux](https:\u002F\u002Fgithub.com\u002Falibaba\u002Ffish-redux)\n- [Provider](https:\u002F\u002Fgithub.com\u002FOpenFlutter\u002FFlutter-Notebook\u002Fblob\u002Fmaster\u002Fmecury_project\u002Fexample\u002Fprovider_example)\n\n### 其他\n- [flutter-widget-livebook 实时查看各种 widget](https:\u002F\u002Fflutter-widget-livebook.blankapp.org\u002Fbasics\u002Fintroduction\u002F)\n- [flutter 菜鸟 APP，包含常用 flutter 组件的中文文档与 demo 演示](https:\u002F\u002Fgithub.com\u002Falibaba\u002Fflutter-common-widgets-app)\n- [flutter widget of the week 每周介绍一个widget，轻松学习flutter](https:\u002F\u002Fgithub.com\u002FOpenFlutter\u002FFlutter-Notebook\u002Ftree\u002Fmaster\u002Fmecury_project\u002Fexample\u002Fflutter_widget_of_the_week)\n- [GDD2018最新Flutter preview2 widget体验](https:\u002F\u002Fgithub.com\u002FVadaski\u002FFlutter-Notebook\u002Ftree\u002Fmaster\u002Fmecury_project\u002Fexample\u002Frelease_preview2)\n- [Flutter Challenge](https:\u002F\u002Fgithub.com\u002FOpenFlutter\u002FFlutter-Notebook\u002Ftree\u002Fmaster\u002Fmecury_project\u002Fexample\u002Fanimation_challenge)【持续更新中】\n- [一个漂亮的flutter组件库](https:\u002F\u002Fgithub.com\u002Fsamarthagarwal\u002FFlutterScreens)\n- [使用flutter实现超过100个精美的ui页面](https:\u002F\u002Fgithub.com\u002Fnb312\u002Fflutter-ui-nice)\n- [flutter应用收集 MADE BY THE FLUTTER社区](https:\u002F\u002Fitsallwidgets.com\u002F)\n- [HistoryOfEverything ———— flutter live上展示的精美应用现已开源](https:\u002F\u002Fgithub.com\u002F2d-inc\u002FHistoryOfEverything)\n- [WestlifeUsingFlutter西城男孩的 FlutterDemoApp](https:\u002F\u002Fgithub.com\u002Frenjingkai\u002FWestlifeUsingFlutter)\n\n### 书\n- [Flutter in Action](https:\u002F\u002Fgithub.com\u002Fflutterchina\u002Fflutter-in-action)\n\n### 常见问题\n- [什么时候我应该使用 Key ](https:\u002F\u002Fjuejin.im\u002Fpost\u002F5ca2152f6fb9a05e1a7a9a26)\n- [什么是 BuildContext](https:\u002F\u002Fjuejin.im\u002Fpost\u002F5c665cb651882562914ec153) \n\n所有demo都最简化，尽量保证只与当前功能有关。每个demo文件代码在100行左右，十分适合新手阅读。\n#### 更多请进入mecury_project\u002Fexample中寻找。\n## [我的掘金主页](https:\u002F\u002Fjuejin.im\u002Fuser\u002F5b5d45f4e51d453526175c06\u002Fposts)\n","Flutter-Notebook 是一个集合了多种 Flutter 功能示例的项目，旨在帮助开发者快速学习和掌握 Flutter 开发技巧。该项目使用 Dart 语言编写，包含了一系列官方控件和功能的演示代码，如底部导航、自定义路由样式、高斯模糊效果等。每个示例都提供了详细的实现方法，并且支持通过 DownGit 单独下载。Flutter-Notebook 适用于需要快速查找和参考 Flutter 实现方案的场景，无论是初学者还是有经验的开发者都能从中受益。此外，项目鼓励社区贡献，欢迎提交更好的实现方式或创意。",2,"2026-06-11 03:21:17","top_language"]