背景

从Flutter公布beta版本就始终在关注Flutter、很多大厂也都在应用Flutter比方字节跳动今日头条、西瓜视频、阿里爸爸的闲鱼、毒APP，包含咱们公司(一个卖菜的公司)也在局部非主流程页面应用Flutter。都说Flutter极其晦涩丑陋，本着再不学习就老了的心态，于是筹备抽些空闲工夫来尝试下Flutter。最近小端午放假APP的几个页面也搭建的差不多了，本着人人为我、我为人人的精力决定写个blog给大家分享一下。

为什么仿JD APP？

因为像JD这种电商APP无论是业务逻辑还是页面复杂度都是比较复杂的，一来能够体验一下Flutter在简单页面晦涩度的体现，二来也能够看下到底Flutter是否能真正投入生产环境中。

首页

性能	计划
搜寻滚动吸顶	SliverAppBar + FlexibleSpaceBar
Banner轮播	flutter_swiper
货架	PageView+GridView
举荐列表	flutter_swiper

分类

性能	计划
banner	flutter_swipper
扫一扫	barcode_scan

购物车

性能	计划
商品抉择
倒计时	Timer.periodic
商品数量增减	自定义组件

我的

性能	计划
header滚动突变	监听滚动地位设置Appbar opacity
其它	页面成果还原

商详

I love China, love huawei

性能	计划	备注
header滚动突变		无
商品轮播图	flutter_swiper	无
地址抉择	city_pickers	无
规格抉择	showCupertinoModalPopup	无
商品详情图	webview_flutter	TODO Android 超过5500高度会黑屏解体须要期待网页加载完结获取网页高度后从新设置webview高度否则会内存溢出

设置

注册登录

性能	计划	备注
登录注册	leancloud	注册登录图省事，整了一个页面（点注册按钮即应用以后输出的用户名明码注册）
账密	账号 admin 明码 admin	无

GIT仓库地址

APP端：

https://github.com/DiscoverForever/learn_flutter

Server端：

https://github.com/DiscoverForever/flutter_mock_server

????欢送PR 感觉不错的能够给个star✨

我的项目目录构造

# 我的项目应用第三方库一览

name: learn_flutterdescription: A new Flutter project.version: 1.0.0+1environment:  sdk: ">=2.2.2 <3.0.0"dependencies:  flutter:    sdk: flutter  cupertino_icons: ^0.1.2  # 轮播插件  flutter_swiper: ^1.1.6  # toast  fluttertoast: ^4.0.1  # 网络申请  dio: ^3.0.8  # webview  # flutter_webview_plugin: ^0.3.5  # webview  webview_flutter: ^0.3.19  json_annotation: ^3.0.0  # 城市选择器  city_pickers: ^0.1.30  # 扫描插件  barcode_scan: ^2.0.1  # Leancloud  leancloud_storage: ^0.2.3  # 官网缓存插件  shared_preferences: ^0.5.6  # provide  provide: ^1.0.2dev_dependencies:  flutter_test:    sdk: flutter  # json generator  build_runner: ^1.0.0  json_serializable: ^3.3.0  uses-material-design: true  assets:    - lib/assets/json/movie.json   fonts:  - family: FlamanteRoma    fonts:    - asset: lib/assets/fonts/Flamante-Roma-Medium.ttf    - asset: lib/assets/fonts/Flamante-Roma-MediumItalic.ttf  - family: LatoBold    fonts:    - asset: lib/assets/fonts/Lato-Bold.ttf  - family: PingFang    fonts:    - asset: lib/assets/fonts/PingFang.ttf

免责申明

⚠️本APP仅限于学习交换应用，我的项目中应用的图片及字体等资源如有侵权请分割作者删除

⚠️本APP接口数据均为mock，请勿用于其它商业目标

⚠️如应用本我的项目代码造成侵权与作者无关

我这求生欲????