推荐7个Flutter重磅开源项目

36次阅读

共计 3868 个字符，预计需要花费 10 分钟才能阅读完成。

当初跨平台开发技术的倒退堪称热火朝天，而跨平台中的双雄则是 ReactNative 和 Flutter。而由 Google 推出的 Flutter 目前的倒退更堪称是如日中天，大有一统各端开发的架势，以此给大家整顿了一个优质的 Flutter 开源我的项目，帮忙大家学习 Flutter 开发。
@[toc]

1.Flutter 仿携程 App

（1）利用截图：

（2）实现性能及个性

实现首页、搜寻、旅拍、我的四大模块；
实现网络图片本地缓存；
旅拍模块实现瀑布流布局；
接口数据抓取携程 H5 端；
集成友盟数据统计；

（3）我的项目构造：

依赖：

azlistview: ^0.1.2
cupertino_icons: ^0.1.2
cached_network_image: ^1.1.1
dio: ^3.0.3
flutter_swiper: ^1.1.6
flutter_staggered_grid_view: ^0.3.0
flutter_splash_screen: ^0.1.0
fluttertoast: ^3.1.3
flutter_webview_plugin: ^0.3.8
lpinyin: ^1.0.7
package_info: ^0.4.0+6

(4)我的项目地址：

Github 地址：https://github.com/wkl007/flu…

2.Flutter 仿微博客户端

（1）利用截图：

（2）实现性能：

仿微博最新版本, 还原微博 80% 的界面, 总共波及到了几十个界面和接口, 用到了 flutter 中的大部分组件
分为首页 视频 发现 音讯 我的五个模块

（3）依赖：

cupertino_icons: ^0.1.2
  #https://github.com/luanpotter/audioplayers
audioplayers: ^0.14.0
  #https://github: com/best-flutter/flutter_swiper
flutter_swiper: ^1.1.6
   #https://github.com/best-flutter/flutter_page_indicator
flutter_page_indicator: ^0.0.3
  #https://github.com/flutter/plugins/tree/master/packages/video_player
video_player:
  # https://github:com/brianegan/chewie:
chewie: ^0.9.5
  #https://github.com/flutterchina/azlistview
azlistview: ^0.1.2
  #https://github.com/flutterchina/lpinyin
lpinyin: ^1.0.9
  # https://github:com/fluttercandies/extended_text_field:
extended_text_field: ^0.5.0
url_launcher: 5.3.0
  # https://github: com/fluttercandies/extended_nested_scroll_view:
extended_nested_scroll_view: ^0.4.0

(4)我的项目地址：

Github 地址：https://github.com/huangruiLe…

3.Flutter 仿抖音 App

（1）利用截图：

（2）实现性能：

高低刷视频，视频会主动加载封面

左右滑动去搜寻与集体核心

双击冒爱心点赞

看评论

切换底部 Tabbar

（3）我的项目构造：

依赖：

  # 加载动画库(如同改版之后就没用到了)
flutter_spinkit: ^4.1.2
  # Bilibili 开源的视频播放组件
fijkplayer: ^0.8.3
  # 根底的通明动画点击成果
tapped: any
  # map 平安取值
safemap: any

次要文件：

./lib
├── main.dart
├── mock
│   └── video.dart # 假数据
├── other
│   └── bottomSheet.dart # 批改了零碎 BottomSheet 的高度
├── pages
│   ├── cameraPage.dart # 拍摄页（没有理论性能）│   ├── followPage.dart  # 略
│   ├── homePage.dart # 主页面，蕴含 tikTokScaffold 的理论利用性能
│   ├── msgDetailListPage.dart # 略
│   ├── msgPage.dart # 略
│   ├── searchPage.dart # 略
│   ├── todoPage.dart # 略
│   ├── userDetailPage.dart # 略
│   ├── userPage.dart # 略
│   └── walletPage.d # 略
├── style
│   ├── style.dart # 全局文字大小与色彩
│   └── text.dart # 次要的几个文字款式
└── views
    ├── backButton.dart # iOS 形态的返回按钮组件
    ├── loadingButton.dart # 能够设置为载入款式的按钮组件
    ├── selectText.dart # 可设置为“选中”或者“未选中”款式的文字
    ├── tikTokCommentBottomSheet.dart # 仿 Tiktok 评论款式
    ├── tikTokHeader.dart # 仿 Tiktok 顶部切换组件
    ├── tikTokScaffold.dart # 仿 Tiktok 外围脚手架，封装了手势与切换等性能，自身不蕴含 UI 内容
    ├── tikTokVideo.dart # 仿 Tiktok 的视频 UI 款式封装，不蕴含视频播放
    ├── tikTokVideoButtonColumn.dart # 仿 Tiktok 视频右侧的头像与点赞等按钮列的组件
    ├── tikTokVideoGesture.dart # 仿 Tiktok 的双击点赞成果
    ├── tikTokVideoPlayer.dart # 视频播放页面，带有管制滑动的 VideoListController 类
    ├── tiktokTabBar.dart # 仿 Tiktok 的底部 Tabbar 组件
    ├── tilTokAppBar.dart # 仿 Tiktok 的 Appbar 组件
    ├── topToolRow.dart # 用户页面的顶部状态，在 tab 切换到 user 页面时暗藏返回按钮
    └── userMsgRow.dart # 一条用户信息的款式组件

(4)我的项目地址：

GitHub 仓库地址：https://github.com/mjl0602/fl…

4.Flutter 仿斗鱼 App

（1）利用截图：

（2）实现性能：

flutter 重构的斗鱼直播 APP
首页、娱乐为 Material 组件开发；直播间、鱼吧为纯自定义编写。

启动页广告位
开播列表上拉加载、下拉刷新、返回顶部
列表图片缓存加载优化
渐进式头部动画
底部导航切换保留页面状态
HTTP 缓存、IO 缓存
直播间 webSocket 音讯弹幕、礼物
页面路由传值
RxDart 全局音讯通信封装
Bloc 流式状态治理(启动页预加载首页数据)
礼物横幅动画队列
礼物全屏 svga 特效
弹幕音讯滚动
动态视频流
九宫格抽奖游戏
照片选择器
全屏、半屏 webView
鱼吧头部手势动画
仿微信朋友圈图片控件
登录注册弹窗
国家区号列表 (仿微信通讯录滑动首字母定位)
二维码扫码
本地告诉推送
…
继续减少中

（3）我的项目地址：

GitHub 仓库地址：https://github.com/yukilzw/dy…

5.Flutter 仿开源中国客户端 App

（1）利用截图：

iOS

Android

（2）实现性能：

登录（应用 osc 账号）
查看资讯（未登录即可查看）
查看、回复、发表、评论动弹（须要登录）
动弹小黑屋（须要登录）
“发现”局部的性能基本上都是用 H5 实现
资讯列表、动弹列表、评论列表反对下拉刷新或分页加载
反对主题切换（入口在侧滑菜单 - 设置 - 切换主题）
动弹中的图片预览暂未实现
摇一摇、“我的”页面性能临时没实现

（3）我的项目地址：

Github 地址：https://github.com/yubo725/fl…

6.Flutter 仿豆瓣客户端 App

（1）利用截图：


（2）实现性能：

首页 pages/home
homo_app_bar.dart 首页导航头
home_page.dart 首页
my_home_tab_bar.dart 首页 tab
书影音 pages/movie
book_audio_video_page.dart 书影音页面
detail_page.dart 影片、电视详情页面
person_detail_page.dart 演员页面介绍
小组 pages/group
市集 shop_page.dart
市集的数据应用两个 webview
我的 page/person

（3）我的项目地址：

Github 地址：https://github.com/kaina404/F…

7. 闲鱼技术实际开源

阿里的咸鱼技术团队在国内进行 Flutter 技术钻研是比拟早的，当初咸鱼 APP 中的许多模块也是采纳了 Flutter 进行开发，同时也开源了很多技术框架以及相应的​技术文档。


去年咸鱼团队公布了《Flutter in action》电子书，总结了在咸鱼 APP 开中的实践经验，当初又进行思考翻新重新整理的升级版的文档，公布了《Flutter 技术解析与实战》。

目前本书的电子版凋谢下载 (30M 左右，请开启 wifi 环境)，我曾经帮大家下载好了。
大家能够依照上面步骤进行获取​：
1. 保留并用微信扫码二维码，关注君伟说​。
2. 回复​：Flutter 开发，即可​获取。

正文完
flutter
发表至： flutter
2020-07-15
 0
Flutter-应用开发之Bloc模式
关于flutter:Flutter-14Windows下VSCode配置Flutter开发环境
关于flutter:flutterwebviewplugin-加载全屏页面的简单使用
关于flutter:20个你应该了解的Flutter库