{"id":13550309,"url":"https://github.com/CarGuo/gsy_flutter_demo","last_synced_at":"2025-04-03T00:33:34.279Z","repository":{"id":41384268,"uuid":"193328496","full_name":"CarGuo/gsy_flutter_demo","owner":"CarGuo","description":"Flutter 不同于 GSYGithubAppFlutter 完整项目，本项目将逐步完善各种 Flutter 独立例子，方便新手学习上手和小问题方案解决。  目前开始逐步补全完善，主要提供一些有用或者有趣的例子，如果你也有好例子，欢迎提交 PR 。","archived":false,"fork":false,"pushed_at":"2025-03-23T05:35:18.000Z","size":5463,"stargazers_count":3209,"open_issues_count":6,"forks_count":509,"subscribers_count":53,"default_branch":"master","last_synced_at":"2025-03-26T14:54:19.237Z","etag":null,"topics":["flutter","flutter-demo","flutter-examples","flutter-plugin","flutter-ui","flutter-widget"],"latest_commit_sha":null,"homepage":"https://juejin.im/user/582aca2ba22b9d006b59ae68/posts","language":"Dart","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/CarGuo.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":".github/FUNDING.yml","license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null},"funding":{"custom":"http://img.cdn.guoshuyu.cn/thanks.jpg"}},"created_at":"2019-06-23T09:18:40.000Z","updated_at":"2025-03-26T06:07:23.000Z","dependencies_parsed_at":"2023-02-15T15:01:47.447Z","dependency_job_id":"d6e5c052-e916-48ff-bd0e-eb18b31d5fe0","html_url":"https://github.com/CarGuo/gsy_flutter_demo","commit_stats":{"total_commits":311,"total_committers":4,"mean_commits":77.75,"dds":0.009646302250803873,"last_synced_commit":"23c939b06a744e305468c362919074064380c72e"},"previous_names":["carguo/gsyflutterdemo"],"tags_count":2,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/CarGuo%2Fgsy_flutter_demo","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/CarGuo%2Fgsy_flutter_demo/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/CarGuo%2Fgsy_flutter_demo/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/CarGuo%2Fgsy_flutter_demo/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/CarGuo","download_url":"https://codeload.github.com/CarGuo/gsy_flutter_demo/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":246916733,"owners_count":20854511,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["flutter","flutter-demo","flutter-examples","flutter-plugin","flutter-ui","flutter-widget"],"created_at":"2024-08-01T12:01:31.456Z","updated_at":"2025-04-03T00:33:34.261Z","avatar_url":"https://github.com/CarGuo.png","language":"Dart","funding_links":["http://img.cdn.guoshuyu.cn/thanks.jpg"],"categories":["Dart","开源项目"],"sub_categories":[],"readme":"# GSY Flutter Demo\n\n\n### 不同于 [GSYGithubAppFlutter](https://github.com/CarGuo/GSYGithubAppFlutter) 项目，本项目将逐步完善各种 Flutter 独立例子，方便新手学习上手。\n\n[![Github Actions](https://github.com/CarGuo/gsy_flutter_demo/workflows/CI/badge.svg)](https://github.com/CarGuo/gsy_flutter_demo/actions)\n\n\n\n## 相关文章\n\n- ## [Flutter系列文章专栏](https://juejin.cn/column/6960546078202527774)\n\n----\n- ## [Flutter 独立简单学习演示项目](https://github.com/CarGuo/gsy_flutter_demo)\n- ## [Flutter 完整开发实战详解 Gitbook 预览下载](https://github.com/CarGuo/gsy_flutter_book)\n- ## [所有运行问题请点击这里](https://github.com/CarGuo/gsy_github_app_flutter/issues/13)\n\n\n### [Web 版在线测试](https://guoshuyu.cn/home/web/#/)\n### [APK 下载](https://github.com/CarGuo/gsy_flutter_demo/releases)\n\n\u003e 目前开始逐步补全完善，主要提供一些有用或者有趣的例子，如果你也有好例子，欢迎提交 PR 。\n\u003e\n\u003e **运行须知：配置好Flutter开发环境(目前Flutter SDK 版本 *3.29* 以上版本)。**\n\u003e\n\u003e **[如果克隆太慢或者图片看不到，可尝试从码云地址下载](https://gitee.com/CarGuo/GSYFlutterDemo)**\n\n| 公众号   | 掘金     |  知乎    |  CSDN   |   简书   \n|---------|---------|--------- |---------|---------|\n| GSYTech  |  [点我](https://juejin.im/user/582aca2ba22b9d006b59ae68/posts)    |   [点我](https://www.zhihu.com/people/carguo)       |   [点我](https://blog.csdn.net/ZuoYueLiang)  |   [点我](https://www.jianshu.com/u/6e613846e1ea)  \n\n### GSY新书：[《Flutter开发实战详解》](https://item.jd.com/12883054.html)上架啦：[京东](https://item.jd.com/12883054.html) / [当当](http://product.dangdang.com/28558519.html) / 电子版[京东读书](https://e.jd.com/30624414.html)和[Kindle](https://www.amazon.cn/dp/B08BHQ4TKK/ref=sr_1_5?__mk_zh_CN=亚马逊网站\u0026keywords=flutter\u0026qid=1593498531\u0026s=digital-text\u0026sr=1-5)\n\n[![](http://img.cdn.guoshuyu.cn/WechatIMG65.jpeg)](https://item.jd.com/12883054.html)\n\n![公众号](http://img.cdn.guoshuyu.cn/wechat_qq.png)\n\n![](demo.jpg)\n\n### 已有例子\n\n```dart\n\nMap\u003cString, WidgetBuilder\u003e routers = {\n  \"文本输入框简单的 Controller\": (context) {\n    return ContainerAsyncRouterPage(controller_demo_page.loadLibrary(),\n            (context) {\n          return controller_demo_page.ControllerDemoPage();\n        });\n  },\n  \"实现控件圆角不同组合\": (context) {\n    return ContainerAsyncRouterPage(clip_demo_page.loadLibrary(), (context) {\n      return clip_demo_page.ClipDemoPage();\n    });\n  },\n  \"列表滑动监听\": (context) {\n    return ContainerAsyncRouterPage(scroll_listener_demo_page.loadLibrary(),\n            (context) {\n          return scroll_listener_demo_page.ScrollListenerDemoPage();\n        });\n  },\n  \"滑动到指定位置\": (context) {\n    return ContainerAsyncRouterPage(scroll_to_index_demo_page.loadLibrary(),\n            (context) {\n          return scroll_to_index_demo_page.ScrollToIndexDemoPage();\n        });\n  },\n  \"滑动到指定位置2\": (context) {\n    return ContainerAsyncRouterPage(scroll_to_index_demo_page2.loadLibrary(),\n            (context) {\n          return scroll_to_index_demo_page2.ScrollToIndexDemoPage2();\n        });\n  },\n  \"展示渐变带边框的文本\": (context) {\n    return ContainerAsyncRouterPage(gradient_text_demo_page.loadLibrary(),\n            (context) {\n          return gradient_text_demo_page.GradientTextDemoPage();\n        });\n  },\n  \"Transform 效果展示\": (context) {\n    return ContainerAsyncRouterPage(transform_demo_page.loadLibrary(),\n            (context) {\n          return transform_demo_page.TransformDemoPage();\n        });\n  },\n  \"计算另类文本行间距展示\": (context) {\n    return ContainerAsyncRouterPage(text_line_height_demo_page.loadLibrary(),\n            (context) {\n          return text_line_height_demo_page.TextLineHeightDemoPage();\n        });\n  },\n  \"简单上下刷新\": (context) {\n    return ContainerAsyncRouterPage(refrsh_demo_page.loadLibrary(), (context) {\n      return refrsh_demo_page.RefreshDemoPage();\n    });\n  },\n  \"简单上下刷新2\": (context) {\n    return ContainerAsyncRouterPage(refrsh_demo_page2.loadLibrary(), (context) {\n      return refrsh_demo_page2.RefreshDemoPage2();\n    });\n  },\n  \"简单上下刷新3\": (context) {\n    return ContainerAsyncRouterPage(refrsh_demo_page3.loadLibrary(), (context) {\n      return refrsh_demo_page3.RefreshDemoPage3();\n    });\n  },\n  \"通过绝对定位布局\": (context) {\n    return ContainerAsyncRouterPage(positioned_demo_page.loadLibrary(),\n            (context) {\n          return positioned_demo_page.PositionedDemoPage();\n        });\n  },\n  \"气泡提示框\": (context) {\n    return ContainerAsyncRouterPage(bubble_demo_page.loadLibrary(), (context) {\n      return bubble_demo_page.BubbleDemoPage();\n    });\n  },\n  \"Tag效果展示\": (context) {\n    return ContainerAsyncRouterPage(tag_demo_page.loadLibrary(), (context) {\n      return tag_demo_page.TagDemoPage();\n    });\n  },\n  \"共享元素跳转效果\": (context) {\n    return ContainerAsyncRouterPage(honor_demo_page.loadLibrary(), (context) {\n      return honor_demo_page.HonorDemoPage();\n    });\n  },\n  \"滑动验证\": (context) {\n    return ContainerAsyncRouterPage(silder_verify_page.loadLibrary(),\n            (context) {\n          return silder_verify_page.SlideVerifyPage();\n        });\n  },\n  \"warpContent实现\": (context) {\n    return ContainerAsyncRouterPage(wrap_content_page.loadLibrary(), (context) {\n      return wrap_content_page.WrapContentPage();\n    });\n  },\n  \"状态栏颜色修改（仅 App）\": (context) {\n    return ContainerAsyncRouterPage(statusbar_demo_page.loadLibrary(),\n            (context) {\n          return statusbar_demo_page.StatusBarDemoPage();\n        });\n  },\n  \"键盘弹出与监听（仅 App）\": (context) {\n    return ContainerAsyncRouterPage(keyboard_demo_page.loadLibrary(),\n            (context) {\n          return keyboard_demo_page.KeyBoardDemoPage();\n        });\n  },\n  \"控件动画组合展示（旋转加放大圆）\": (context) {\n    return ContainerAsyncRouterPage(anima_demo_page.loadLibrary(), (context) {\n      return anima_demo_page.AnimaDemoPage();\n    });\n  },\n  \"控件展开动画效果\": (context) {\n    return ContainerAsyncRouterPage(anima_demo_page2.loadLibrary(), (context) {\n      return anima_demo_page2.AnimaDemoPage2();\n    });\n  },\n  \"全局悬浮按键效果\": (context) {\n    return ContainerAsyncRouterPage(floating_touch_demo_page.loadLibrary(),\n            (context) {\n          return floating_touch_demo_page.FloatingTouchDemoPage();\n        });\n  },\n  \"全局设置字体大小\": (context) {\n    return ContainerAsyncRouterPage(text_size_demo_page.loadLibrary(),\n            (context) {\n          return text_size_demo_page.TextSizeDemoPage();\n        });\n  },\n  \"旧版实现富文本\": (context) {\n    return ContainerAsyncRouterPage(rich_text_demo_page.loadLibrary(),\n            (context) {\n          return rich_text_demo_page.RichTextDemoPage();\n        });\n  },\n  \"官方实现富文本\": (context) {\n    return ContainerAsyncRouterPage(rich_text_demo_page2.loadLibrary(),\n            (context) {\n          return rich_text_demo_page2.RichTextDemoPage2();\n        });\n  },\n  \"第三方 viewpager 封装实现\": (context) {\n    return ContainerAsyncRouterPage(viewpager_demo_page.loadLibrary(),\n            (context) {\n          return viewpager_demo_page.ViewPagerDemoPage();\n        });\n  },\n  \"列表滑动过程控件停靠效果\": (context) {\n    return ContainerAsyncRouterPage(sliver_list_demo_page.loadLibrary(),\n            (context) {\n          return sliver_list_demo_page.SliverListDemoPage();\n        });\n  },\n  \"验证码输入框\": (context) {\n    return ContainerAsyncRouterPage(\n        verification_code_input_demo_page.loadLibrary(), (context) {\n      return verification_code_input_demo_page.VerificationCodeInputDemoPage();\n    });\n  },\n  \"验证码输入框2\": (context) {\n    return ContainerAsyncRouterPage(\n        verification_code_input_demo_page2.loadLibrary(), (context) {\n      return verification_code_input_demo_page2\n          .VerificationCodeInputDemoPage2();\n    });\n  },\n  \"自定义布局展示效果\": (context) {\n    return ContainerAsyncRouterPage(custom_multi_render_demo_page.loadLibrary(),\n            (context) {\n          return custom_multi_render_demo_page.CustomMultiRenderDemoPage();\n        });\n  },\n  \"自定义布局实现云词图展示\": (context) {\n    return ContainerAsyncRouterPage(cloud_demo_page.loadLibrary(), (context) {\n      return cloud_demo_page.CloudDemoPage();\n    });\n  },\n  \"列表滑动停靠 （Stick）\": (context) {\n    return ContainerAsyncRouterPage(stick_demo_page.loadLibrary(), (context) {\n      return stick_demo_page.StickDemoPage();\n    });\n  },\n  \"列表滑动停靠 （Stick）+ 展开收回\": (context) {\n    return ContainerAsyncRouterPage(stick_demo_page2.loadLibrary(), (context) {\n      return stick_demo_page2.StickExpendDemoPage();\n    });\n  },\n  \"列表滑动停靠效果2 （Stick\": (context) {\n    return ContainerAsyncRouterPage(sliver_stick_demo_page.loadLibrary(),\n            (context) {\n          return sliver_stick_demo_page.SliverStickListDemoPage();\n        });\n  },\n  \"键盘顶起展示（仅 App）\": (context) {\n    return ContainerAsyncRouterPage(input_bottom_demo_page.loadLibrary(),\n            (context) {\n          return input_bottom_demo_page.InputBottomDemoPage();\n        });\n  },\n  \"Blur 高斯模糊效果\": (context) {\n    return ContainerAsyncRouterPage(blur_demo_page.loadLibrary(), (context) {\n      return blur_demo_page.BlurDemoPage();\n    });\n  },\n  \"控件动画变形效果\": (context) {\n    return ContainerAsyncRouterPage(animation_container_demo_page.loadLibrary(),\n            (context) {\n          return animation_container_demo_page.AnimationContainerDemoPage();\n        });\n  },\n  \"时钟动画绘制展示\": (context) {\n    return ContainerAsyncRouterPage(tick_click_demo_page.loadLibrary(),\n            (context) {\n          return tick_click_demo_page.TickClickDemoPage();\n        });\n  },\n  \"按键切换动画效果\": (context) {\n    return ContainerAsyncRouterPage(anima_demo_page4.loadLibrary(), (context) {\n      return anima_demo_page4.AnimaDemoPage4();\n    });\n  },\n  \"列表滑动过程 item 停靠动画效果\": (context) {\n    return ContainerAsyncRouterPage(list_anim_demo_page.loadLibrary(),\n            (context) {\n          return list_anim_demo_page.ListAnimDemoPage();\n        });\n  },\n  \"列表滑动过程 item 停靠动画效果2\": (context) {\n    return ContainerAsyncRouterPage(list_anim_demo_page2.loadLibrary(),\n            (context) {\n          return list_anim_demo_page2.ListAnimDemoPage2();\n        });\n  },\n  \"下弹筛选展示效果\": (context) {\n    return ContainerAsyncRouterPage(drop_select_demo_page.loadLibrary(),\n            (context) {\n          return drop_select_demo_page.DropSelectDemoPage();\n        });\n  },\n  \"文本弹出动画效果\": (context) {\n    return ContainerAsyncRouterPage(anima_demo_page5.loadLibrary(), (context) {\n      return anima_demo_page5.AnimaDemoPage5();\n    });\n  },\n  \"强大的自定义滑动与停靠结合展示\": (context) {\n    return ContainerAsyncRouterPage(scroll_header_demo_page.loadLibrary(),\n            (context) {\n          return scroll_header_demo_page.ScrollHeaderDemoPage();\n        });\n  },\n  \"自定义列表内sliver渲染顺序\": (context) {\n    return ContainerAsyncRouterPage(custom_viewport_page.loadLibrary(),\n            (context) {\n          return custom_viewport_page.CustomViewportPage();\n        });\n  },\n  \"点击弹出动画提示\": (context) {\n    return ContainerAsyncRouterPage(anim_tip_demo_page.loadLibrary(),\n            (context) {\n          return anim_tip_demo_page.AnimTipDemoPage();\n        });\n  },\n  \"列表停靠展开+回到当前头部\": (context) {\n    return ContainerAsyncRouterPage(stick_sliver_list_demo_page.loadLibrary(),\n            (context) {\n          return stick_sliver_list_demo_page.StickSliverListDemoPage();\n        });\n  },\n  \"使用 overflow 处理图片\": (context) {\n    return ContainerAsyncRouterPage(overflow_image_page.loadLibrary(),\n            (context) {\n          return overflow_image_page.OverflowImagePage();\n        });\n  },\n  \"展示 Align 排布控件\": (context) {\n    return ContainerAsyncRouterPage(align_demo_page.loadLibrary(), (context) {\n      return align_demo_page.AlignDemoPage();\n    });\n  },\n  \"通过不同尺寸计算方式展示比例\": (context) {\n    return ContainerAsyncRouterPage(card_item_page.loadLibrary(), (context) {\n      return card_item_page.CardItemPage();\n    });\n  },\n  \"多列表+顶部Tab效果展示\": (context) {\n    return ContainerAsyncRouterPage(sliver_tab_demo_page.loadLibrary(),\n            (context) {\n          return sliver_tab_demo_page.SliverTabDemoPage();\n        });\n  },\n  \"多列表+顶部Tab效果展示2\": (context) {\n    return ContainerAsyncRouterPage(sliver_tab_demo_page2.loadLibrary(),\n            (context) {\n          return sliver_tab_demo_page2.SliverTabDemoPage2();\n        });\n  },\n  \"多列表+顶部Tab效果展示3\": (context) {\n    return ContainerAsyncRouterPage(sliver_tab_demo_page3.loadLibrary(),\n            (context) {\n          return sliver_tab_demo_page3.SliverTabDemoPage3();\n        });\n  },\n  \"仿真书本翻页动画（仅APP）\": (context) {\n    return ContainerAsyncRouterPage(book_page.loadLibrary(), (context) {\n      return book_page.BookPage();\n    });\n  },\n  \"粒子动画效果\": (context) {\n    return ContainerAsyncRouterPage(particle_page.loadLibrary(), (context) {\n      return particle_page.ParticlePage();\n    });\n  },\n  \"动画背景效果\": (context) {\n    return ContainerAsyncRouterPage(anim_bg_demo_page.loadLibrary(), (context) {\n      return anim_bg_demo_page.AnimBgDemoPage();\n    });\n  },\n  \"手势效果\": (context) {\n    return ContainerAsyncRouterPage(matrix_custom_painter_page.loadLibrary(),\n            (context) {\n          return matrix_custom_painter_page.MatrixCustomPainterDemo();\n        });\n  },\n  \"一个有趣的底部跟随和停靠例子\": (context) {\n    return ContainerAsyncRouterPage(\n        scroll_inner_content_demo_page.loadLibrary(), (context) {\n      return scroll_inner_content_demo_page.ScrollInnerContentDemoPage();\n    });\n  },\n  \"一个有趣的圆形选择器\": (context) {\n    return ContainerAsyncRouterPage(bottom_anim_nav_page.loadLibrary(),\n            (context) {\n          return bottom_anim_nav_page.BottomAnimNavPage();\n        });\n  },\n  \"一个类似探探堆叠卡片例子\": (context) {\n    return ContainerAsyncRouterPage(\n        index_stack_drag_card_demo_page.loadLibrary(), (context) {\n      return index_stack_drag_card_demo_page.IndexStackDragCardDemoPage();\n    });\n  },\n  \"一个类似探探堆叠卡片例子2\": (context) {\n    return ContainerAsyncRouterPage(\n        index_stack_drag_card_demo_page2.loadLibrary(), (context) {\n      return index_stack_drag_card_demo_page2.IndexStackDragCardDemoPage2();\n    });\n  },\n  \"动画按键例子\": (context) {\n    return ContainerAsyncRouterPage(anim_button_demo_page.loadLibrary(),\n            (context) {\n          return anim_button_demo_page.AnimButtonDemoPage();\n        });\n  },\n  \"类似QQ发送图片的动画\": (context) {\n    return ContainerAsyncRouterPage(anim_progress_img_demo_page.loadLibrary(),\n            (context) {\n          return anim_progress_img_demo_page.AnimProgressImgDemoPage();\n        });\n  },\n  \"类似探探扫描的动画效果\": (context) {\n    return ContainerAsyncRouterPage(anim_scan_demo_page.loadLibrary(),\n            (context) {\n          return anim_scan_demo_page.AnimScanDemoPage();\n        });\n  },\n  \"圆弧形的 SeekBar（仅APP）\": (context) {\n    return ContainerAsyncRouterPage(arc_seek_bar_demo_page.loadLibrary(),\n            (context) {\n          return arc_seek_bar_demo_page.ArcSeekBarDemoPage();\n        });\n  },\n  \"一个国外友人很惊艳的动画效果\": (context) {\n    return ContainerAsyncRouterPage(anim_bubble_gum.loadLibrary(), (context) {\n      return anim_bubble_gum.AnimBubbleGumDemoPage();\n    });\n  },\n  \"纯 Canvas 绘制闹钟\": (context) {\n    return ContainerAsyncRouterPage(canvas_click_demo_page.loadLibrary(),\n            (context) {\n          return canvas_click_demo_page.CanvasClickDemoPage();\n        });\n  },\n  \"类似 boss 直聘我的页面联动效果\": (context) {\n    return ContainerAsyncRouterPage(link_sliver_demo_page.loadLibrary(),\n            (context) {\n          return link_sliver_demo_page.LinkSliverDemoPage();\n        });\n  },\n  \"结合 Matrix 的拖拽\": (context) {\n    return ContainerAsyncRouterPage(drag_img_demo_page.loadLibrary(),\n            (context) {\n          return drag_img_demo_page.DragImgDemoPage();\n        });\n  },\n  \"彩色进度条\": (context) {\n    return ContainerAsyncRouterPage(color_progress_demo_page.loadLibrary(),\n            (context) {\n          return color_progress_demo_page.ColorProgressDemoPage();\n        });\n  },\n  \"第三方的动画字体\": (context) {\n    return ContainerAsyncRouterPage(anim_text_demo_page.loadLibrary(),\n            (context) {\n          return anim_text_demo_page.AnimTextDemoPage();\n        });\n  },\n  \"首尾添加数据不会抖动\": (context) {\n    return ContainerAsyncRouterPage(chat_list_scroll_demo_page.loadLibrary(),\n            (context) {\n          return chat_list_scroll_demo_page.ChatListScrollDemoPage();\n        });\n  },\n  \"首尾添加数据不会抖动2\": (context) {\n    return ContainerAsyncRouterPage(chat_list_scroll_demo_page_2.loadLibrary(),\n            (context) {\n          return chat_list_scroll_demo_page_2.ChatListScrollDemoPage2();\n        });\n  },\n  \"测试路由嵌套\": (context) {\n    return ContainerAsyncRouterPage(route_demo_page.loadLibrary(), (context) {\n      return route_demo_page.RouteDemoPage();\n    });\n  },\n  \"测试 canvas 阴影\": (context) {\n    return ContainerAsyncRouterPage(shader_canvas_demo_page.loadLibrary(),\n            (context) {\n          return shader_canvas_demo_page.ShaderCanvasDemoPage();\n        });\n  },\n  \"控件动画切换效果\": (context) {\n    ///对应文章解析  https://juejin.cn/post/7111071430292275213\n    return ContainerAsyncRouterPage(anim_switch_layout_demo_page.loadLibrary(),\n            (context) {\n          return anim_switch_layout_demo_page.AnimSwitchLayoutDemoPage();\n        });\n  },\n  \"ListView 嵌套 ViewPager 解决斜着滑动问题\": (context) {\n    ///对应文章解析 https://juejin.cn/post/7116267156655833102\n    return ContainerAsyncRouterPage(vp_list_demo_page.loadLibrary(), (context) {\n      return vp_list_demo_page.VPListView();\n    });\n  },\n  \"垂直  ViewPager 嵌套垂直 ListView \": (context) {\n    ///对应文章解析 https://juejin.cn/post/7116267156655833102\n    return ContainerAsyncRouterPage(vp_list_demo_page.loadLibrary(), (context) {\n      return vp_list_demo_page.VPNestListView();\n    });\n  },\n  \"垂直  ListView 嵌套垂直  ViewPager\": (context) {\n    ///对应文章解析 https://juejin.cn/post/7116267156655833102\n    return ContainerAsyncRouterPage(vp_list_demo_page.loadLibrary(), (context) {\n      return vp_list_demo_page.ListViewNestVP();\n    });\n  },\n  \"垂直  ListView 联动  ListView\": (context) {\n    ///对应文章解析 https://juejin.cn/post/7116267156655833102\n    return ContainerAsyncRouterPage(vp_list_demo_page.loadLibrary(), (context) {\n      return vp_list_demo_page.ListViewLinkListView();\n    });\n  },\n  \"3D 透视卡片\": (context) {\n    ///对应文章解析  https://juejin.cn/post/7124064789763981326\n    return ContainerAsyncRouterPage(card_perspective_demo_page.loadLibrary(),\n            (context) {\n          return card_perspective_demo_page.CardPerspectiveDemoPage();\n        });\n  },\n  \"3D 卡片旋转\": (context) {\n    ///对应文章解析  https://juejin.cn/post/7124064789763981326\n    return ContainerAsyncRouterPage(card_3d_demo_page.loadLibrary(), (context) {\n      return card_3d_demo_page.Card3DDemoPage();\n    });\n  },\n  \"硬核 3D 卡片旋转\": (context) {\n    ///对应文章解析 https://juejin.cn/post/7129239231473385503\n    return ContainerAsyncRouterPage(card_real_3d_demo_page.loadLibrary(),\n            (context) {\n          return card_real_3d_demo_page.CardReal3DDemoPage();\n        });\n  },\n  \"3D Dash\": (context) {\n    ///对应文章解析 https://juejin.cn/post/7129239231473385503\n    return ContainerAsyncRouterPage(dash_3d_demo_page.loadLibrary(), (context) {\n      return dash_3d_demo_page.Dash3dDemoPage();\n    });\n  },\n  \"展示 canvas transform\": (context) {\n    ///对应文章解析 https://juejin.cn/post/7129239231473385503\n    return ContainerAsyncRouterPage(transform_canvas_demo_page.loadLibrary(),\n            (context) {\n          return transform_canvas_demo_page.TransformCanvasDemoPage();\n        });\n  },\n  \"rive 掘金 logo\": (context) {\n    ///对应文章解析  https://juejin.cn/post/7126661045564735519\n    return ContainerAsyncRouterPage(anim_juejin_logo_demo_page.loadLibrary(),\n            (context) {\n          return anim_juejin_logo_demo_page.AnimJueJinLogoDemoPage();\n        });\n  },\n  \"掘金 3d logo\": (context) {\n    ///对应文章解析 https://juejin.cn/post/7129239231473385503\n    return ContainerAsyncRouterPage(juejin_3d_logo_demo_page.loadLibrary(),\n            (context) {\n          return juejin_3d_logo_demo_page.JueJin3DLogoDemoPage();\n        });\n  },\n  \"掘金更 3d logo\": (context) {\n    ///对应文章解析 https://juejin.cn/post/7129239231473385503\n    return ContainerAsyncRouterPage(juejin_3d_box_logo_demo_page.loadLibrary(),\n            (context) {\n          return juejin_3d_box_logo_demo_page.JueJin3DBoxLogoDemoPage();\n        });\n  },\n  \"png shadow\": (context) {\n    return ContainerAsyncRouterPage(png_shadow_demo_page.loadLibrary(),\n            (context) {\n          return png_shadow_demo_page.PngShadowDemoPage();\n        });\n  },\n  \"path 路径 png 效果\": (context) {\n    return ContainerAsyncRouterPage(custom_shader_path_demo_page.loadLibrary(),\n            (context) {\n          return custom_shader_path_demo_page.CustomShaderPathDemoPage();\n        });\n  },\n  \"列表联动 BottomSheet 效果\": (context) {\n    return ContainerAsyncRouterPage(\n        list_link_bottomsheet_demo_page.loadLibrary(), (context) {\n      return list_link_bottomsheet_demo_page.ListLinkBottomSheetDemoPage();\n    });\n  },\n  \"DraggableSheet 的 stick 效果\": (context) {\n    return ContainerAsyncRouterPage(\n        demo_draggable_sheet_stick_page.loadLibrary(), (context) {\n      return demo_draggable_sheet_stick_page.DemoDraggableSheetStickPage();\n    });\n  },\n  \"异步调用的顺序执行\": (context) {\n    return ContainerAsyncRouterPage(async_to_sync_call_page.loadLibrary(),\n            (context) {\n          return async_to_sync_call_page.AsyncToSyncCallPage();\n        });\n  },\n  \"点击爆炸的五角星（ChatGPT 生成代码）\": (context) {\n    return ContainerAsyncRouterPage(star_bomb_button_page.loadLibrary(),\n            (context) {\n          return star_bomb_button_page.StarBombButtonPage();\n        });\n  },\n  \"有趣画廊\": (context) {\n    return ContainerAsyncRouterPage(photo_gallery_demo_page.loadLibrary(),\n            (context) {\n          return photo_gallery_demo_page.PhotoGalleryDemoPage();\n        });\n  },\n  \"有趣的文本撕裂动画\": (context) {\n    return ContainerAsyncRouterPage(tear_text_demo_page.loadLibrary(),\n            (context) {\n          return tear_text_demo_page.TearTextDemoPage();\n        });\n  },\n  \"自适应横竖列表\": (context) {\n    return ContainerAsyncRouterPage(un_bounded_listview.loadLibrary(),\n            (context) {\n          return un_bounded_listview.UnboundedListViewDemoPage();\n        });\n  },\n  \"PageView嵌套PageView\": (context) {\n    return ContainerAsyncRouterPage(\n        pageview_in_pageview_demo_page.loadLibrary(), (context) {\n      return pageview_in_pageview_demo_page.PageViewInPageViewDemoPage();\n    });\n  },\n  \"手势密码\": (context) {\n    return ContainerAsyncRouterPage(gesture_password_demo_page.loadLibrary(),\n            (context) {\n          return gesture_password_demo_page.GesturePasswordDemoPage();\n        });\n  },\n};\n\n```\n\n\n\n### 指定web地址而不是 localhost 的运行命令\n\n```\nflutter run -d web-server --web-hostname 127.0.0.1 --web-port 8989\n\nflutter build web --web-renderer canvaskit 指定渲染模式\nflutter build web --release --web-renderer html \n\ncp -r ./build/app/intermediates/flutter/release/flutter_assets/ ./build/web/assets\n\n```\n\n### 相关文章\n\n- ### [各种最新 Flutter 文章](https://juejin.im/user/582aca2ba22b9d006b59ae68/posts)\n- ### [Flutter 完整实战实战系列文章专栏](http://mp.weixin.qq.com/mp/homepage?__biz=Mzg3NTA3MDIxOA==\u0026hid=2\u0026sn=679ad0212470f5155c4412e678411374\u0026scene=18#wechat_redirect)\n- ### [Flutter 番外的世界系列文章专栏](http://mp.weixin.qq.com/mp/homepage?__biz=Mzg3NTA3MDIxOA==\u0026hid=3\u0026sn=bf37119ae2b741a1c71125538bf0cd8d\u0026scene=18#wechat_redirect)\n\n\n----\n\n- ## [Flutter Github客户端](https://github.com/CarGuo/gsy_github_app_flutter) \n\n- ## [Flutter 完整开发实战详解 Gitbook 预览下载](https://github.com/CarGuo/GSYFlutterBook)\n\n\n![](http://img.cdn.guoshuyu.cn/thanks.jpg)\n\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2FCarGuo%2Fgsy_flutter_demo","html_url":"https://awesome.ecosyste.ms/projects/github.com%2FCarGuo%2Fgsy_flutter_demo","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2FCarGuo%2Fgsy_flutter_demo/lists"}