一个Flutter的电商实战项目,包括首页、列表页、详细页、购物车页和会员中心,配有全套文字和视频教程。

Overview

Flutter的移动电商实战

项目和教程都在更新中............

完全模仿了百姓生活+小程序的项目,数据来自Fiddle提取,有完整的接口API文档。页面包括首页、商品列表页、商品详细页、购物车页面和会员中心。

目前项目还在开发当中,配有完整的视频和文字教程,是你Flutter进阶必备项目。

教程文章地址

教程文章地址(60节,超5万字教程,持续更新中):https://jspang.com/post/FlutterShop.html

用到的组件

  • dio:用于向后端接口作HTTP请求数据
  • flutter_swiper: 轮播插件,制作了商城首页的轮播效果
  • flutter_screenutil:用于不同屏幕的适配,一次设计,适配所有屏幕
  • url_launcher:用于打开网页和实现原生电话的拨打
  • flutter_easyrefresh:下拉刷新或者上拉加载插件,方便好用,可定制。
  • provide:谷歌最新推出的Flutter状态管理插件,亲儿子,用的爽。
  • fluttertoast:Toast轻提示插件,APP必不可少,IOS和Android通用。

图片展示

商城图片

所有项目知识点梳理

知识点梳理

更新日志:

  • 商品分类页面增加了打开详细页的功能。[2019/4/23]

  • 更新首页的分类导航,跳转到分类页面,并且可以跟随变化。[2019/4/22]

  • 商品详细页面主要UI布局完成,还有app的路由系统制作完成。[2019/4/4]

  • 第一次上传项目到GitHub上,我已经写了35课教程,把首页和商品分类页面制作完成。[2019/3/28]

知识架构图

一起学习

我建立了一个QQ群,大家一起学习:

qq群:806799257

入群问题:Flutter出自于哪个公司?

入群答案:google (注意全小写,最好用电脑端加入,移动端Bug)

Comments
  • 项目运行不了报错

    项目运行不了报错

    • What went wrong: Execution failed for task ':app:processDebugResources'.

    Android resource linking failed Output: D:\Android\asFlutterwork\flutter_shop-master\build\app\intermediates\incremental\mergeDebugResources\merged.dir\values\values.xml:86: error: resource android:attr/fontVariationSettings not found. D:\Android\asFlutterwork\flutter_shop-master\build\app\intermediates\incremental\mergeDebugResources\merged.dir\values\values.xml:87: error: resource android:attr/ttcIndex not found. error: failed linking references.

    opened by Sundayw 2
  • 2020-10: 🔥🔥🔥 编译出错的, 可参考我这个 fork 修复分支

    2020-10: 🔥🔥🔥 编译出错的, 可参考我这个 fork 修复分支

    修复编译报错问题:

    • https://github.com/better-dart/flutter_shop
    • 分支: hotfix-2020-10
    • 本 fork 分支, 会补充一些代码注释. 初学研究, 共同学习. 😄

    fix:

    • [x] 指定 flutter 版本: 1.17.5, 这个版本比较新. 适合初学.
      • [x] flutter 1.22.0 之后的版本, 在 iOS+xcode 下, 会遇到各种奇怪编译报错. 不建议初学使用.
    • [x] 依赖包: 修复版本报错.
    • [x] 数据API URL: 根据 issue, 找到新的可用 API URL.

    run:

    • 默认使用 flutter 1.17.5 版本.
    • 执行:
    flutter run 
    

    PR:

    • https://github.com/shenghy/flutter_shop/pull/15
    • PR 在这里.
    opened by hhstore 1
  • 代码跑不起来

    代码跑不起来

    Error output from Xcode build: ↳ ** BUILD FAILED **

    lib/routers/routes.dart:3:1: Error: 'Router' is imported from both 'package:flutter/src/widgets/router.dart' and 'package:fluro/src/router.dart'.

    opened by surfsky 2
  • 按照教程, 使用flutter Dio伪造请求头, 请求失败, 提示 Refused to set unsafe header

    按照教程, 使用flutter Dio伪造请求头, 请求失败, 提示 Refused to set unsafe header "host"

    网上查了资料,发现有人说现在请求头不能写某几个key? 然后看了Dio库里的Headers类,发现里面有默认支持的几个key

    httpHeaders = { Headers.acceptHeader: "application/json, text/plain, /", Headers.contentEncodingHeader: "gzip, deflate, br, drop", Headers.contentLengthHeader: '', Headers.contentTypeHeader: 'application/json' }

    是不是除了这几个,其他的都不支持呢(比如'origin')

    跪求解惑,拜托大家了

    opened by drooop 0
  • 分类的provide有问题

    分类的provide有问题

    上拉加载到底之后改变noMoreText之后 发送provide会导致左侧的provide监听执行 然后会拉去大分类下所有数据的第一页,但是这个时候你又把noMoreText设置为 没有更多了 就会导致只显示一页

    //改变noMoreText数据
    changeNoMore(String text){ noMoreText=text; notifyListeners(); } 去掉这个 notifyListeners(); (会造成第一次加载完没有提示 第二次才会提示) 或者再写一个provide监听nomoretext的改变

    opened by devkou 0
Owner
技术胖
我从2007年开始从事编程工作,头发也随着经验的增长,慢慢的离开了我。 目前作为一个秃头程序员,已经有7年以上的时间了。 业余爱好就是写写博客,录录视频课程。
技术胖