Awesome Flutter筛选与实用度分析

简介

本文大部分内容翻译自 Github 中 Awesome Flutter 项目,该项目集合了当下学习 Flutter 的优秀文章及开源项目,然而该项目对于所陈列的项目只有简单的分类,并没有做简要的说明。

当然如果看不了英文可以去看这篇翻译的文章,Awesome Flutter中文版 是由国内Coder翻译的,翻译质量不错,但仍缺少对文章内容的概括。

这篇文章的目的是想做一个简单的梳理,并对文章内容进行简化,整理成适合初学者。

手把手教你动手Flutter

如果你觉得自己对属于自己的 Flutter App 一筹莫展时,你可以看看其他人是怎么开发的App,一下这些 App 功能简单,但是对于初学者,手打出来是很有帮助的,建议大家在编译器好好敲一敲,体会一下:

  • 开发一个安卓应用 —— 配置和开发第一个应用,作者是 Ashraff Hathibelagal。注意:采用的是IntelliJ IDEA,个别设置可能和 AS 不同,不过不影响程序的编写。这里并没有给出 Flutter 官方的教程,不知道为什么,可以通过第二篇跳转到官方给出的 Flutter 超级入门教学。
    难度:★
  • Animated Chat —— 创建漂亮的 UI,来自谷歌代码实验室(Google Code Labs)。
    如果说第一个侧重于如何使用编译器编写运行Flutter App,那么这个则是将内容具体到对于布局和控件的使用。
    难度:★
  • Firebase Chat —— Firebase integration,来自谷歌代码实验室。
    如果你想快速了解 Firebase 这个 Flutter 工具,那么这篇文章是你的入门之选,只需要你对面向对象语言有所掌握即可。
  • 难度:★
  • Planets-Flutter:从设计到开发 —— 详细的 planets design 教程。
    这是一个手把手教你做出好看应用的博客,设计到基础动画,页面跳转等知识,缺点是全英文,而且停更了
    难度:★~★★

个人博客

  • Flutter Institute
    既含有手把手教你写 App 的教程,并且更新一些开发中会遇到的问题。还算不错
    难度:★~★★★
  • Flutter by Example
    很推荐看的博客,里面涵盖了很多常用的控件工具库,例如网络库,动画库,登陆界面等等。强烈推荐!
    难度:★★

组件

示例

  • 官方 Gallery —— 来自 Flutter 团队的展示 Material Design 风格的 Widget 和一些其他功能展示的示例 APP。
    对于一些新功能,基础控件,参考官方的写法可能是最简单直白的,缺点是官网没有讲解部分,但是很全!
    实用度:★★★★
  • Flutter 示例(708 ★)—— 为 Flutter 开发者提供的一个简单基础的独立应用,作者是 Nishant Srivastava。
    类似于官方给出的,这两个结合观看基本上就可以设计出美观的 Flutter App 了
    实用度:★★★★

UI

这些 UI 设计是我挑出来比较实用的设计,其实都是很实用的,只不过对于我来说应用场景比较小,于是就落榜了。

  • Contact Picker —— 从通讯录里选取一个联系人,作者是 Michael Goderbauer
  • StaggeredGridView(115 ★)—— 具有不同尺寸磁贴(tile)的 GridView,作者是 Romain Rastel。
    实用度:★★★★
  • Sticky Header (27 ★) - 长条式固定headers by Romain Rastel.
    实用度:★★★
  • Sticky Headers (73 ★) - Configurable sticky headers by Simon Lightfoot.
    可以设置内容的固定headers。
    实用度:★★★
  • 径向菜单(76 ★)—— 带动画的径向菜单,作者是 Victor Choueiri。
  • Tinder 卡片(58 ★)—— Tinder like 卡片滑动效果,作者是 Ivascu Adrian。
    实用度:★★★
  • Login Animation (119 ★) - 从登录平滑过渡到主页的动画 Ruchika Gupta.
    实用度:★★★★★
  • List Drag&Drop (55 ★) - 表单内容拖拽by Norbert515.
    实用度:★★★★
  • Calendar Widget (8 ★) - 按照时间顺序记录事件的 widget by David Bennett.
    实用度:★★
  • Shimmer (55 ★) - Shimmer effect while content is loading by HungHD.
    给 widget 加波浪阴影特效
    实用度:★★★

图片

  • Image Picker —— 图片选择器,作者是 Collin Jackson。
    很实用的库,用来选择照片库中的一个图片,或是自己拍一张。
    实用度:★★★★★
  • Carousel Slider(42 ★)—— 旋转滑动小部件,支持无限滚动和自定义子部件,作者是 serenader。
    图片无限滑动
    实用度:★★★★
  • Photo View (25 ★) - Scalable image view with loading placeholder by Renan C. Araújo.
    图片放缩、截图管理、照片Galaxy集合
    实用度:★★★

导航、路由

  • Fluro(292 ★)—— 具有导航、通配符、查询、过渡动画的最亮、最时尚、最酷的 Flutter 路由器,作者是 Posse。
  • Circle Indicator(12 ★)—— PageViewer 的圆形指示器,作者是 Lung Razvan。
  • Quick Actions —— 与应用程序的主屏幕快速操作进行交互。
  • Swiper (12 ★) - Horizontal, Vertical, Partial swipe with indicator by Xueliang Ren.

认证

  • 本地身份验证 —— Ios 和 Android 上的 Touch ID、锁屏密码和指纹验证
  • Flutter 登录(96 ★)—— FaceID, TouchID, 还有指纹扫描,作者是 Rody Davis。
  • Google Sign-In —— Google 身份验证。
  • Firebase Auth —— Firebase 身份验证。
  • Facebook Login (62 ★) - Authenticate with native Android & iOS Facebook login SDKs by Iiro Krankka.
  • Flutter OAuth(44 ★)—— Buffer、Strava、Unsplash 和 Github 身份验证,作者是 Joe Birch。
  • Instagram —— Instagram 身份验证,作者是 Wilfried Mbouenda Mbogne。

文字和富文本

  • Masked Text (6 ★) - Masked text with custom and monetary formatting by Ben-hur Santos Ott.
    给文本输入加上自定义mask,比如信息遮盖 * 、或者自动添加 - 。等

风格

  • Flutterial(46 ★)—— Flutter Material 主题的探索者,作者是 Erick Ghaumez。
  • Frosted Glass —— 渲染器效果,作者是 Collin Jackson。
  • Font Awesome —— Font Awesome 图标包,作者是 Brian Egan。
  • FlutterIcon —— 图标字体生成器。
  • Pigment(27 ★)—— 简单但是很实用的在 Flutter 里面使用颜色的包。

多媒体

  • 音频插件(95 ★)—— Beta 版,作者是 Erick Ghaumez。
  • 录音机(24 ★)—— 录制音频并存储在本地,作者是 Jordan Alcaraz。
  • Stereo(22 ★)—— 在 iOS 和 Android 上面播放音乐,作者是 2Find。
  • WebRTC (80 ★) - WebRTC plugin for iOS/Android by CloudWebRtc.
  • Chewie (70 ★) - Provides low-level access to video playback by Brian Egan.

语音

  • Speech Recognition(41 ★)—— 语音转文字,作者是 Erick Ghaumez。
  • OK Google —— 整合了 Google 语音助手,作者是 Marcin Szalek。

存储

  • Firebase Storage —— 用 Firebase 作为数据存储设备。
  • Secure Storage (23 ★) - Keychain and Keystore storage by German Saprykin.

模板

  • Movie Details(93 ★)—— 电影详情页面,作者是 Iiro Krankka。
  • Flutter Mates(160 ★)—— 如何从 randomuser.me API 加载个人信息列表,并通过一个漂亮的页面展示个人信息详情,作者是 Iiro Krankka。
  • Weather(50 ★)—— 学习如何使用 Canvas 和动画去制作天气应用,作者是 Alessandro Aime。
  • TodoMVC(644 ★)—— 准备使用不同框架的备忘录应用:Vanilla, Redux, built_redux,作者是 Brian Egan。
  • Restaurant Menu(219 ★)—— 饭店菜单,作者是 Braulio Cassule。
  • UI 挑战(222 ★)—— 个人信息应用、旅行应用、美食应用,作者是 Tomi Alagbe。
  • Cupertino Settings(19 ★)—— iOS 设置,作者是 Matthias Rupp。
  • Music Player(59 ★)—— 音乐播放器部件,作者是 Tobe O。
  • Dashboard(142 ★)—— 仪表板和商品列表,作者是 Ivascu Adrian。
  • Todo (94 ★) - Todo template from Dribble by Marc L.
  • Card Swipe Animation (40 ★) - Swipe cards template by Ruchika Gupta.

插件

  • Flutter 插件 —— Flutter 团队的官方插件
  • Sqflite(221 ★)—— SQLite 的 Flutter 插件,作者是 Alexandre Roux。
  • WebView(152 ★)—— 作者是 Hadrien Lejard。
  • Pub Plugins —— Dart Pub Repository 的筛选插件。
  • Flutter Location(79 ★)—— 处理位置,处理回调以获得连续的位置,作者是 Lyokone。
  • QR Code Reader(32 ★)—— 二维码扫描插件,作者是 Matheus Villela。
  • Battery —— 获取电池相关的各种信息。
  • Zebra EMDK(3 ★)—— 使用 Zebra EMDK 来获取 Barcode Scanner API。
  • Proximity Sensor Plugin —— 一个可以访问你设备上的距离传感器(proximity sensor)的插件,作者是 Manoj NB。
  • Geolocation(72 ★)—— 功能齐全的地理位置插件:当前位置,位置更新,地理编码,地点等等,作者是 Loup。
  • Local Notifications(62 ★)—— 展示本地通知的插件,作者是 Michael Bui。
  • App Rating(20 ★)—— 为 App Store 和 Google Play 评分和写评论,作者是 Rody Davis。
  • Get Version(13 ★)—— 获取版本名、版本号、App ID 和带有操作系统版本的平台信息,作者是 Rody Davis。
  • Downloader (23 ★) - Create and manage download tasks by HungHD.
  • Place Dialog (9 ★) - Places picker dialog returning the places to the app by David Bennett.
  • Cached Network Image (61 ★) - Show images from the internet and keep them in the cache directory by Rene Floor.
  • Device Calendar - Plugin for modifying calendars on the user’s device by Built to Roam.

蓝牙 / NFC / Beacon

  • Flutter Ble(45 ★)—— 蓝牙,作者是 Polidea
  • Flutter Blue(142 ★)—— 蓝牙,作者是 Paul DeMarco。
  • NFC (12 ★) - Connect IsoDep iso 14443-4 cards for android by Göksel Uyulmaz.
  • Beacons (4 ★) - Flutter beacons plugin by Loup.

开源 APP

当学会了一些基础之后,可以去看看别人编写的 App 来提高自己对于 App 设计模式以及层级结构的理解,没有结构和层次的 App 是很糟糕的。

  • FriendlyChat(106 ★)—— 一群谷歌员工开发的离线或者是基于 Firebase 的聊天应用。
  • Meme Chat(244 ★)—— Flutter 上的聊天应用,用到了 Firebase、谷歌登陆和设备相机集成,作者是谷歌员工。
  • Flitter(83 ★)—— Glitter 客户端,作者是 Hadrien Lejard 和 Kevin Segaud。里面用到了 Redux 和 Jaguar。
  • Lime ——(129 ★)Lime 是 Sebastian Sellmair 开发的社交网络应用。
  • Planets-Flutter(149 ★)—— 显示了丰富 UI 的行星探索应用,作者是 Sergi Martínez。
  • NewsBuzz(175 ★)—— 从 News API 获取数据并使用 Firebase 做后台的新闻阅读器,作者是 Ankur Kedia。
  • DroidKaigi2018-flutter(226 ★)—— 东京 DroidKaigi 2018 的非官方会议应用,作者是 konifar。
  • Music Player(178 ★)—— Pawan Kumar 开发的全功能音乐播放器。
  • InKino(820 ★)—— 完整的电影应用程序,使用 Flutter_Redux 框架进行状态管理,具有很好的过渡动画,以及一套很全面的小部件还有单元测试,作者是 Iiro Krankka。
  • WhatTodo (105 ★) - Todoist like UI by Burhanuddin Rashid.
  • FlutterGram (74 ★) - Complete Instagram based on Firestore & Google Functions by MDanics.
  • BookSearch (97 ★) - Digital BookShelf for your reading progress by Norbert515.
  • Cinematic (145 ★) - UI for Movie DB Public API by Aaron Oertel.
  • Beer-Me-Up (75 ★) - Beer tracking nicely designed by Benoit Letondor.

以上这些开源代码质量都还是比较高的,大家可以有针对性地看其中的一两个。

更多Flutter App开发记录

详细全程和代码分析,请看我的个人博客

你可能感兴趣的:(Flutter)