背景
从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_flutter
description: A new Flutter project.
version: 1.0.0+1
environment:
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.2
dev_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，请勿用于其它商业目标
⚠️如应用本我的项目代码造成侵权与作者无关
我这求生欲????
发表回复